如何从 App Engine 前端查询 Google Cloud Platform 的元数据服务器以获取计算引擎后端的身份令牌 (JWT)？

Question

We currently have an Angular 9 GCP App Engine instance on the frontend and a Django GCP Cloud Run service on the backend for our project. We would like to have the Angular app query GCP for a JWT token from the metadata server, which we will put in the header for each request to the backend. Upon querying according to this page , we keep getting the following "Mixed Content" error.

Mixed Content: The page at {our App Engine url} was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://metadata.google.internal/computeMetadata/v1/instance/service-accounts/default/identity?audience={audienceName}'. This request has been blocked; the content must be served over HTTPS.

We have tried to use the https version of the above GCP metadata url, which does not exist. In theory we should be able to retrieve this metadata since a GCP instance, the GCP App Engine app, is talking to the GCP Compute Engine backend. Does anyone have experience making this query from the UI to get a token to set in requests to the backend?

Answer 1

Even if you Angular9 app is hosted on App Engine, the code (the TS code, translated in Javascript) doesn't run on App Engine, but it runs on the client browser.

Ok, you are surely aware about this, but that will help me to explain you simpler your issue. You try to call an internal Google URL ( http://metadata.google.internal/... ). And thus, your Angular app, on your user browser, can't reach this API.

The good pattern is not this one. You have to expose an API on backend (appEngine or elsewhere, Cloud Functions or Cloud Run) that accepts the requests coming from your Angular9 app (according with your service requirement, the request can be authenticated (with firebase auth for example) or not).

Then your backend, hosted on Google Cloud, can request the metadata server and then generate a token to reach other services.