I am getting several warnings when loading my website on Google Chrome similar to the following:
DevTools failed to load SourceMap: Could not parse content for https://mywebsite.com/static/js/2.abcd1234.chunk.js.map: Unexpected token < in JSON at position 0
My webapp is a React application (create-react-app) deployed on AWS Amplify. I do not get these warnings when running the app locally. How do I get rid of these warnings?
This is a problem caused by using react-router with AWS amplify. See this github issue. It suggests adding the following entry in the Rewrites and redirects section of App settings in AWS Amplify:
Source address:
</^[^.]+$|\.(?!(css|gif|ico|jpg|js|png|txt|svg|woff|ttf)$)([^.]+$)/>
Target address:
/index.html
Type:
200 (Rewrite)
To solve my problem, I added the map extension to this regex:
Source address:
</^[^.]+$|\.(?!(css|gif|ico|jpg|js|png|txt|svg|woff|ttf|map)$)([^.]+$)/>
I checked my Rewrites and redirects settings and it was already configured as per the below answer by "roob" but also had json at the end. I removed it to see if that helped. Either way, I still got the error.
More research with a colleague and found another root cause. Answered here:
AWS Amplify error: Failed to parse source map... file: Error: ENOENT: no such file or directory
Related
I have a page generated by Flutter-Web shops and it is a blank page. And I have an error in the console. This happened after uploading the build web of Flutter into GitHub Pages.
Uncaught (in promise) TypeError: Failed to register a ServiceWorker for scope ('https://adamtechnologynl.github.io/') with script ('https://adamtechnologynl.github.io
/flutter_service_worker.js?v=2470069411'): A bad HTTP response code (404) was received when fetching the script.
manifest.json:1 Failed to load resource: the server responded with a status of 404 ()
manifest.json:1 Manifest: Line: 1, column: 1, Syntax error.
manifest.json:1 Failed to load resource: the server responded with a status of 404 ()
(index):88 Failed to load app from service worker. Falling back to plain <script> tag.
(anonymous) # (index):88
(index):47 GET https://adamtechnologynl.github.io/main.dart.js net::ERR_ABORTED 404
loadMainDartJs # (index):47
(anonymous) # (index):91
I found the solution. This happens when you have put it another directory instead of the root of the GitHub.
So my code is in "https://username.github.io/demo/book-king/belasting-web-v1/" so that last part we should append everything after "https://username.github.io/" also in the index.html. You can solve it by modifying the line (number 17 by me):
Change:
<base href="/">
into:
<base href="/demo/book-king/belasting-web-v1/">
And then you are done.
This solution works. But for me, line no 17 was not <base href="/">.
It was like this <base href="$FLUTTER_BASE_HREF">. Given that FLUTTER_BASE_HREF is a variable, it can be modified.
How?: Provide --base-href argument to flutter build like below
HostingURL : https://<github_user_name>.github.io/project_aj/demo/gh-pages/
Apart from the https://<github_user_name>.github.io should go as the value for --base-href
flutter build web --base-href=/project_aj/demo/gh-pages/
Running the training command from open information extraction demo fails with the following error message:
OSError: HEAD request failed for url https://raw.githubusercontent.com/allenai/allennlp-models/main/training_config/structured-prediction/srl.jsonnet with status code 404
Does this mean the file is removed? Where can the replacement file be found?
Looking for a replacement file I found this file from allenai repo but it seems to have required fields such as "dataset_reader" missing.
communicated the issue with allennlp and the file is now accessible at the same address.
Hi I've been stuck on this for days! I'm trying to use keycloak to authenticate my electron app after converting my react app using this guide.
When I run 'npm run electron:dev' , keycloak redirects to the login page. However, when I run 'npm run electron:prod' this fails.
Logs from keycloak server shows:
Server:server-one] 08:58:31,575 WARN [org.keycloak.events] (default task-3) type=LOGIN_ERROR, realmId=codingpedia, clientId=my-ui, userId=null, ipAddress=127.0.0.1, error=invalid_redirect_uri, redirect_uri=file:///home/mycompany/john/projects/boilerplate-javascript-electron/app/build/index.html
Notice that the redirect_uri is 'file:///...' which I believe to be the cause of it.
I've also tried to change the below but it does not resolve the problem.
// import createHistory from 'history/createBrowserHistory';
import createHistory from 'history/createHashHistory';
Why is this working in dev but not in prod? Is there something I'm missing? Thank you in advance!
It works in dev probably because the "index.html" file is located in your computer (file:///home/mycompany/john/projects/boilerplate-javascript-electron/app/build/index.html).
This stackoverflow thread tells how to properly set the redirect_uri parameter, through the admin console.
Note: make sure you can remotely access your index.html in prod, using a browser or any other client tool (HTTP GET).
I followed a tutorial on how to make a multiplayer tetris game, here is the repo:
https://github.com/Leftier/tetris
It worked just fine on localhost so I tried to deploy it in heroku (https://tetrixtest.herokuapp.com/ --ASD to move Q/E to rotate) but I get the following error:
WebSocket connection to 'wss://tetrixtest.herokuapp.com/' failed: Error during WebSocket handshake: Unexpected response code: 200
while trying to create the webSocket in this line (connection-manager.js line 14):
this.conn = new WebSocket(`wss://${window.location.hostname}:${window.location.port}`)
I don't know much about webSockets,
at first I thought that heroku was not able to handle websockets but that wasn't the case so I tried using the link directly as an argument instead of reading it from the browser but still the same issue.
I would like some clues/hints about why does this happens, I searched in google and github, but I only found issues related to socket.io
For me the solution was to turn on "Session affinity" by running this command heroku features:enable http-session-affinity
More info at https://devcenter.heroku.com/articles/session-affinity
Session affinity, sometimes referred to as sticky sessions, is a
platform feature that associates all HTTP requests coming from an
end-user with a single application instance (web dyno).
I am trying to enable push notifications on my website using VAPID keys.
When i include the gcm_sender_id and remove the applicationServerKey from the pushManager.subscribe method, it runs fine.
Only when i enable VAPID keys and remove the gcm_sender_id from manifest.json file. i get the foloowing error.
DOMException: Registration failed - push service error
I am using Chrome browser.
I encountered this error in Brave browser. By default, Google Services for push messaging are disabled in Brave. To enable this, open the following URL in brave:
brave://settings/privacy
After this, enable the flag "Use Google services for push messaging":
Source:
https://github.com/firebase/firebase-js-sdk/issues/3195#issuecomment-848036637
The applicationServerKey that i was using in the pushManager.subscribe method was somehow incorrect.
It worked when i regenerated the keys in node using the following module.
const webpush = require('web-push');
const vapidKeys = webpush.generateVAPIDKeys()
In my case,I was trying to run firebase messaging on a flutter web.
My Browser was BRAVE.
It always failed with an exception of firebase fcm registration push servic error.
I followed #Nicodemuz answer, but it didn't solve the issue. I get the same error.
The only solution was setting Google chrome as my executable.
Anyhow the issue is not with firebase or flutter, it's with the brave browser itself.