FastAPI配置Chrome扩展跨域：为何chrome-extension://*通配符失效？

核心原因 #

浏览器对Chrome扩展源的CORS验证规则和普通HTTP/HTTPS源存在差异：

• 带前缀的通配符chrome-extension://*并不被浏览器认可为合法匹配规则，即便后端CORSMiddleware配置了该值，浏览器仍会判定源不匹配，触发CORS拦截。
• 全局通配符*属于CORS规范内的合法值（只要未启用allow_credentials=True），因此能被浏览器正常接受。
• 精确配置扩展ID时，后端返回的Access-Control-Allow-Origin头与请求Origin完全匹配，符合浏览器验证要求，所以不会报错。

解决方案 #

1. 固定扩展场景：直接配置完整的扩展ID，这是最直接且安全的方式，就像你测试的那样。
2. 多扩展适配场景：通过动态验证Origin头并返回对应值的方式处理，示例代码如下：

from fastapi import FastAPI, Request
from fastapi.middleware.cors import CORSMiddleware

app = FastAPI()

# 初始化CORSMiddleware，关闭固定origins限制
app.add_middleware(
    CORSMiddleware,
    allow_origins=[],
    allow_methods=["*"],
    allow_headers=["*"],
    allow_credentials=False,
)

# 动态处理CORS Origin
@app.middleware("http")
async def dynamic_cors_validation(request: Request, call_next):
    origin = request.headers.get("Origin")
    response = await call_next(request)
    
    # 验证并允许Chrome扩展源
    if origin and origin.startswith("chrome-extension://"):
        response.headers["Access-Control-Allow-Origin"] = origin
    # 同时保留localhost的匹配
    elif origin and origin.startswith("http://localhost:"):
        response.headers["Access-Control-Allow-Origin"] = origin
    
    return response

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