-
-
Notifications
You must be signed in to change notification settings - Fork 1.4k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
CORS issue with "webpack-dev-server": "^1.14.1" #533
Comments
I am facing the same CORS issue when i try to fetch data from "http://en.wikipedia.org/w/api.php?format=json&action=query&generator=random&grnnamespace=0&grnlimit=10". I am using Its working in chrome if i enable CORS extension in chrome. |
The |
Thanks @SpaceK33z ,
Still no luck. Your advice is much appreciated. |
@Soolan, I did a quick test using fetch('http://ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=8&q=http://rss.cnn.com/rss/edition_entertainment.rss?output=rss', {
method: 'get',
mode: 'no-cors',
}).then(() => {
console.log('Works!');
}); I don't know what library you're using for XHR, but most libraries have support for something like the above ( |
@SpaceK33z, thank you for your time. Since CORS didn't work for me I tried JSONP (i.e. http://hawttrends.appspot.com/api/terms/?callback=JSONP_CALLBACK) But I got another issue regarding response which I asked for help here: |
Okay, JSONP is also a solution for this problem. Could you close this issue then? This is not a bug in webpack-dev-server ;). |
@SpaceK33z your test do works but the json data cannot be fetched.Only get response likes |
I experienced the same like @CallMeXYZ. Also adding no-cors mode is not a solution, it could be a solution but for the production, it is not acceptable. Anyway when i add no-cors mode i am getting an error like |
Today I updated
|
@andrerpena interestingly, even if I add those headers in the config with today's Investigating the issue. |
I found the problem, but I'm not sure it's my fault. Webpack is still overly complicated, configurations traveling here and there. I use Gulp and Webpack, and so I have a So here's my current gulp task with which adds the headers to the wrong config in my opinion: gulp.task('webpack-dev-server', ['clean'], () => {
const config = require('./frontend/webpack/config.dev-server')
const compiler = webpack(config)
const server = new WebpackDevServer(compiler, {
hot: true,
inline: true,
historyApiFallback: true,
contentBase: path.join(__dirname, 'frontend', 'src'),
publicPath: '/static/assets/',
stats: {
colors: true,
},
headers: {
'Access-Control-Allow-Origin': '*',
},
})
server.listen(3000, '0.0.0.0', (err) => {
if (err) throw new gutil.PluginError('webpack-dev-server', err)
// Server listening
gutil.log('[webpack-dev-server]', 'http://localhost:3000/')
})
}) This extra Leaving this here as information for future reference, and for people who bump into the same problem. I'm not sure as to what changed that caused CORS to start being enforced, because I reverted |
@karolyi that is the documented way that it works. When using the WebpackDevServer from node API it doesn't get If you want to specify it in the config simply: const config = require('./frontend/webpack/config.dev-server')
const compiler = webpack(config)
const server = new WebpackDevServer(compiler, config.devServer) |
Any reason why the default isn't Releated: gaearon/react-hot-loader#56 |
Referred to webpack/webpack-dev-server#533
well, Google Chome can be started with two flags/params: webpack-dev-server has the option to automatically open HTML in the browser once compilation is done, like
so it would be awesome if we could open it in chrome browser with |
@olehmelnyk solid info. https://github.com/webpack/webpack-dev-server/blob/master/bin/webpack-dev-server.js#L463-L470 So in addition to checking if it's a string, we'd need to see if JSON can parse it, and if so, check to see it's got an I think might be a classic case of |
yay! looks like I've found what I was looking for:
...
and now you can work with CORS, and have a dedicated Google Chrome user profile that will include developer plugins and settings and will not overlap with browser settings/plugins for private use |
@olehmelnyk awesome that you found a solution. though it does make me just a tiny bit sad that it requires more webpack config. still, it works! |
I've found a solution to my ongoing CORS errors - switch to FWIW, I'd been using Then around the end of 2018 I came across |
Quick update: the access control headers are now replaced to |
@thunderkid can you share your webpack.config.js ? |
@dyardyGIT You mean my old one for webpack-dev-server or the new one for webpack-plugin-serve? |
@thunderkid it would be nice to see both I also switched over to webpack-plugin-serve and many of my issues have been resolved (authentication, cors, and I can how browse to site via http://localhost which is on IIS)...is this too good to be true? Here is my package.json that I am using { |
The amount of trickery one should get himself into for simply enabling CORS is just ridiculous. |
Hi everyone, I'm using:
and I get the following error when I try to hit googleapis:
I have added following settings in webpack.config.js:
... but I still getting the same error.
Can anyone give me some advice please?
Thank you for your time.
The text was updated successfully, but these errors were encountered: