Hi everyone,
I’m resurrecting a problem that has already been raised, but how do I get Phoenix Liveview to work in an iframe on Safari?
The problem is: by default Safari blocks cookies from an iframe, which seems to block the Phoenix websocket connection: {response: {reason: "stale"}, status: "error"} . Resulting in a frozen page, even when the iframe works on every other browser.
I found a first piece of solution in a link shared in this old topic (that I did not dare to necropost) → Safari Websocket Connection Problems in iframe - endless reload - #4 by Waschti
This script (from Safari iframe cookie workaround · GitHub 's comments) :
<script>
// Safari now suddenly blocks iframe cookie access, so we need to call this during some user interaction
function safariFix() {
if (navigator.userAgent.search("Safari") >= 0 && navigator.userAgent.search("Chrome") < 0) {
document.requestStorageAccess().then(() => {
// Now we have first-party storage access!
console.log("Got cookie access for Safari workaround");
// Let's access some items from the first-party cookie jar
document.cookie = "foo=bar"; // drop a test cookie
}, () => { console.log('access denied') }).catch((error) => {
// error obtaining storage access.
console.log("Could not get access for Safari workaround: " + error);
});
}
}
</script>
Allows you to create a cookie and bypassing the blocking. But I don’t understand how this could allow me to make my websocket work?
Any idea to help me ? Thanks in advance.
