在Vercel部署含render_template的Flask应用出现404错误求助

核心问题解析 #

你的部署配置存在几个关键错误，导致Flask后端路由未被正常触发，请求被直接导向静态HTML文件，最终出现404：

• vercel.json中使用了不存在的@vercel/templates构建器，且无需单独配置templates文件夹的构建规则
• 路由规则将所有请求直接转发到./templates/index.html，完全绕过了Flask的后端路由逻辑
• Flask实例未按Vercel要求正确导出，平台无法识别并运行后端服务

具体修复步骤 #

1. 修正vercel.json配置 #

删除无效的templates构建规则，调整路由优先级，让静态资源请求直接返回，其余请求交给Flask处理：

{
  "version": 2,
  "builds": [
    {
      "src": "./fsk.py",
      "use": "@vercel/python"
    },
    {
      "src": "./static/**",
      "use": "@vercel/static"
    }
  ],
  "routes": [
    {
      "src": "/static/(.*)",
      "dest": "/static/$1"
    },
    {
      "src": "/(.*)",
      "dest": "./fsk.py"
    }
  ]
}

• 优先匹配静态资源请求，避免Flask处理不必要的静态文件请求
• 剩余所有请求交由fsk.py处理，确保Flask路由规则生效

2. 调整fsk.py代码 #

• 不需要添加app.run()，Vercel作为生产环境平台会自动处理Flask应用的运行（仅本地开发时需要该代码）
• 必须导出名为application的Flask实例，Vercel依赖此变量识别后端服务：

from flask import Flask, render_template

app = Flask(__name__)

@app.route('/')
def index():
    return render_template('index.html')

# Vercel需要识别的Flask实例变量
application = app

3. 确认模板路径 #

Flask默认会在与主脚本同级的templates文件夹查找模板，你的项目结构符合这一要求，无需额外配置template_folder参数。

4. 重新部署 #

删除Vercel上的旧部署记录，重新推送代码触发新部署，确保所有配置变更生效。

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