cleverbeagle/pup

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://localhost:3000/graphql. (Reason: CORS request did not succeed).

auBusinessDaD opened this issue · 5 comments

Hey Team,

Trying to get this running on my local machine and use within my network, but on any device (other than the one hosting it - i.e. localhost) I get the error "Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://localhost:3000/graphql. (Reason: CORS request did not succeed)." when it is deplyed using "npm run dev".

I have quite literally just installed ubuntu on a blank machine, then installed Git, MeteorJS, NPM, and then followed the instructions to "sudo npm install" then "npm run dev" which spins up the localhost:3000

Would really love some help on this.

Hey @auBusinessDaD, to clarify are you trying to run the app on a remote machine (deploying to staging or production) and getting that error or just on your local machine?

Thanks for the quick response!

I have just created a machine using one of my old computers (locally at home) running Ubuntu and a fresh clone of Pup.

I can deploy a normal meteor app in this way, but wanted to use your amazing boilerplate - just need to overcome this cross-origin issue when I use the "npm run dev" and then try to login from my laptop. The home page loads fine, it is only when I try to login (or do anything that access the database, I think) that the error starts.

In order for that to work you will need to rely on the IP address of the old computer running the app (even though it's in your local network, your computer will treat it as an external site).

One thing to try would be getting the IP address of the computer the app is running on and then update this value in your settings-development.json file to point to something like http://192.168.1.123:3000/graphql and then build/re-upload your code to the machine.

As long as the app is running on port 3000 of the machine with that IP, external access via that IP should pass any CORS checks.

Thanks Ryan, you sir are a gentlemen!

It resolved the first cross-origin issue, the second is with the dynamic-import - "Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://localhost:3000/__meteor__/dynamic-import/fetch. (Reason: CORS request did not succeed).") which I am looking into now. I didn't realise it had two cross-origin issues.

AND... we have lift off!!!

meteor/meteor#10384

Anyway, this is fixed in dynamic-imports@0.5.3 with #11105, simply upgrade and add the following to your settings.json:

{
  "public": {
    "packages": {
      "dynamic-import": {
        "useLocationOrigin": true
      }
    }
  }
}