How to secure a Google Cloud Function with API Gateway and CORS? - google-cloud-functions

Question

I created an API Gateway which uses the x-google-backend to a cloud functions.
When I tried to access it via browser I received a CORS error so I researched and find a solution by adding this to the OpenAPI config where the address part is the same as the cloud function.
options:
operationId: cors
x-google-backend:
address: https://europe-west3-myproject.cloudfunctions.net/api/query
responses:
'200':
description: A successful response
This works! So I removed the public access to the cloud function and gave the gateway service account access to it and tried again.
Which gave me a permission error. After research I found this post explaining the problem and giving me a solution to fix it.
The issue was that I call my define the cloud function with an additional path to call query. I added this to the OpenAPI config:
jwt_audience: https://europe-west3-myproject.cloudfunctions.net/api
So I tried it again in Postman and it works, however in the browser I now get again a CORS error.
So now I am at square one... what should I do?
Here is my complete OpenAPI config:
# openapi2-functions.yaml
swagger: '2.0'
info:
version: 1.0.0
schemes:
- https
produces:
- application/json
paths:
/query:
post:
operationId: api
parameters:
- in: "body"
name: "message"
schema:
$ref: '#/definitions/messasge'
x-google-backend:
address: https://europe-west3-myproject.cloudfunctions.net/api/query
jwt_audience: https://europe-west3-myproject.cloudfunctions.net/api
x-google-quota:
metricCosts:
"read-requests": 1
security:
- api_key: []
responses:
'200':
description: A successful response
schema:
type: string
options:
operationId: cors
x-google-backend:
address: https://europe-west3-myproject.cloudfunctions.net/api/query
responses:
'200':
description: A successful response
securityDefinitions:
# This section configures basic authentication with an API key.
api_key:
type: "apiKey"
name: "key"
in: "query"
x-google-management:
metrics:
# Define a metric for read requests.
- name: "read-requests"
displayName: "Read requests"
valueType: INT64
metricKind: DELTA
quota:
limits:
# Define the limit or the read-requests metric.
- name: "read-limit"
metric: "read-requests"
unit: "1/min/{project}"
values:
STANDARD: 100
definitions:
chatmessage:
type: "object"
properties:
id:
type: string
description: session id
example: "2vr34524tg3"
query:
type: string
description: message
example: "Hello"
required:
- id
- query

Answer 1

According to the documentation Cross-Origin Resource Sharing (CORS) on Cloud Functions has some limitations:
CORS preflight requests are sent without an Authorization header, so they will be rejected on all non-public HTTP Functions. Because the preflight requests fail, the main request will also fail.
To overcome this limitation in your case the mentioned documentation recommends to deploy a Cloud Endpoints proxy and enable CORS. Also you might find useful the Support CORS documentation page for a description of available CORS support options