从 Angular 前端 IAP 访问烧瓶后端答案

【问题标题】：Access flask backend from angular frontend IAP从 Angular 前端 IAP 访问烧瓶后端
【发布时间】：2021-07-11 07:58:56
【问题描述】：

我的前端和后端部署在 Google App Engine 中。

我可以从我的 Angular 应用程序中请求我的烧瓶后端，但是当我使用 IAP 时它不起作用。我有这个错误：

Access to XMLHttpRequest at 'https://backend' from origin 'https://frontend' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

我试图这样做：https://cloud.google.com/iap/docs/authentication-howto?hl=fr#iap_make_request-python 但它不起作用。如果有人有想法...

【问题讨论】：

我在这个问题中找到了解决方案：stackoverflow.com/questions/60089830/…

标签： angular google-app-engine flask google-cloud-platform in-app-purchase

【解决方案1】：

您需要使用代理文件，例如我们说您有一个名为 proxy.conf.json 的文件有以下规则

假设你想用 url 访问一个 api：http://backend/api/* 所以你把你的 /api 请求重定向到你的后端服务器

{"/api": {

    "target": {
        "host": "url_of _your_backend_server",
        "protocol": "http:",
        "port": port_number_on_which_server_is_running
    },
    "changeOrigin": true,
    "secure": false
}}

保存配置文件后，使用此代理文件为您的 Angular 应用提供服务

ng serve --proxy-config proxy.conf.json

如果您遇到任何问题，请随时询问

【讨论】：

对不起，但这并没有改变任何东西，我的问题是一样的。 IAP 拒绝我的前端与后端的连接。
当然：{"/users": { "target": { "host": "https://backend.ew.r.appspot.com", "protocol": "https:" }, "changeOrigin": true, "secure": false }} 我的后端没有端口号，只有应用引擎 url
对于 https 服务器默认帖子是 443，所以这是你的配置文件 ` {"/users": { "target": { "host": "backend.ew.r.appspot.com" ，“协议”：“https：”，“端口”：443 }，“changeOrigin”：真，“安全”：假}}`
谢谢，但没有任何改变...我认为问题更多出在后端，他们没有自动执行前端请求...如果我通过导航器请求后端url 没关系，但前面我总是遇到 cors 政策问题。
你能把 url 提给你的 api 吗？

【解决方案2】：

IAP 要求用户登录到他们的 google 帐户才能访问受其保护的资源。你的应用有谷歌登录功能吗？如果没有，您需要将用户重定向到您的后端网址，该网址会自动将用户重定向到谷歌登录页面并在浏览器中设置 GCP_IAAP_AUTH_TOKEN_* cookie。发布后，您将能够对我们的 api 进行 api 调用而不会收到 401 错误。

请read this。

IAP 依赖 cookie 来管理用户会话。它还依赖于一系列重定向来建立会话作为登录流程的一部分。如果应用程序使用跨域资源共享 (CORS) 向受 IAP 保护的应用程序发出 AJAX 请求，则并不总是可以建立会话。

要成功向受 IAP 保护的应用发出 CORS 请求，需要在带外建立 IAP 会话。请注意，对于从 source_domain->target_domain 发送 CORS 请求的 AJAX 请求，其中 target_domain 托管受 IAP 保护的应用程序，需要在 target_domain 上建立会话。无法在 source_domain 和 target_domain 之间共享 cookie。

【讨论】：