CORS issue in Angular 4 frontend with Endpoints serving go API on App Engine

Santosh Kumar

unread,

Sep 30, 2017, 1:03:12 PM9/30/17

to Google Cloud Endpoints

I am unable to call API running in the google cloud behind cloud endpoints from the Angular 4 front end. I am getting following errors:

Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:4200' is therefore not allowed access. The response had HTTP status code 403.

I am running swagger too on the local machine and making successful API calls from swagger.

If I take a look at stackdriver log:

Endpoints management skipped for an unrecognized HTTP call: OPTIONS /users/user?u=xx...@yyyy.com

If I test this from cURL or Swagger my call passes through and cors is handled properly. The stackdrive log for the same call as above is:

asia-northeast1-a2002 msMethod: CORS

I am unable to understand why cors is handled if request is sent from cURL, but not if it is browser.

My various settings are as follows:

OpenAPI(Swagger Specification):

host: MyApp.appspot.com
x-google-endpoints:
  - name: MyApp.appspot.com
    allowCors: true

GO Server CORS Settings: I am using "github.com/rs/cors" library

c := cors.New(cors.Options{
        AllowedOrigins:   []string{"*"},
        AllowedHeaders:   []string{"*"},
        AllowedMethods:   []string{"GET", "PUT", "POST", "HEAD", "DELETE"},
        AllowCredentials: true,
    })

Angular 4 App:

const payloadHeaders = new Headers({'Access-Control-Allow-Origin' : 'http://localhost:4200','authorization':'Bearer *********'});
    var url = 'https://MyApp.appspot.com/users/user?u=' + username;
    this.http.get(url,{headers:payloadHeaders}).timeout(3000)
    .map((response) => {
      return response.json();
    }).subscribe(

Does anyone know how I can overcome this CORS issue?

Thanks

Dan Ciruli

unread,

Oct 1, 2017, 5:47:09 PM10/1/17

to Santosh Kumar, Google Cloud Endpoints

Hi, Santosh -

Can you tell me what backend you are using (App Engine [Standard or Flex], GKE, GCE, other)?

DC

--
You received this message because you are subscribed to the Google Groups "Google Cloud Endpoints" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-cloud-endpoints+unsub...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-cloud-endpoints/d681352b-f6d1-4f90-b2ed-5f7633d3fcd7%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

--

DC

Santosh Kumar

unread,

Oct 1, 2017, 6:20:35 PM10/1/17

to Google Cloud Endpoints

Hi Dan, Thanks for taking a look. The backend is App Engine Flex.

Santosh Kumar

unread,

Oct 2, 2017, 4:07:57 AM10/2/17

to Google Cloud Endpoints

I am also attaching stackdriver logs for more clarification. Please see attached images.

Stackdriver Log.jpeg

Detailed_Error.jpeg

Santosh Kumar

unread,

Oct 2, 2017, 6:07:35 AM10/2/17

to Google Cloud Endpoints

Hi Dan, thanks for looking into it. There was an error at my end, I was missing a component of path. Now it works fine. It can be closed or removed.