Webpack dev server React Content Security Policy error
If you use Webpack in your project, please add output.publicPath = '/'
and devServer.historyApiFallback = true
in your webpack config file.
More info: React-router urls don't work when refreshing or writting manually
Related videos on Youtube
dave-oo
Updated on September 16, 2022Comments
-
dave-oo over 1 year
I have my single page app running on webpack-dev-server. I can load and reload my entry route over at
localhost:8080
and it works every time. However i can loadlocalhost:8080/accounts/login
only via a link from within the app i.e whenever i reloadlocalhost:8080/accounts/login
from the browser refresh button i getCannot GET /accounts/login/
as the server response, and on the console i get
Content Security Policy: The page’s settings blocked the loading of a resource at self (“default-src http://localhost:8080”). Source: ;(function installGlobalHook(window) { ....
This is my CSP header on the single page app's index.html
<meta http-equiv="Content-Security-Policy" content="default-src * 'self' 'unsafe-inline' 'unsafe-eval'">
I am also not using any
devtool
on mywebpack.config.json
. What am i missing. -
David Ferreira almost 5 yearsI think you misquoted the answer from the other question already answered, it's:
devServer: { historyApiFallback: true, contentBase: './' }