Service worker "backgroundFetch" fails with no evident reason - javascript

I'm trying to upload files with Service worker BackgroundFetch api(with Chrome 102.0.5005.61) and aws-sdk library(version 2.828.0).
First, I had to patch aws-sdk to work with browser fetch apias described here, and it worked well.Then when I replaced window.fetch with SW background fetch it fails with "backgroundfetchfail" event(BackgroundFetchUpdateUIEvent) showing that BackgroundFetchUpdateUIEvent.registration.failureReason is "fetch-error". no info besides that...please if anyone knows how to get more info? might be some request header generated by aws-sdk that fails the request?
EDIT: Adding a codeSandBox for debugging: sandbox

Related

PWA Service Worker - Failed to fetch - Issue with Facebook Pixel

I have the following PWA Service Worker (serviceWorker.js):
self.addEventListener("fetch", fetchEvent => {
fetchEvent.respondWith(
caches.match(fetchEvent.request).then(res => {
return res || fetch(fetchEvent.request)
})
)
})
I don't want anything to load when offline, because it's a fully dynamic webpage, so offline it's unusable. So that's why I found that maybe this code is enough for the Service Worker, and I don't need any cached files. (Maybe that was a mistake?)
And actually it's working fine, at least when I open my webpage, Chrome pops up the message to install the application for my webpage - and it's also working fine.
But today I have realized that in the Console there are some errors regarding it:
The FetchEvent for "https://connect.facebook.net/en_US/fbevents.js"
resulted in a network error response: the promise was rejected.
Uncaught (in promise) TypeError: Failed to fetch at
serviceWorker.js:4:21
And marks this part in the serviceWorker.js: fetch(fetchEvent.request), and says: Failed to fetch.
GET https://connect.facebook.net/en_US/fbevents.js net::ERR_FAILED
Also when I wanted to make some changes in my Facebook Pixel, it said, it can't find the Pixel for my website. However it's there. And the only modification was to add the PWA-related codes.
And I also realized that since that day the visits of my webpage shown in Google Analytics started to drop down dramatically. Not 0 now, but I think in 1-2 days it will be 0.
What is the issue here with the Service Worker?
How can I fix it?
And what is the connection between this issue and my Facebook Pixel (and Google Analytics)?
Of course I tried to search for answers, but I could not find the solution for that particular issue.
Please help me fix this issue. Hopefully the root cause is the same, so one fix would solve all.
Thank you in advance.
I found the solution - I post it here, so maybe somebody will face this issue as well, and I want to help with the solution.
So it turned out, I have to provide an offline fallback page.
I found this article, I followed the steps, created the offline.html file, modified the serviceWorker.js file, and the issue is gone, Facebook Pixel is working fine again:
https://web.dev/offline-fallback-page/

Proxy authentification required on script tag REACTJS

