ICS file Download fails on iPhone Chrome with "Unknown File Type"
It looks like a bug in Chrome for iOS. See https://bugs.chromium.org/p/chromium/issues/detail?id=666211
most examples I see are in lowercasehttp://www.w3.org/Protocols/rfc1341/4_Content-Type.html
try making that
Content-Type: text/calendar
not
Content-Type: text/Calendar
Use webcal://your_link.ics
This should solve your problem. Here's a preview of how it'll appear
Here's a jsbin demonstrating automatic selection of protocol basis the user agent.
HTML:
<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width"> <title>JS Bin</title></head><body> <a href="webcal://w3assets.angelbroking.com/wp-content/uploads/2020/07/ANGEL_BROKING_MONSOON_FESTIVAL.ics">Test webcal://</a> <br><br> <a href="https://w3assets.angelbroking.com/wp-content/uploads/2020/07/ANGEL_BROKING_MONSOON_FESTIVAL.ics">Test https://</a> <br><br> <a id="auto" href="https://w3assets.angelbroking.com/wp-content/uploads/2020/07/ANGEL_BROKING_MONSOON_FESTIVAL.ics">Auto (check JS)</a> <br><br> <textarea readonly id="ua"></textarea></body></html>Javascript:
// Source: https://stackoverflow.com/a/9039885/3577736function is_iOS() { return [ 'iPad Simulator', 'iPhone Simulator', 'iPod Simulator', 'iPad', 'iPhone', 'iPod' ].includes(navigator.platform) // iPad on iOS 13 detection || (navigator.userAgent.includes("Mac") && "ontouchend" in document)}if(is_iOS()) { document.getElementById('auto').href = document.getElementById('auto').href.replace(/https?:/, 'webcal:');}// Debuggingdocument.getElementById('ua').value = navigator.userAgent;CSS:
textarea { width: 100%}