Google AppEngine中Flask应用CSP的connect-src拦截API请求问题

看起来你遇到的是典型的内容安全策略（CSP）跨域连接限制问题——你的主应用域名http://my-project.appspot.com的CSP规则里，没有把GAE预览环境的域名http://review-dot-my-project.appspot.com加入connect-src的允许列表，所以浏览器直接拦截了这个XHR请求。

下面是几种针对性的解决方案，你可以根据自己的场景选择：

1. 直接添加固定预览域名到CSP #

如果你的预览环境域名是固定的（比如只有review-dot-这一个前缀），直接在Flask-Talisman的CSP配置里把这个域名加入connect-src即可：

from flask import Flask
from flask_talisman import Talisman

app = Flask(__name__)

# 配置包含主域名和预览域名的CSP规则
content_security_policy = {
    'connect-src': [
        "'self'",  # 允许同域名请求
        'http://my-project.appspot.com',
        'http://review-dot-my-project.appspot.com',
        # 记得加上HTTPS版本，GAE默认支持HTTPS，避免混合内容问题
        'https://my-project.appspot.com',
        'https://review-dot-my-project.appspot.com'
    ]
}

Talisman(app, content_security_policy=content_security_policy)

2. 使用通配符支持多预览分支 #

如果你的项目有多个预览分支（比如pr123-dot-、test-dot-这类动态生成的域名），可以用通配符来匹配所有基于my-project.appspot.com的子域名：

content_security_policy = {
    'connect-src': [
        "'self'",
        '*.my-project.appspot.com'  # 匹配所有以.my-project.appspot.com结尾的域名
    ]
}

⚠️ 注意：通配符会放宽CSP的限制，只建议在非生产环境或者你能确保所有子域名都是可信来源的场景下使用，生产环境尽量限制到具体域名。

3. 按环境动态配置CSP #

如果需要区分本地开发、生产、预览环境的CSP规则，可以通过环境变量动态生成配置：

import os
from flask import Flask
from flask_talisman import Talisman

app = Flask(__name__)

def build_csp_policy():
    base_policy = {
        'connect-src': ["'self'"]
    }
    
    # 判断当前运行环境（GAE标准环境会设置GAE_ENV变量）
    if os.environ.get('GAE_ENV') == 'standard':
        # 生产和预览环境，添加所有可信的GAE域名
        base_policy['connect-src'].extend([
            'https://my-project.appspot.com',
            'https://*.my-project.appspot.com'
        ])
    else:
        # 本地开发环境，允许localhost的请求
        base_policy['connect-src'].append('http://localhost:*')
    
    return base_policy

Talisman(app, content_security_policy=build_csp_policy())

额外排查小贴士 #

• 修改完CSP后，记得重启应用并清除浏览器缓存，避免旧的CSP规则被缓存。
• 可以通过浏览器开发者工具的Console面板查看具体的拦截错误，确认规则是否生效；也可以在Security面板里查看当前页面的CSP详情。
• 尽量使用HTTPS协议，GAE默认提供HTTPS支持，把CSP里的域名都改成HTTPS可以避免混合内容相关的额外问题。

内容的提问来源于stack exchange，提问作者Brian Leach