※ はてなブログからこちらへ技術ネタを移動しました
※ 2017-09-25 初稿
iOSのアップデートをしました。iOS 11です。
純正ブラウザであるSafariにも公表されていない仕様変更がいくつかある模様です。
今回はそのうちの一部であるCORS処理について。
※ 雑な検証の上で判った（つもりになっている）仕様変更点です。
【変更点】
CORS (Cross Origin Resource Sharing)関連のレスポンスヘッダである
Access-Control-Allow-Originヘッダーにワイルドカードが使えない（または、使えない場合がある）。
これまでも、xhr.withCredentials = true ならばAccess-Control-Allow-Origin: http:///hoge.example.net のようにワイルドカードでない値を返す必要があったが、xhr.withCredentials = false でもそのようにすべき、という事になりました。
バグかもしれませんが、新仕様かもしれません。
【追記】上記はもしかすると大嘘かもしれません。追加検証中ですが、safariのブラウザキャッシュがOriginヘッダの有無を考慮していないのが原因で現在私がトラブっているだけかもしれません。
【追記】大嘘でした。開発中のWebアプリケーション内で、Cross OriginなResourceに対するリクエストが「1. browser-nativeなloader経由」と「2. XHR経由」で重複して発生しているのが原因でハマってました。
1が先に起こる＝Originヘッダなしリクエストに対してCORS関連ヘッダのないレスポンスが帰ってきてブラウザにキャッシュされる。
続いて、2のリクエストが起こる＝CORSヘッダの無いブラウザキャッシュが返るが、その後段のcross originチェックで弾かれてxhrがfailする。
という流れです。前々から気になっていたことですが、やはりSafariはブラウザキャッシュの管理が雑すぎて時々ハマります。
【追記終わり】
by-nameでAccess-Control-Allow-Originヘッダを作る方法。
S3の場合、CORS設定のルールの中で
<AllowedOrigin>*</AllowedOrigin>
となっている部分を
<AllowedOrigin>http://*</AllowedOrigin>
<AllowedOrigin>https://*</AllowedOrigin>
と変更すれば良いみたいです。
自前appサーバの場合は自分でCORSヘッダーをうまく作ってください。