0

I've set up two different GCP App Engine apps. One is an express server (let's call it foo) with the following app.yaml:

runtime: nodejs10
handlers:
- url: /tasks
  static_dir: /tasks
  http_headers:
    Access-Control-Allow-Origin: https://bar.appspot.com/
  secure: always

From my bar app, I'm trying to do a fetch call:

const response = await fetch('https://foo.appspot.com/tasks');

Every time I try this, however, Chrome blocks my request with the 'has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.' error. I've also tried just replacing the URL in the http_header with '*' to no avail. Why is this? What am I missing?

Edit: After some more digging, I'm finding that the headers being returned from foo don't even include the Access-Control-Allow-Origin header at all.

Edit 2: I finally bypassed this issue by just using the npm cors package: https://www.npmjs.com/package/cors

iamsellek
  • 76
  • 1
  • 6
  • For the sake of debugging, have you tried to use a wildcard to allow access to everyone? `Access-Control-Allow-Origin: *` – kyle Nov 29 '18 at 00:22
  • I should probably have specified that! Yes, I tried Access-Control-Allow-Origin: '*' (it didn't like it without the quotes), to no avail. Edited my original question! Thanks! – iamsellek Nov 29 '18 at 00:27

2 Answers2

1

Finally bypassed this by using the cors package: https://www.npmjs.com/package/cors. Good luck to you all!

iamsellek
  • 76
  • 1
  • 6
1

As of May 2020, I had the same issue, css files being blocked by CORS policy on browser, served by Google cloud storage.

And as addressed in this Gcloud wiki page: https://cloud.google.com/storage/docs/configuring-cors#configure-cors-bucket

It worked for me, by setting the CORS on the G storage bucket.

And don't need the handlers stuff config in app.yaml, and I'm not a big fan of YAML btw...

avocado
  • 2,615
  • 3
  • 24
  • 43