12-07 比较两个前端端口

题目

保持 Cookie 和 API 地址相同，只改变页面端口，记录实际 OPTIONS、服务器响应与脚本可见结果；同时检查写入仍需令牌和权限。

推导与做法

端口参与 Origin，http://front.test 与 http://front.test:5173 是两个来源。预检先说明将使用的方法和请求头，服务端只为允许来源给出 Allow-Origin。

脚本能否读取响应由浏览器按 CORS 决定，不能把命令行客户端能读到正文当成浏览器已经获准。即使跨源读取被允许，真实写入仍要经过会话、CSRF 和记录归属检查。

过程图

%% 每个节点保留输入、执行位置或执行后的实际状态。 flowchart TD S0["前端Origin包含端口"] S1["OPTIONS声明方法与请求头"] S0 --> S1 S2["允许来源收到Allow-Origin"] S1 --> S2 S3["另一端口未获读取许可，写入仍核对身份"] S2 --> S3 classDef default fill:#EEF0FB,stroke:#4657B5,color:#24324A linkStyle default stroke:#4657B5

实现与运行

查看带注释实现。本题与相关处理函数放在同一章节代码文件中；启动工具负责定位相邻项目和选择题号。

在配套目录的 Web应用共同基础/web_project 中运行。先按项目 README 执行 uv sync --locked。

# 使用项目解释器运行本题，题号决定执行哪一组演示。
uv run python "../../学习索引/参考实现/代码/ch12.py" 12-07

程序按题号输出处理后的值、查询结果或状态。先和前面的手算比较，再修改一项输入重跑。

查看本题运行结果

# 与上面的手算状态和题目数值逐项比较。
{
  "http://front.test": {
    "OPTIONS": 204,
    "allow_origin": "http://front.test"
  },
  "http://front.test:5173": {
    "OPTIONS": 403,
    "allow_origin": null
  }
}