Menu
I investigate a possibility to use Storage Access API https://developer.mozilla.org/en-US/docs/Web/API/Storage_Access_API/ to get an access to first party cookies from 3rd iframe. The problem is that despite Storage Access API gave me an access, document.cookie inside iframe is different than the one above.
I use Firefox 67, dom.storage_access.enabled is set to true. I read all the documentation on MDN and webkit.org, but still can't make it work.
This is top-level page served from local HTTP server first.test:8002/
<html>
<head>
<script type="application/javascript" src="http://bcjs.test:8003/app.js"></script>
<script type="application/javascript">
{
const key="KEY"
const value="42"
const c = "KEY=42"
document.cookie = c
console.log("document.cookie=", document.cookie)
window.localStorage[key] = c;
console.log("window.localStorage[KEY]=", window.localStorage[key])
}
</script>
</head>
<body>
<!-- injected by app.js above -->
<iframe sandbox="allow-storage-access-by-user-activation allow-scripts allow-same-origin" src="http://bcjs.test:8003/ff-iframe.html"></iframe>
</body>
</html>
And the iframe contains following code (it is mostly copy from MDN linked above)
<html>
<head>
function makeRequest() {
document.hasStorageAccess().then(hasAccess => {
if (hasAccess) {
console.log("document.hasStorageAccess")
} else {
return document.requestStorageAccess()
}
}).then(_ => {
// example from MDN
console.log("3rd party: document.cookie=", document.cookie)
document.cookie = "foo=bar"; // set a cookie
const key = "KEY";
console.log("window.localStorage[KEY]=", window.localStorage[key])
console.log("document=", document)
console.log("window=", window)
console.log("window.parent=", window.parent)
console.log("window.parent.document=", window.parent.document)
}).catch(reason => {
console.log("Some promise have failed, reason=", reason)
})
}
</script>
</head>
<p>
<button onclick="makeRequest()">Make request</button>
</p>
</html>
So the intent is hopefully clear
1. 1st party will store KEY=42 into document.cookie
2. 3rd party iframe requests and access and print the document.cookie and store foo=bar there.
The problem is that cookies and storage looks different despite the fact hasStorageAccess or requestStorageAccess resolves to true. I would expects that document.cookie will now resolve to the first party store.
document.cookie= KEY=42 #b.html:31:10
window.localStorage[KEY]= KEY=42 #b.html:34:10
3rd party: document.cookie= foo=bar #ff-iframe.html:25:17
window.localStorage[KEY]= undefined #ff-iframe.html:28:17
document= HTMLDocument http://bcjs.test:8003/ff-iframe.html #ff-iframe.html:30:17
window= Window http://bcjs.test:8003/ff-iframe.html #ff-iframe.html:31:17
window.parent= Window http://blesk.test:8002/b.html #ff-iframe.html:32:17
Some promise have failed, reason= DOMException: "Permission denied to access property "document" on cross-origin object" #ff-iframe.html:36:17
Note that DOMException does not have any impact on my ability to access the first party cookies. I originally used the form described at https://webkit.org/blog/8124/introducing-storage-access-api/, but calling .then with two function callbacks did not make any difference in accessing the Cookie Jar.
Any clue where can be the problem? Or is the feature too experimental, that it can be buggy now?
929
Looks like your click event is being obscured by the document.hasStorageAccess() promise. Have you tried executing document.requestStorageAccess() directly inside the click handler instead of inside the hasStorageAccess callback?
52
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
