解决Python Flask路由404错误：Firebase部署问题

1. 配置Firebase托管重写规则 #

Firebase托管默认仅处理静态资源，需通过firebase.json配置重写，将API请求转发至Flask后端（需先将Flask部署为Firebase Functions）：

{
  "hosting": {
    "public": "static", // 替换为你的前端静态文件目录
    "rewrites": [
      {
        "source": "/mywebsite/**",
        "function": "flask-app" // 替换为你的Firebase Functions服务名称
      }
    ]
  }
}

2. 修正Flask路由与Functions适配 #

部署到Firebase Functions时，需确保WSGI入口正确，避免路由前缀问题：

from flask import Flask, jsonify, request
import functions_framework

app = Flask(__name__)

@app.route('/mywebsite/update_data', methods=['POST'])
def update_data():
    # 你的业务逻辑
    return jsonify({"code": 200, "msg": "success"})

# 适配Firebase Functions的HTTP入口
@functions_framework.http
def handle_request(request):
    return app(request.environ, start_response)

3. 修复前端fetch请求路径与错误处理 #

部署后相对路径可能因域名环境解析异常，同时需先校验响应状态再解析JSON，避免HTML内容导致的解析错误：

fetch('/mywebsite/update_data', {
  method: 'POST',
  headers: { 'Content-Type': 'application/json' },
  body: JSON.stringify(yourData)
})
.then(res => {
  if (!res.ok) {
    return res.text().then(errTxt => { throw new Error(`请求失败：${errTxt}`) });
  }
  return res.json();
})
.catch(err => console.error(err));

4. 验证Firebase Functions部署状态 #

• 执行firebase deploy --only functions重新部署后端
• 登录Firebase控制台，查看Functions的运行日志，确认无启动错误
• 直接访问Functions的测试URL（如https://us-central1-xxx.cloudfunctions.net/flask-app/mywebsite/update_data），验证是否返回正常JSON

5. 配置CORS解决跨域问题 #

若前端托管域名与Functions域名不同，需在Flask中启用CORS：

from flask_cors import CORS
CORS(app)

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