Safariフラットアウトでは、親ドメインとは異なるドメインのiframeにCookieを設定できません。サーバー側のCORSヘッダーは抑制されます。
明確にするために:ユーザーはdomainA.comにいます。 domainB.comのiframeが開いており、iframe内のdomainB.comでユーザーを認証しようとします。 Set-Cookieヘッダーは、必要なすべてのヘッダーとともに、domainB.com iframe内のサーバーから返されますが、Safariは後続の呼び出しでそれを送り返しません。
以前の回避策は、iframeからフォームを送信し、応答にCookieを設定することでした。ユーザーが何かをクリックしてフォームを送信しているという事実を好んでいたと思います。フォームの送信にはコールバックがないため、Cookieをポーリングして応答がいつ返されたかを確認する必要があります。また、HttpOnly Cookieの場合はできませんでしたが、うまくいきました。それがなかったまで。
次に、より最近の回避策は、ユーザーを真新しいウィンドウ/タブでiframeドメインにリダイレクトし、そこにランダムなCookieを設定し、その瞬間から、そのサブドメインがiframe内で「信頼」されたことです。ここでも、新しいウィンドウ/タブを開くにはクリックが必要で、新しいタブが開いていることを視覚的に示すこともありました。多くのセキュリティ、そのような標準。
そして今、Safari 13以降-回避策はありません。安全なiframe Cookieの設定はありません????
その他の認証スキームは、私たちには適していません(Auth-Xヘッダーなど)。 HttpOnlyセキュアCookieを使用する必要があります。これは、そのトークンにJavaScriptクライアント側からアクセスできないようにするためです。
明確にするために、すべてが他のブラウザでうまく機能します。
誰か提案はありますか?
編集:
リンク@tomschmidtをありがとう、それは正しい方向のようです。 AppleのStorage Access APIを使用してみましたが、残念ながら、APIを使用してログインロジックを初期化する前にアクセスをリクエストするようにしていますが、
requestStorageAccess = async() => {
return new Promise(resolve => {
//@ts-ignore
document.requestStorageAccess().then(
function () {
console.log('Storage access was granted');
resolve(true);
},
function () {
console.log('Storage access was denied');
resolve(false);
}
);
});
}
const storageAccessGranted = await requestStorageAccess();
console.log(storageAccessGranted) // prints 'true'
await login();
それでも、/ login API応答で受信したCookieは、APIへの後続の呼び出しで送信されません:(
したがって、新しいウィンドウに保存したいCookieが保存されている限り、回避策はまだ機能します。それでもiframeは独自のCookieを保存できません。私の場合、必要なのはセッションID Cookieだけでした。そのため、ユーザーがストレージアクセスを許可すると、小さなポップアップウィンドウが開きます。セッションID Cookieを取得して保存し、iframeを閉じてリロードします。その後、iframeはセッションID Cookieにアクセスし、それを後続のリクエストで送信します。これは一時的なものだと思いますが、将来的にポップアップウィンドウからストレージアクセスを削除する予定です。たぶん、それまでにiframeがcookieを保存できなくなるのを修正するでしょう。