First time posting here so don't hesitate if you need/I forgot something. I looked everywhere and didn't find my answer (I guess I'm missing something).
My problem:
I created a REST SpringBoot application and put an index.html in resources/static to create a REACT front end (I don't want to use nodejs, maybe webpack if I really have to).
When I contact localhost:8080/ I end up on my index.html but those scripts:
<script src="https://facebook.com/react-15.2.0.js"></script>
<script src="https://facebook.com/react-dom-15.2.0.js"></script>
needed to make REACT work provoke a Proxy Authentication Required error in the console log.
I am indeed behind my company's proxy. My IDE (IntelliJ) is configured with this proxy. My JVM takes those arguments to make it work:
-Dhttp.proxyHost=myproxy -Dhttp.proxyPort=myport -Dhttp.proxyUser=myuser -Dhttp.proxyPassword=mypwd -Dhttp.proxySet=true
and the application.properties has the following line:
server.use-forwarded-headers=true
I don't know what I should configure anymore to make it work. Do you have any ideas? Thank you very much in advance!
EDIT:
Facebook is a bad example as the proxy won't let me go on this site. I have updated my src to authorized sites (tried them on my browser and they worked). Still, I have the same error: 407 Proxy Authentification Required
I found the solution:
The error is legit. This is the HTTP protocol. First I have the 407 error asking for the informations of my proxy, then those informations are sent throught a second request. Still, showing an error in the log is disturbing.

socket.io "net::ERR_FAILED" with cache manifest for Progressive Web App

I'm developing a Progressive Web App which uses a .manifest file to cache all files on the client. I modified the socket.io chat example which is found here:
https://github.com/socketio/chat-example
my modifications can be found here:
https://github.com/TennisVisuals/socket.io.manifest.errors
The first change in the client code is:
external resources (jquery and socket.io client libraries) are accessed locally rather than via remote URLs.
Everything works as expected.
But with the second change:
<html> is replaced with <html manifest="index.manifest">
The application fails, giving this error in the Javascript console:
http://localhost:3000/socket.io/?EIO=3&transport=polling&t=Lij1LRo net::ERR_FAILED
Initial Fix
I've been able to make it work locally by adding the following lines:
enter var connectionOptions = {
"force new connection" : true,
"reconnectionAttempts": "Infinity",
"timeout" : 10000,
};
var socket = io(connectionOptions);
Cloudflare and Nginx
But I'm now seeing stranger behavior when I run with Cloudflare and Nginx.
Without the manifest declaration I get an error, but everything still works!
socket.io-1.7.2.js:7370 WebSocket connection to 'wss://hiveeye.net/socket.io/?EIO=3&transport=websocket&sid=rM2LKvCGJwaFx7RrAAAf' failed: Error during WebSocket handshake: Unexpected response code: 400
after adding the manifest declaration it works exactly once and then fails with the following errors:
socket.io-1.7.2.js:4948 GET https://hiveeye.net/socket.io/?EIO=3&transport=polling&t=Lik5SC5&sid=rM2LKvCGJwaFx7RrAAAf net::ERR_FAILED
GET https://hiveeye.net/socket.io/?EIO=3&transport=polling&t=Lik5STN net::ERR_FAILED
GET https://hiveeye.net/socket.io/?EIO=3&transport=polling&t=Lik5STN net::ERR_FAILED
I suspect that if I can get the initial error to go away when running without the manifest, that may do the trick... but I've been unable to find anything to help me resolve that issue...
Ok, this was really simple once I found out how to ask the right question
Adding:
NETWORK:
*
at the bottom of the manifest file made everything work.
Yes, the "Application Cache" is deprecated:
https://developer.mozilla.org/en-US/docs/Web/HTML/Using_the_application_cache
but I still wanted to make it work!!

GET Soundcloud connect SDK is returning 404

I am making a GET request for the connect sdk script: https://connect.soundcloud.com/sdk/sdk-3.1.2.js, which has never before failed me before. This file is the one the documentation says to use. However when I make a GET request to: https://connect.soundcloud.com/sdk/sdk-3.1.2.js in a script tag, postman, and in my browser url bar, the return status is 404 Not Found.
Please help me, as my application artistsunlimited.co uses the connect api heavily.
It looks like they deployed some code today; this may be related, because I was not getting this error yesterday. Hopefully they will fix this issue soon.
See status message here.

403 error - The Caller does not have permisson

I'd like to use Google Execution Api from my chrome extension.
On the page below, there is a form to test execution api request, but when I send request, I get 403 error as response.
This person who posted this question seems to have solved his problem which is probably the same problem as mine.
Why does my apps script deployed as API executable return Permission Denied?
But, I can't solve this error. Please guide me to help me this error.
Request
This is what I input into request form.
https://developers.google.com/apps-script/execution/rest/v1/scripts/run#try-it
Response
{
"error": {
"code": 403,
"message": "The caller does not have permission",
"status": "PERMISSION_DENIED"
}
}
Project Key : MVO00WF1oNYdJ7YvOZGxXh_z7UcVTY4Um
Scopes
I use spread sheet api so, I added spread sheet scope as additional scope for OAuth 2.0.
code.gs
This is a sample function code to call.
// This function does nothing. Just a test.
function myFunction(data) {
var sheet = SpreadsheetApp.getActiveSheet();
return "success!!";
}
The script associated with project
Additional Info
I deployed my project as API executable.
I enabled execution API on developer console.
I made OAuth 2.0 Client ID on developer console.
Reference
https://developers.google.com/apps-script/guides/rest/api#limitations
is the script public or for your use only? I got this error and it resolved when I made the script public. I was doing an Android app so the answer may not apply completely.
I was having similar problems running through the quickstart documentation provided by Google. I noticed you have two items in your scope. Be careful that you add the second scope to your array. For me, I was using the node.js quickstart so line 10 looked like this:
var SCOPES = ['https://www.googleapis.com/auth/drive', 'https://www.googleapis.com/auth/spreadsheets'];
Also, as the line above this one (lines 8-9) indicates, I had to rm my previous credentials. Go to your home directory and find (the hidden) folder .credentials. for me the command was:
me#mydrive:~/.credentials $ rm script-nodejs-quickstart.json
One I did this, I re-ran my script, got authorized, and had it all working.
Your 403 error indicates that you have incorrectly or missed some configuration in authentication for your service account. Make sure the app script is associated with correct dev console project.
The script should be associated with the dev console project id that corresponds with OAuth 2.0 client ID used (this dev console project should also have "Apps Script Execution API" enabled).
To change the developer console project for an app script select the following menu item: Resources > Developer Console Project.
I had the same problem yesterday: I got the same error although I did everything correct.
I solved it by having deleted the .credentials file und rerun the code. Try it out if didn't do that before.

Categories

Resources