生产环境部署FastAPI时如何引用本地URL？解决CORS跨域问题

一、修正前端请求地址（核心解决方法） #

• 把Ajax请求里的硬编码地址http://localhost:8000/login改成相对路径/login。浏览器会自动使用当前页面的域名（即你的虚拟机IP地址）发起请求，彻底避免跨域问题。
• 示例代码（以jQuery为例）：

// 原错误写法
$.ajax({
  url: "http://localhost:8000/login",
  // 其他配置项
});

// 修改后的正确写法
$.ajax({
  url: "/login",
  // 其他配置项
});

二、配置FastAPI的CORS中间件（兜底保障） #

为增强部署环境下的健壮性，需在FastAPI中配置CORS中间件，明确允许指定来源访问：

1. 导入依赖模块：

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

2. 初始化应用并添加中间件：

app = FastAPI()

# 允许的来源列表，可添加虚拟机IP、本地开发地址等
origins = [
    "http://你的虚拟机IP地址",
    "http://localhost:8000",
]

app.add_middleware(
    CORSMiddleware,
    allow_origins=origins,
    allow_credentials=True,
    allow_methods=["*"],
    allow_headers=["*"],
)

• 注意：生产环境请勿使用allow_origins=["*"]，应明确指定允许的域名，避免安全风险。

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