I have this issue only in Brave browser when I disable the Shield. I have OWA analytics file on my blog:
https://stats.jcubic.pl/modules/base/js/owa.tracker-combined-min.js
And I use my Service Worker library called Wayne on my blog. The library intercept all requests and allow creating pure in browser HTTP responses. Similar to Express.js do in Node but in Service Worker. It also has similar API. I’m using the library add syntax highlighting to the JavaScript and CSS files when you open them in the browser.
But I got this error:
Fetch API cannot load
https://stats.jcubic.pl/modules/base/js/owa.tracker-combined-min.js
. Request mode is “no-cors” but the redirect mode is not “follow”.
The file don’t have any redirect. Domain stats.jcubic.pl have CORS enabled.
The error originate from this code (stripped from irrelevant parts):
self.addEventListener('fetch', (event) => {
if (filter(event.request) === false) {
return;
}
const promise = new Promise(async (resolve, reject) => {
const req = event.request;
try {
// Wayne logic with early return
if (event.request.cache === 'only-if-cached' &&
event.request.mode !== 'same-origin') {
return;
}
fetch(event.request).then(resolve).catch(reject);
} catch(error) {
this._handle_error(resolve, req, error);
}
});
event.respondWith(promise.catch(() => {}));
});
I don’t know what this line if (event.request.cache ...
is doing, found it in some example.
Why this error happen, and how can I get rid of it when I intercept all requests? I’m trying to understand what is the reason for this error, but also want to know how to fix this if there is a way.
I would prefer to fix this in the Wayne library itself so it’s fixed also for other users, not only for my blog.
Just to be complete, this is a code snippet to add OWA to my blog:
<script type="text/javascript">
//<![CDATA[
var owa_baseUrl = 'https://stats.jcubic.pl/';
var owa_cmds = owa_cmds || [];
owa_cmds.push(['setSiteId', 'b9a1a51b38e3837c9a5b309ec4122ff3']);
owa_cmds.push(['trackPageView']);
owa_cmds.push(['trackClicks']);
(function() {
var _owa = document.createElement('script'); _owa.type = 'text/javascript'; _owa.async = true;
owa_baseUrl = ('https:' == document.location.protocol ? window.owa_baseSecUrl || owa_baseUrl.replace(/http:/, 'https:') : owa_baseUrl );
_owa.src = owa_baseUrl + 'modules/base/js/owa.tracker-combined-min.js';
var _owa_s = document.getElementsByTagName('script')[0]; _owa_s.parentNode.insertBefore(_owa, _owa_s);
}());
//]]>
</script>
It’s obviously the same URL that doesn’t have any direct.
I’ve tried to add _owa.crossorigin = '';
to the above snippet but no difference.
I was thinking of add a flag called skip
to the fetch event, but the problem is that the Promise callback is async (there is no other way to write this code, there is try..catch
so all problems with async are handled).