⚗️ Try & check storage access API

server.ts

@@ -11,8 +11,6 @@ app.use(async (ctx) => {
     ctx.set("Set-Cookie", [
       `cookie-none=${cookie.replace(/[^A-Za-z0-9]+/g, '-')}; SameSite=None; Secure`,
       `cookie-lax=${cookie.replace(/[^A-Za-z0-9]+/g, '-')}; SameSite=Lax; Secure`,
-      `cookie-none-top-level=${cookie.replace(/[^A-Za-z0-9]+/g, '-')}; SameSite=None; Secure; Domain=hf.space`,
-      `cookie-lax-top-level=${cookie.replace(/[^A-Za-z0-9]+/g, '-')}; SameSite=Lax; Secure; Domain=hf.space`,
     ]);
     ctx.redirect( "/");
   } else {
@@ -21,15 +19,38 @@ app.use(async (ctx) => {
       <pre>${JSON.stringify(Object.fromEntries(Object.entries(ctx.request.headers)), null, 2)}</pre>
       <p>Cookie SameSite=None: ${ctx.cookies.get("cookie-none")?.replace(/</g, '$lt;')}</p>
       <p>Cookie SameSite=Lax: ${ctx.cookies.get("cookie-lax")?.replace(/</g, '$lt;')}</p>
-      <p>Cookie SameSite=None Top-Level: ${ctx.cookies.get("cookie-none-top-level")?.replace(/</g, '$lt;')}</p>
-      <p>Cookie SameSite=Lax Top-Level: ${ctx.cookies.get("cookie-lax-top-level")?.replace(/</g, '$lt;')}</p>
       <form method="POST">
         <label>Cookie value<br>
           <input type="text" name="cookie" />
         </label>
         <button>Send</button>
       </form>
+      <p>Browser supports storage access API: <span id="storage-access-api"></span></p>
+      <p>Page can store cookies: <span id="page-can-store-cookies"></span></p>
+      <button id="request-storage-access" style="display: hidden;" type="button">Request storage access</button>
     </body>
+    <script>
+      const storageAccess = document.getElementById("storage-access-api");
+      const pageCanStoreCookies = document.getElementById("page-can-store-cookies");
+      const requestStorageAccess = document.getElementById("request-storage-access");
+      if ("hasStorageAccess" in document) {
+        storageAccess.innerText = "Yes";
+        document.hasStorageAccess().then((hasAccess) => {
+          pageCanStoreCookies.innerText = hasAccess ? "Yes" : "No";
+          if (!hasAccess) {
+            requestStorageAccess.style.display = "block";
+          }
+        });
+      } else {
+        storageAccess.innerText = "No";
+      }
+      requestStorageAccess.addEventListener("click", () => {
+        document.requestStorageAccess().then(() => {
+          pageCanStoreCookies.innerText = "Yes";
+          requestStorageAccess.style.display = "none";
+        });
+      });
+    </script>
   </html>`;
   }
 });