I am getting 404 error when accessing /.well-known/assetlinks.json on my site.
It works locally but not when I deploy it to Heroku. I am using Svelte on Sapper with polka server.
I tried adding it to the static folder, where all the other static resources work fine. Also tried with a dynamic route with no luck.
My guess is it might have to do with the leading dot or something wrong in my service-worker...
Any ideas on how to solve it or how to debug it?
Found the solution here: https://github.com/lukeed/sirv/tree/master/packages/sirv#optsextensions
opts.dotfiles Type: Boolean Default: false
Allow requests to dotfiles (files or directories beginning with a .).
even if it says
Note: Requests to /.well-known/* are always allowed.
I had to specify the option as true.
Sample code:
polka({ server })
.use(
force_ssl,
compression({ threshold: 0 }),
sirv('static', { dev: dev, dotfiles: true }),
sapper.middleware()
)
.listen(PORT, err => {
if (err) console.log('error', err);
});
Related
I try to cleanup my database with command cy.cleanUpPreviousState:
// mytest.cy.js
...
beforeEach(() => {
cy.cleanUpPreviousState()
})
...
the request was response with error:
CypressError
cy.request() failed trying to load:
http://my-route.dev.localhost:8005/cleanup
The app runs in docker container, using shyim/shopware-docker
Questions
What is wrong with my request/route?
Which controller has to take this request?
To find out what is wrong, have a log at the network tab request log.
Answering your second question: There is a special server spun up for this action. It is not a normal Shopware route.
See in the cypress.js - it is supposed to use psh.phar to clean-up when this URL is called.
const requestedUrl = request.url;
if (requestedUrl !== "/cleanup") {
response.end();
return;
}
return childProcess.exec(
`${PROJECT_ROOT}/psh.phar e2e:cleanup`,
[...]
server.listen(8005);
So things to check are:
Is that port forwarded to your docker container?
Are you using the development template and is psh.phar existing?
I have followed this tutorial and some alike but it showed me the error as title.
https://dev.to/hawacodes/deploying-a-mern-app-with-heroku-3km7
I have also put env on heroku
config var
Here are my practice project github
https://github.com/NDK2020/sheyshop
And my current Heroku app
https://practice-sheyshop.herokuapp.com/
I have tried all the way, but it wasn't work. I can see the website load as in the dev environment and then the screen blank within seconds, open the network tab in Firefox it stated:
error Image
Log from heroku
Log image
I think I have found the answer, in my server.ts, I have to put this code block after this the route declaration. From this
if (process.env.NODE_ENV === "production") {
console.log("PRODUCTION MODE ACTIVE");
//app.use('/', express.static("/client/build"));
app.use(express.static("./client/build"));
app.get('*', (req: any, res: any) => {
res.sendFile(path.resolve(__dirname, './client/build','index.html'));
})
}
app.use('/api/products/', productRoute)
app.use('/api/users/', userRoute)
app.use('/api/orders/', ordersRoute);
To this
app.use('/api/products/', productRoute)
app.use('/api/users/', userRoute)
app.use('/api/orders/', ordersRoute);
if (process.env.NODE_ENV === "production") {
console.log("PRODUCTION MODE ACTIVE");
//app.use('/', express.static("/client/build"));
app.use(express.static("./client/build"));
app.get('*', (req: any, res: any) => {
res.sendFile(path.resolve(__dirname, './client/build','index.html'));
})
}
My goal is to add a token in the socketio reconnection from the client (works fine on the first connection, but the query is null on the reconnection, if the server restarted while the client stayed on).
The documentation indicates I need to use the Manager to customize the reconnection behavior (and add a query parameter).
However, I'm getting trouble finding how to use this Manager: I can't find a way to connect to the server.
What I was using without Manager (works fine):
this.socket = io({
query: {
token: 'abc',
}
});
Version with the Manager:
const manager = new Manager(window.location, {
hostname: "localhost",
path: "/socket.io",
port: "8080",
query: {
auth: "123"
}
});
So I tried many approaches (nothing, '', 'http://localhost:8080', 'http://localhost:8080/socket.io', adding those lines to the options:
hostname: "localhost",
path: "/socket.io",
port: "8080" in the options,
But I couldn't connect.
The documentation indicates the default URL is:
url (String) (defaults to window.location)
For some reasons, using window.location as URL refreshes the page infinitely, no matter if I enter it as URL in the io() creator or in the new Manager.
I am using socket.io-client 3.0.3.
Could someone explain me what I'm doing wrong ?
Thanks
Updating to 3.0.4 solved the initial problem, which was to be able to send the token in the initial query.
I also found this code in the doc, which solves the problem:
this.socket.on('reconnect_attempt', () => {
socket.io.opts.query = {
token: 'fgh'
}
});
However, it doesn't solve the problem of the Manager that just doesn't work. I feel like it should be removed from the doc. I illustrated the problem in this repo:
https://github.com/Yvanovitch/socket.io/blob/master/examples/chat/public/main.js
I've got my WDS running on port 9000, and the webpack bundles located under /dist/ I've got a back end server running on port 55555
Is there a way to get WDS to ignore (proxy to 55555) every call except those starting with /dist/?
I've got the following:
devServer: {
port: 9000,
proxy: {
"/dist": "http://localhost:9000",
"/": "http://localhost:55555"
}
}
Trouble is, that root ("/") just overrides everything...
Thanks for any advice you can offer.
UPDATE:
I've gotten a little farther with the following:
proxy: {
"/": {
target: "http://localhost:55555",
bypass: function(req, res, proxyOptions) {
return (req.url.indexOf("/dist/") !== -1);
}
}
},
But the bypass just seems to kill the connection. I was hoping it would tell the (9000) server to not proxy when the condition is true. Anybody know a good source explaining "bypass"?
Webpack allows glob syntax for these patterns. As a result, you should be able to use an exclusion to match "all-but-dist".
Something like this may work (sorry I don't have webpack in front of me at the moment):
devServer: {
port: 9000,
proxy: {
"!/dist/**/*": "http://localhost:55555"
}
}
I am struggling with a issue with react-router + webpack code split + servicer worker (or cache).
Basically the issue is the following, the code split is working properly but from time to time I get error reports from customers at sentry.io such as:
"Dynamic page loading failed Error: Loading chunk 19 failed."
My react-router code is the following:
const errorLoading = (err) => {
console.error('Dynamic page loading failed', err);
};
export default (
<Route path="/" component={App}>
<IndexRoute
getComponent={(nextState, cb) => {
System.import('./containers/home/home')
.then((module) => { cb(null, module.default); })
.catch(errorLoading);
}}
/>
</Route>
);
For my ServiceWorker I use OfflinePlugin with the following configuration:
new OfflinePlugin({
cacheName: 'cache-name',
cacheMaps: [
{
match: function(requestUrl) {
return new URL('/', location);
},
requestTypes: ['navigate']
}
],
externals: [
'assets/images/logos/slider.png',
'assets/images/banners/banner-1-320.jpg',
'assets/images/banners/banner-1-480.jpg',
'assets/images/banners/banner-1-768.jpg',
'assets/images/banners/banner-1-1024.jpg',
'assets/images/banners/banner-1-1280.jpg',
'assets/images/banners/banner-1-1400.jpg'
],
responseStrategy: 'network-first', // One of my failed attempts to fix this issue
ServiceWorker: {
output: 'my-service-worker.js'
}
})
The issue is not browser related because I have reports from IE11, safari, chrome, etc.
Any clues on what I might be doing wrong or how can I fix this issue?
Edit 2: I ended using chunks with hashes, and doing a window.location.reload() inside errorLoading's catch(), so when the browser fails to load a chunk it will reload the window and fetch the new file.
<Route path="about"
getComponent={(location, callback) => {
System.import('./about')
.then(module => { callback(null, module.default) })
.catch(() => {
window.location.reload()
})
}}
/>
It happens to me too and I don't think I have a proper solution yet, but what I noticed is this usually happens when I deploy a new version of the app, the hashes of the chunks change, and when I try to navigate to another address (chunk) the old chunk doesn't exist (it seems as if it wasn't cached) and I get the error.
I managed to reproduce this by removing the service worker that caches stuff and deploying a new version (which I guess simulates a user without the service worker running?).
remove the service worker code
unregister the service worker in devtools
reload the page
deploy a new app version
navigate to another chunk (for instance from /home to /about)
In my case it appears as if the error occurs when the old files are not cached (hence not available any more) and the user doesn't reload the page to request new ones. Reloading 'fixes' the issue because the app has the new chunk names, which correctly load.
Something else I tried was to name the chunk files without their hashes, so instead of 3.something.js they were only 3.js. When I deployed a new version the chunks were obviously still there, but this is not a good solution because the files will be cached by the browser instead of being cached by the caching plugin.
Edit: same setup as you, using sw-precache-webpack-plugin.