Calling Google Cloud API Gateway from Web(Javascript)

Question

I am new to this Google Cloud API Gateway. I followed each and every step in the document to create an API Gateway and its a success. I'm using Google API Gateway with differents backends like Google Cloud Function.

https://cloud.google.com/api-gateway/docs/quickstart

I tested this through the curl command and it's working fine - like getting the response from the backend (Cloud functions). Now, I want to do it programmatically. Calling the API Gateway from the website. When I tried to do it, I am getting the error like below

Error:

Access to XMLHttpRequest at 'https://[mygatewayid].uc.gateway.dev/hello2/' from origin 'http://localhost:5000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
    
POST https://[mygatewayid].uc.gateway.dev/hello2/ net::ERR_FAILED

My API calling from the web

$.ajax({
     type: "post",
     url: "https://[mygatewayid].uc.gateway.dev/hello2/",
     data:{
         PhoneNumber: phonum
     },
     async: true,
     cache: false,
     success: function(data,status) {
         console.log("Data: " + data);
     },
     error : function(x, e) { 
         console.log(x.responseText); 
     }
 });

My cloud function

exports.hello2 = functions.https.onRequest((req,res)=>{

    res.header("Access-Control-Allow-Origin","*");
    res.header("Access-Control-Allow-Headers","Origin,X-Requested-With,Content-Type,Accept");

    var phonum = req.body.PhoneNumber;
    console.log("phonum",phonum);

    let message = req.query.PhoneNumber || req.body.PhoneNumber || 'Hello World!';

    res.status(200).send(message);
});

My API Config file

Am I doing it in the wrong way(Calling)? Thanks in advance

score 1 · Answer 1 · answered Aug 02 '21 at 13:32

The feature is not yet available and should arrive soon. For now, you can add an OPTION in your openAPI spec, like that

paths:
  "/hello2":
    options:
      operationId: create-cors
      responses:
        200:
          description: Success
    get:
      ........

Calling Google Cloud API Gateway from Web(Javascript)

1 Answers1