Nginx 中怎么通过 location 匹配实现前后端同域部署的 Cookie 共享

浅浩吖_8379

浅浩吖_8379

2026-09-13

835人浏览

原创

cookie共享的关键是确保前后端同域且nginx正确透传与修正cookie:后端set-cookie需设domain=.example.com,nginx中proxy_cookie_path / /api/修正路径,proxy_cookie_domain设为合法域名,并添加secure、samesite等安全标志。

nginx 中怎么通过 location 匹配实现前后端同域部署的 cookie 共享

前后端同域部署下,Cookie 共享的关键不是“跨域”,而是确保前端页面和后端接口在浏览器看来属于同一 domain + path 作用域,且 Nginx 不意外剥离或重写 Cookie。location 匹配本身不直接“实现”共享,但它决定了请求如何分发、Header 如何透传、Cookie 如何被修改或保留——这些才是共享能否成立的实操基础。

核心前提:必须同主域名(或显式设置 domain)

浏览器只在满足以下任一条件时自动携带 Cookie:

  • 请求域名与 Cookie 的 Domain 属性完全一致(如 a.example.com 请求携带 Domain=a.example.com 的 Cookie);
  • 请求域名是 Cookie Domain 的子域,且 Domain 设置为带前导点的主域(如 Domain=.example.com,则 api.example.comwww.example.com 都能携带);
  • 未设置 Domain,则默认绑定当前请求域名(最严格,也最易出错)。

所以第一步不是写 location,而是让后端返回的 Set-Cookie 显式带上 Domain=.example.com(Spring Boot 可配 server.servlet.session.cookie.domain=.example.com),或由 Nginx 在反向代理时统一注入。

location /api/ 中必须透传并修正 Cookie 路径

当 Nginx 把 /api/xxx 请求代理到后端 http://localhost:8080/xxx 时,后端可能返回 Set-Cookie: token=abc; Path=/。但浏览器看到的是 https://example.com/api/ 请求,而 Path=/ 表示该 Cookie 只在根路径生效,不会匹配 /api 下的请求——导致后续请求不带 Cookie。

Nginx Config Linter
Nginx Config Linter

对 Nginx 配置文件进行语法检查、验证和安全、性能审计。

下载

解决方法是在 location /api/ 块中添加:

  • proxy_cookie_path / /api/;:把后端返回的 Path=/ 改成 Path=/api/,使 Cookie 仅对 /api/* 路径有效;
  • proxy_cookie_domain off;proxy_cookie_domain localhost:8080 example.com;:防止后端返回的 Domain=localhost:8080 被浏览器拒绝(无效域名),强制设为合法域名;
  • proxy_pass_request_headers on;(默认开启)确保原始 Cookie 头传给后端;
  • proxy_set_header Cookie $http_cookie; 显式传递,避免某些场景丢失。

location / 中服务静态资源,不干扰 Cookie

前端 HTML、JS、CSS 由 Nginx 直接提供,访问路径如 https://example.com/https://example.com/login。只要这些页面的域名与 API 一致(都是 example.com),且页面中发起的 fetch/fetch API 请求路径以 /api/ 开头,浏览器就会自动携带已有的 Domain=.example.com; Path=/api/ Cookie。

注意:try_files $uri $uri/ /index.html; 不影响 Cookie,它只处理前端路由 fallback,与 Cookie 无关。

额外加固:确保 HTTPS 下 Cookie 安全属性兼容

若站点启用 HTTPS,后端或 Nginx 应确保 Cookie 带上 SecureSameSite=Lax(或 None; Secure,需配合 CORS):

  • Nginx 可用 proxy_cookie_flags ~ secure httponly samesite=lax;(1.19.3+)统一添加标志;
  • 避免后端返回 SameSite=Strict 导致跨路径(如从 //api/)不携带;
  • 不要在 HTTP 环境下设 Secure,否则 Cookie 不会被发送。

相关专题

更多
python是前端还是后端
python是前端还是后端

Python属于前端也属于后端,其灵活性和丰富的生态系统使得开发人员能够在不同的领域中灵活运用。本专题为大家提供python相关的文章、下载、课程内容,供大家免费下载体验。

2023.08.11

2023

5

前端和后端的区别
前端和后端的区别

前端关注的是用户界面的设计和交互,而后端则注重数据处理和逻辑控制。想了解更多前端后端的相关内容,可以阅读本专题下面的文章。

2024.03.19

5430

13

后端的主要工作内容介绍
后端的主要工作内容介绍

后端是应用程序的服务端部分,负责核心任务,如数据库交互、业务逻辑处理和响应客户端请求。想了解更多后端的相关内容,可以阅读本专题下面的文章。

2024.03.19

4766

10

nginx 重启
nginx 重启

nginx重启对于网站的运维来说是非常重要的,根据不同的需求,可以选择简单重启、平滑重启或定时重启等方式。本专题为大家提供nginx重启的相关的文章、下载、课程内容,供大家免费下载体验。

2023.07.27

363

5

nginx 配置详解
nginx 配置详解

Nginx的配置是指设置和调整Nginx服务器的行为和功能的过程。通过配置文件,可以定义虚拟主机、HTTP请求处理、反向代理、缓存和负载均衡等功能。Nginx的配置语法简洁而强大,允许管理员根据自己的需要进行灵活的调整。php中文网给大家带来了相关的教程以及文章,欢迎大家前来学习阅读。

2023.08.04

2927

6

nginx配置详解
nginx配置详解

NGINX与其他服务类似,因为它具有以特定格式编写的基于文本的配置文件。本专题为大家提供nginx配置相关的文章,大家可以免费学习。

2023.08.04

5385

6

tomcat和nginx有哪些区别
tomcat和nginx有哪些区别

tomcat和nginx的区别:1、应用领域;2、性能;3、功能;4、配置;5、安全性;6、扩展性;7、部署复杂性;8、社区支持;9、成本;10、日志管理。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

2024.02.23

541

5

nginx报404怎么解决
nginx报404怎么解决

当访问 nginx 网页服务器时遇到 404 错误,表明服务器无法找到请求资源,可以通过以下步骤解决:1. 检查文件是否存在且路径正确;2. 检查文件权限并更改为 644 或 755;3. 检查 nginx 配置,确保根目录设置正确、没有冲突配置等等。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

2024.07.09

1436

5

Nginx报404错误解决方法
Nginx报404错误解决方法

解决方法:只需要加上这段配置:try_files $uri $uri/ /index.html;即可。想了解更多Nginx的相关内容,可以阅读本专题下面的文章。

2024.08.07

3898

3

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
phpEnv手册
phpEnv手册

共0课时 | 0人学习

nginx手册
nginx手册

共0课时 | 0人学习

进程与SOCKET
进程与SOCKET

共6课时 | 0.5万人学习