Beacon API Cannot load due to access control checks when navigating to new page
I have a navigation.sendBeacon request being sent during a pagehide event on Safari with some analytics data to an endpoint on the same domain as the current page. This works fine when the tab is being closed, but when navigating to a new url, Safari throws Beacon API Cannot load <url> due to access control checks while trying to make the request.
This issue does not occur on Chrome, and there are no other logs shown. I don't think this is a CORS request, all domains and subdomains are the same.
Has anyone else seen this or know how to fix?
javascript safari
asked Apr 26 '18 at 22:15
RyanCheuRyanCheu
1,54342441
|
show 1 more comment
I have a navigation.sendBeacon request being sent during a pagehide event on Safari with some analytics data to an endpoint on the same domain as the current page. This works fine when the tab is being closed, but when navigating to a new url, Safari throws Beacon API Cannot load <url> due to access control checks while trying to make the request.
This issue does not occur on Chrome, and there are no other logs shown. I don't think this is a CORS request, all domains and subdomains are the same.
Has anyone else seen this or know how to fix?
javascript safari
asked Apr 26 '18 at 22:15
RyanCheuRyanCheu
1,54342441
HI, I am also facing same issues in safari browser, can any one let me know the solution. Thanks.
– Hari c
Apr 27 '18 at 12:43
@RyanCheu I am encountering the same issue. any workarounds / fixes / relevant info you;v learned ? is it a confirmed bug that was not yet filed on the webkit bug system ?
– OrenM
May 30 '18 at 8:02
@OrenM I wasn't able to work around this, it'd probably be good to file a bug.
– RyanCheu
Jun 6 '18 at 20:50
@RyanCheu did you file a bug? If so can you link to it here? Note: this is definitely not a CORS issue because I runsendBeacon()just fine in situation where the page is not unloading.
– Philip Walton
Aug 2 '18 at 0:31
3
Filed: bugs.webkit.org/show_bug.cgi?id=188329
– Philip Walton
Aug 4 '18 at 16:59
|
show 1 more comment
I have a navigation.sendBeacon request being sent during a pagehide event on Safari with some analytics data to an endpoint on the same domain as the current page. This works fine when the tab is being closed, but when navigating to a new url, Safari throws Beacon API Cannot load <url> due to access control checks while trying to make the request.
This issue does not occur on Chrome, and there are no other logs shown. I don't think this is a CORS request, all domains and subdomains are the same.
Has anyone else seen this or know how to fix?
javascript safari
asked Apr 26 '18 at 22:15
RyanCheuRyanCheu
1,54342441
I have a navigation.sendBeacon request being sent during a pagehide event on Safari with some analytics data to an endpoint on the same domain as the current page. This works fine when the tab is being closed, but when navigating to a new url, Safari throws Beacon API Cannot load <url> due to access control checks while trying to make the request.
This issue does not occur on Chrome, and there are no other logs shown. I don't think this is a CORS request, all domains and subdomains are the same.
Has anyone else seen this or know how to fix?
javascript safari
javascript safari
asked Apr 26 '18 at 22:15
RyanCheuRyanCheu
1,54342441
asked Apr 26 '18 at 22:15
RyanCheuRyanCheu
1,54342441
asked Apr 26 '18 at 22:15
RyanCheuRyanCheu
1,54342441
asked Apr 26 '18 at 22:15
RyanCheuRyanCheu
1,54342441
asked Apr 26 '18 at 22:15
RyanCheuRyanCheu
1,54342441
1,54342441
HI, I am also facing same issues in safari browser, can any one let me know the solution. Thanks.
– Hari c
Apr 27 '18 at 12:43
@RyanCheu I am encountering the same issue. any workarounds / fixes / relevant info you;v learned ? is it a confirmed bug that was not yet filed on the webkit bug system ?
– OrenM
May 30 '18 at 8:02
@OrenM I wasn't able to work around this, it'd probably be good to file a bug.
– RyanCheu
Jun 6 '18 at 20:50
@RyanCheu did you file a bug? If so can you link to it here? Note: this is definitely not a CORS issue because I runsendBeacon()just fine in situation where the page is not unloading.
– Philip Walton
Aug 2 '18 at 0:31
3
Filed: bugs.webkit.org/show_bug.cgi?id=188329
– Philip Walton
Aug 4 '18 at 16:59
|
show 1 more comment
HI, I am also facing same issues in safari browser, can any one let me know the solution. Thanks.
– Hari c
Apr 27 '18 at 12:43
@RyanCheu I am encountering the same issue. any workarounds / fixes / relevant info you;v learned ? is it a confirmed bug that was not yet filed on the webkit bug system ?
– OrenM
May 30 '18 at 8:02
@OrenM I wasn't able to work around this, it'd probably be good to file a bug.
– RyanCheu
Jun 6 '18 at 20:50
@RyanCheu did you file a bug? If so can you link to it here? Note: this is definitely not a CORS issue because I runsendBeacon()just fine in situation where the page is not unloading.
– Philip Walton
Aug 2 '18 at 0:31
3
Filed: bugs.webkit.org/show_bug.cgi?id=188329
– Philip Walton
Aug 4 '18 at 16:59
HI, I am also facing same issues in safari browser, can any one let me know the solution. Thanks.
– Hari c
Apr 27 '18 at 12:43
HI, I am also facing same issues in safari browser, can any one let me know the solution. Thanks.
– Hari c
Apr 27 '18 at 12:43
@RyanCheu I am encountering the same issue. any workarounds / fixes / relevant info you;v learned ? is it a confirmed bug that was not yet filed on the webkit bug system ?
– OrenM
May 30 '18 at 8:02
@RyanCheu I am encountering the same issue. any workarounds / fixes / relevant info you;v learned ? is it a confirmed bug that was not yet filed on the webkit bug system ?
– OrenM
May 30 '18 at 8:02
@OrenM I wasn't able to work around this, it'd probably be good to file a bug.
– RyanCheu
Jun 6 '18 at 20:50
@OrenM I wasn't able to work around this, it'd probably be good to file a bug.
– RyanCheu
Jun 6 '18 at 20:50
@RyanCheu did you file a bug? If so can you link to it here? Note: this is definitely not a CORS issue because I run
sendBeacon() just fine in situation where the page is not unloading.– Philip Walton
Aug 2 '18 at 0:31
@RyanCheu did you file a bug? If so can you link to it here? Note: this is definitely not a CORS issue because I run
sendBeacon() just fine in situation where the page is not unloading.– Philip Walton
Aug 2 '18 at 0:31
3
3
Filed: bugs.webkit.org/show_bug.cgi?id=188329
– Philip Walton
Aug 4 '18 at 16:59
Filed: bugs.webkit.org/show_bug.cgi?id=188329
– Philip Walton
Aug 4 '18 at 16:59
|
show 1 more comment
1 Answer
1
active
oldest
votes
Using any sort of Asynchronous HTTP request, whether it is sendBeacon, fetch, or XMLHttpRequest seems to have problems in both desktop and iOS Safari at the moment when inside a pagehide event. I have received versions of the same error such as Fetch API cannot load ... due to access control checks when I use different types of HTTP requesters within the pagehide event. I am sure that it is not a CORS error, since the exact same request does not have a problem outside of a pagehide event.
While not recommended due the its blocking of the main thread, I am using synchronous requests until the bug is patched in Safari. For my use case, it is more critical that the analytics data from pagehide is successfully sent even even though it causes a small delay to the end user. Synchronous HTTP requests are a meh workaround until the bug is remediated, which hopefully is soon since the link from @Phillip Walton suggests that a patch has been accepted but obviously has not been released yet.
if (isSafari && pageHideBroken) {
$.ajax({
type: "POST",
async: false, //The most important line
url: `https://`,
data: 'Goodbye',
timeout: 5000
});
}
else {
navigator.sendBeacon(`https://`, 'Goodbye');
}
I have confirmed that on both Desktop Safari and iOS Safari that my backend successfully receives the data using this approach. JQuery is not required to make a sync HTTP request, but I just used $.ajax as the example due to its conciseness compared to XMLHttpRequest. If you make this workaround conditional like I have, then it is easy to swap back to navigator.sendBeacon once the bug is fixed! This type of browser-dependent behavior is never fun to code around.
answered Jan 2 at 6:24
Henry AgnewHenry Agnew
112
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f50052592%2fbeacon-api-cannot-load-url-due-to-access-control-checks-when-navigating-to-new%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
Using any sort of Asynchronous HTTP request, whether it is sendBeacon, fetch, or XMLHttpRequest seems to have problems in both desktop and iOS Safari at the moment when inside a pagehide event. I have received versions of the same error such as Fetch API cannot load ... due to access control checks when I use different types of HTTP requesters within the pagehide event. I am sure that it is not a CORS error, since the exact same request does not have a problem outside of a pagehide event.
While not recommended due the its blocking of the main thread, I am using synchronous requests until the bug is patched in Safari. For my use case, it is more critical that the analytics data from pagehide is successfully sent even even though it causes a small delay to the end user. Synchronous HTTP requests are a meh workaround until the bug is remediated, which hopefully is soon since the link from @Phillip Walton suggests that a patch has been accepted but obviously has not been released yet.
if (isSafari && pageHideBroken) {
$.ajax({
type: "POST",
async: false, //The most important line
url: `https://`,
data: 'Goodbye',
timeout: 5000
});
}
else {
navigator.sendBeacon(`https://`, 'Goodbye');
}
I have confirmed that on both Desktop Safari and iOS Safari that my backend successfully receives the data using this approach. JQuery is not required to make a sync HTTP request, but I just used $.ajax as the example due to its conciseness compared to XMLHttpRequest. If you make this workaround conditional like I have, then it is easy to swap back to navigator.sendBeacon once the bug is fixed! This type of browser-dependent behavior is never fun to code around.
answered Jan 2 at 6:24
Henry AgnewHenry Agnew
112
add a comment |
Using any sort of Asynchronous HTTP request, whether it is sendBeacon, fetch, or XMLHttpRequest seems to have problems in both desktop and iOS Safari at the moment when inside a pagehide event. I have received versions of the same error such as Fetch API cannot load ... due to access control checks when I use different types of HTTP requesters within the pagehide event. I am sure that it is not a CORS error, since the exact same request does not have a problem outside of a pagehide event.
While not recommended due the its blocking of the main thread, I am using synchronous requests until the bug is patched in Safari. For my use case, it is more critical that the analytics data from pagehide is successfully sent even even though it causes a small delay to the end user. Synchronous HTTP requests are a meh workaround until the bug is remediated, which hopefully is soon since the link from @Phillip Walton suggests that a patch has been accepted but obviously has not been released yet.
if (isSafari && pageHideBroken) {
$.ajax({
type: "POST",
async: false, //The most important line
url: `https://`,
data: 'Goodbye',
timeout: 5000
});
}
else {
navigator.sendBeacon(`https://`, 'Goodbye');
}
I have confirmed that on both Desktop Safari and iOS Safari that my backend successfully receives the data using this approach. JQuery is not required to make a sync HTTP request, but I just used $.ajax as the example due to its conciseness compared to XMLHttpRequest. If you make this workaround conditional like I have, then it is easy to swap back to navigator.sendBeacon once the bug is fixed! This type of browser-dependent behavior is never fun to code around.
answered Jan 2 at 6:24
Henry AgnewHenry Agnew
112
add a comment |
Using any sort of Asynchronous HTTP request, whether it is sendBeacon, fetch, or XMLHttpRequest seems to have problems in both desktop and iOS Safari at the moment when inside a pagehide event. I have received versions of the same error such as Fetch API cannot load ... due to access control checks when I use different types of HTTP requesters within the pagehide event. I am sure that it is not a CORS error, since the exact same request does not have a problem outside of a pagehide event.
While not recommended due the its blocking of the main thread, I am using synchronous requests until the bug is patched in Safari. For my use case, it is more critical that the analytics data from pagehide is successfully sent even even though it causes a small delay to the end user. Synchronous HTTP requests are a meh workaround until the bug is remediated, which hopefully is soon since the link from @Phillip Walton suggests that a patch has been accepted but obviously has not been released yet.
if (isSafari && pageHideBroken) {
$.ajax({
type: "POST",
async: false, //The most important line
url: `https://`,
data: 'Goodbye',
timeout: 5000
});
}
else {
navigator.sendBeacon(`https://`, 'Goodbye');
}
I have confirmed that on both Desktop Safari and iOS Safari that my backend successfully receives the data using this approach. JQuery is not required to make a sync HTTP request, but I just used $.ajax as the example due to its conciseness compared to XMLHttpRequest. If you make this workaround conditional like I have, then it is easy to swap back to navigator.sendBeacon once the bug is fixed! This type of browser-dependent behavior is never fun to code around.
answered Jan 2 at 6:24
Henry AgnewHenry Agnew
112
Using any sort of Asynchronous HTTP request, whether it is sendBeacon, fetch, or XMLHttpRequest seems to have problems in both desktop and iOS Safari at the moment when inside a pagehide event. I have received versions of the same error such as Fetch API cannot load ... due to access control checks when I use different types of HTTP requesters within the pagehide event. I am sure that it is not a CORS error, since the exact same request does not have a problem outside of a pagehide event.
While not recommended due the its blocking of the main thread, I am using synchronous requests until the bug is patched in Safari. For my use case, it is more critical that the analytics data from pagehide is successfully sent even even though it causes a small delay to the end user. Synchronous HTTP requests are a meh workaround until the bug is remediated, which hopefully is soon since the link from @Phillip Walton suggests that a patch has been accepted but obviously has not been released yet.
if (isSafari && pageHideBroken) {
$.ajax({
type: "POST",
async: false, //The most important line
url: `https://`,
data: 'Goodbye',
timeout: 5000
});
}
else {
navigator.sendBeacon(`https://`, 'Goodbye');
}
I have confirmed that on both Desktop Safari and iOS Safari that my backend successfully receives the data using this approach. JQuery is not required to make a sync HTTP request, but I just used $.ajax as the example due to its conciseness compared to XMLHttpRequest. If you make this workaround conditional like I have, then it is easy to swap back to navigator.sendBeacon once the bug is fixed! This type of browser-dependent behavior is never fun to code around.
answered Jan 2 at 6:24
Henry AgnewHenry Agnew
112
answered Jan 2 at 6:24
Henry AgnewHenry Agnew
112
answered Jan 2 at 6:24
Henry AgnewHenry Agnew
112
answered Jan 2 at 6:24
Henry AgnewHenry Agnew
112
112
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f50052592%2fbeacon-api-cannot-load-url-due-to-access-control-checks-when-navigating-to-new%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
HI, I am also facing same issues in safari browser, can any one let me know the solution. Thanks.
– Hari c
Apr 27 '18 at 12:43
@RyanCheu I am encountering the same issue. any workarounds / fixes / relevant info you;v learned ? is it a confirmed bug that was not yet filed on the webkit bug system ?
– OrenM
May 30 '18 at 8:02
@OrenM I wasn't able to work around this, it'd probably be good to file a bug.
– RyanCheu
Jun 6 '18 at 20:50
@RyanCheu did you file a bug? If so can you link to it here? Note: this is definitely not a CORS issue because I run
sendBeacon()just fine in situation where the page is not unloading.– Philip Walton
Aug 2 '18 at 0:31
3
Filed: bugs.webkit.org/show_bug.cgi?id=188329
– Philip Walton
Aug 4 '18 at 16:59