requestStorageAccessFor() - First-Party Sets demo

๐Ÿง‘โ€๐Ÿ’ป Code for this page.

This demo uses two sites: and, which are both part of the same First-Party Set. sets a cookie named crossSite to that will be allowed in the cross-site, same-set contexts via the Storage Access API.

๐Ÿช crossSite cookie sent on cross-site, same-set requests? [โ€ฆ]

  1. Check navigator.permissions.query({name: 'top-level-storage-access', requestedOrigin: ''}).then(res => {โ€ฆ} and see that res.state is [โ€ฆ].
    1. If prompt we need to put the document.requestStorageAccessFor('').then(res => {โ€ฆ}) behind a user gesture, e.g. clicking a button:
      โ†’ [โ€ฆ]
    2. If granted we can just call document.requestStorageAccessFor('').then(res => {โ€ฆ}) immediately โ†’ [โ€ฆ]
  2. After a successful requestStorageAccessFor() call, cross-site requests will include cookies if they include CORS or the crossorigin attribute.

๐Ÿช crossSite cookie sent on subsequent cross-site, same-set requests? [โ€ฆ]