CORS is driving me crazy

PhilWritesCode

I’m stuck trying to get CORS to work. I’ve searched extensively but can’t find any definitive info about how to configure CORS in Quasar.

I’m running Quasar using the quasar dev command. My app attempts to load a JavaScript library from another domain. When I try to load it, I get the error:

Access to script at 'https://mydomain.net/mylib.js' from origin 'http://127.0.0.1:8081' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

I tried installing the cors package and doing this in quasar.conf.js:

devServer: {
            https: false,
            port: 8080,
            open: true, // opens browser window automatically
            headers: {
                'Access-Control-Allow-Origin':  '*'
                // 'Access-Control-Allow-Methods': '*',
                // 'Access-Control-Allow-Headers': '*'
            },
            before (app) {
                const cors = require('cors')
                app.use(cors())
            }
        },

But it doesn’t seem to help.

Can anyone tell me how to configure this? Thanks.

dobbel

Did you look at the request and did you confirm the cors header is missing?
Is the server cors enabled?

Maybe this will help:

https://enable-cors.org/

PhilWritesCode

Thanks for your quick reply. I’m new to Quasar and I don’t know how to do either of those things.

jraez

cors have to be configured on the server, not on the client. So it’s mydomain.net that needs to allow your localhost.

dobbel

@PhilWritesCode

you can check the request in the network tab of chrome dev tools( f12 or crt+shift+i)
read https://enable-cors.org/ for the server part

Chris11

@PhilWritesCode I am exactly where you were in july.

Could you please tell me how you solved this? I am also using the devServer and didn’t know how to correctly enable the cors if I don’t have any other backend.

Chris11

@dobbel other thread, same topic.
The cors header must be missing, otherwise the CORS Unblock extension wouldn’t solve it for me.

Could you give any insight on how to actually and specifically enable cors on the server (webpack devServer)?