I'm developing a PWA application and the "add to home" function isn't working. The Service Worker seems to be fine, just like the manifest.
This is PWA: https://tanafonte.com.br/app/
Add lighthouse to your browser and it will tell you what it thinks is wrong. Personally I think it is far too obtuse and opinionated but there you go.
That's the lighthouse error I get for your PWA: "Failures: Service worker does not successfully serve the manifest's start_url, Timed out waiting for fetched start_url."
At your manifest.json you set the property start_url to /app which results into https://tanafonte.com.br/app
This URL is redirected with 301 to https://tanafonte.com.br/app/
Maybe that's the problem. I would try to set the start_url to /app/
Related
I've not been able to find straight forward instructions on how to avoid caching problems when developing a js app with vue cli.
For example, when we deploy a new version of the app with npm run build, we can see that a new app.xxxxx.js is deployed, where the xxxxxx part is a new hash that I guess webpack is generating.
We host this in an Windows 2012 IIS Server.
Now when I tell my customer we have solved the latest issues that have been found in the app, it seems that they have caching problems, as they still have the previous version, even if they close and reopen the browser.
Is there any way to avoid this behaviour?
Try to follow the below steps which help you to disable the cache in iis.
1)Open iis manager.
2)Select the site and click on the "HTTP response header feature".
3)Click on the set common header link from the action pane.
4)click the checkbox "expire web content" and select "immediately" radio button.
You could also set output caching in iis:
Configure IIS Output Caching
On a former project I was working on there was a manifest.json file while allowed the app to be a progressive web application.
However even now on different projects I can see that my browser is requesting the service-worker.js file from the backend ie:
GET /service-worker.js 404 557.926 ms
How can I turn this off within my browser so I don't see these errant logs come through my app?
You need to unregister the service worker like such:
https://www.codementor.io/#himank/how-to-unregister-service-workers-n8mzf5jce
In case the link should stop working, these are the steps for Chrome.
open the dev console
click "Application" tab
click "Service Workers"
click "Unregister"
I have created manifest.json to a site to enable to save the web app icon on a desktop.
My developer website is over http - Which doesn't work when I click on add to home screen from application tab.
I am getting console error:
Site cannot be installed: the page is not served from a secure origin
The same code works over https.
How can I simply bypass this issue in http
Note : I have followed the following step in chrome browser, it didnt resolve my issue.
Stackoverflow previously Question
Any help will be greatly appreciated.
chrome://flags/#unsafely-treat-insecure-origin-as-secure
enabled and add site origin
The problem was service workers will only register and install on the secure origin. So followed following steps:
1) Go to chrome.exe path in the program files create shortcut of the chrome on the desktop
2) right click on the shortcut - Go to properties - update the target with the below changes
"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --unsafely-treat-insecure-origin-as-secure=http://wzy.xyz.com,http://x.xyz.com --user-data-dir=/anydirectory/
Note: Make sure that you google chrome executable file is present in the above mentioned location.
Also this is only to test in the local environment.
I am trying to follow the instructions from here to enable offline support (Service worker) in my polymer starter kit clone.
However, after making the changes in gulpfile.js, index.html and elements.html, I keep getting the following error whenever I refresh the page.
Also if I change the throttling setting to offline in Chrome Developer Tools and refresh, the page comes back with the "Unable to connect to the Internet" message so clearly the caching isn't working.
Is there anything else that I need to do?
Update: Just decoded the url (i.e. http://localhost:5000/bower_components/platinum-sw/platinum-sw-register.html&clientsClaim=true&skipWaiting=true&version=1.0) in the error message and ran it in Chrome and got a 404 error. If I remove everything after .html then the file can be found though.
I was having the same issue and turned out it's because the platinum-sw-cache is set to disabled in the dev development, which means service worker will not work if you run
gulp serve
So to test the PSK offline, you need to call
gulp serve:dist
You can also ignore that ERR_FILE_EXISTS error as explained by #pirxpilot.
I have an issue on fortrabbit which I can't figure out on my own, and google is not of much help either.
I have this website which works fine on the temp domain that fortrabbit gives upon creating the app: App on Dev. Now I have an actual domain for this which is: App on Live, but it shows a 404 page for some reason. The app is configured in fortrabbit to point to the 'public' folder and overall has the same setup as the Dev app, but I still can't figure out why it shows a 404 page.
Thank you!
Found the fix for this. The domain in fortrabbit dashboard had to be set to "www.blackflame.digital", it was set to "blackflame.digital" before, so just had to add the "www" at the beginning.