Golang跨域请求Cookie传递失败问题排查与解决咨询

看起来你遇到了跨域场景下Cookie传递的典型问题，主要是CORS配置错误和客户端未开启凭证携带导致的，我们一步步来解决：

问题根源分析 #

• 错误的Access-Control-Allow-Origin位置：你把这个头放在了客户端的请求头里，但它是服务端必须返回的响应头，用来告诉浏览器允许哪个源的请求访问。
• 缺少凭证携带配置：跨域请求中，浏览器默认不会携带Cookie，必须显式开启withCredentials，同时服务端也要允许凭证。
• 预请求（OPTIONS）未处理：你的AJAX请求触发了CORS预请求（OPTIONS方法），但服务端没有处理这个请求，导致预校验失败。

解决方案 #

1. 修改服务端代码，添加正确的CORS配置 #

我们需要给服务端添加CORS相关的响应头，并且处理OPTIONS预请求。这里可以写一个简单的中间件来统一处理：

package main

import (
	"encoding/json"
	"fmt"
	"log"
	"net/http"
	"time"
)

// CORS中间件，处理跨域请求
func corsMiddleware(next http.Handler) http.Handler {
	return http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) {
		// 允许的源：如果是本地file://的HTML，部分浏览器支持"null"，建议用http服务托管HTML（比如localhost:8000）
		w.Header().Set("Access-Control-Allow-Origin", "null")
		// 允许携带凭证（Cookie）
		w.Header().Set("Access-Control-Allow-Credentials", "true")
		// 允许的请求方法
		w.Header().Set("Access-Control-Allow-Methods", "GET, POST, OPTIONS")
		// 允许的请求头
		w.Header().Set("Access-Control-Allow-Headers", "Content-Type")

		// 处理OPTIONS预请求，直接返回200
		if r.Method == "OPTIONS" {
			w.WriteHeader(http.StatusOK)
			return
		}

		next.ServeHTTP(w, r)
	})
}

func setCookie(w http.ResponseWriter, r *http.Request) {
	expiration := time.Now().Add(365 * 24 * time.Hour)
	// 跨域场景下需设置SameSite为None，生产环境必须配合Secure属性（HTTPS）
	cookie := http.Cookie{
		Path:     "/test_receive_cookie",
		Name:     "test_cors",
		Value:    "test_cors",
		Expires:  expiration,
		SameSite: http.SameSiteNoneMode,
		// Secure:   true, // 生产环境HTTPS必须开启，本地HTTP可暂时注释
	}
	http.SetCookie(w, &cookie)
	fmt.Fprintf(w, "Success")
}

func receiveCookie(w http.ResponseWriter, r *http.Request) {
	fmt.Println(r.Cookies())
	data := make(map[string]interface{})
	for _, cookie := range r.Cookies() {
		data[cookie.Name] = cookie.Value
	}
	w.Header().Set("Content-Type", "application/json")
	json.NewEncoder(w).Encode(data)
}

func main() {
	mux := http.NewServeMux()
	mux.HandleFunc("/set_cookie", setCookie)
	mux.HandleFunc("/test_receive_cookie", receiveCookie)

	// 应用CORS中间件
	err := http.ListenAndServe(":8012", corsMiddleware(mux))
	if err != nil {
		log.Fatal("ListenAndServe: ", err)
	}
}

2. 修改客户端AJAX代码，开启凭证携带 #

你之前把Access-Control-Allow-Origin放在请求头是错误的，需要移除，并开启withCredentials选项（以下示例假设你使用的是类似superagent的AJAX库）：

this._xhr.get("http://localhost:8012/test_receive_cookie")
  .withCredentials() // 开启携带Cookie的关键配置
  .end(function(err, resp) {
    console.log(resp);
    console.log(err);
  });

如果是原生XHR，写法如下：

const xhr = new XMLHttpRequest();
xhr.open('GET', 'http://localhost:8012/test_receive_cookie');
xhr.withCredentials = true; // 开启凭证携带
xhr.onload = function() {
  console.log(xhr.responseText);
};
xhr.onerror = function(err) {
  console.log(err);
};
xhr.send();

3. 额外注意事项 #

• 避免直接打开本地HTML文件：直接打开file://协议的HTML，origin是null，部分浏览器对null源的CORS限制更严格。建议用HTTP服务托管HTML，比如用Python的python -m http.server 8000，然后访问http://localhost:8000/your.html，此时服务端的Access-Control-Allow-Origin可以设为http://localhost:8000，更规范。
• SameSite Cookie属性：跨域场景下，Cookie必须设置SameSite=None，生产环境必须配合Secure属性（只有HTTPS才能携带），否则浏览器会阻止Cookie传递。本地HTTP环境可暂时注释Secure，但生产环境必须开启。

验证步骤 #

1. 重启修改后的Go服务。
2. 访问http://localhost:8012/set_cookie设置Cookie。
3. 用HTTP服务打开HTML文件，发起AJAX请求，此时服务端控制台应该能打印出Cookie，客户端也能收到包含Cookie的响应。

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