Go基础（⑥Cors）

1. 跨域的定义

只要有一个不同就是跨域

协议不同：http vs https = 跨域
域名不同：localhost vs 192.168.1.1 = 跨域
端口不同：3000 vs 8080 = 跨域

你的项目就是端口不同

前端：http://localhost:3000
后端：http://localhost:8080端口 3000 ≠ 端口 8080 = 跨域！

2. 为什么端口不同就是跨域？

浏览器认为这是不同的网站

http://localhost:3000  ← 浏览器认为这是网站A
http://localhost:8080  ← 浏览器认为这是网站B网站A想访问网站B = 跨域！

项目架构

前端：http://localhost:3000  (Vue 开发服务器)
后端：http://localhost:8080  (Go API 服务器)端口不同 = 跨域！

现代浏览器都会阻止跨域！

✅ Chrome - 阻止跨域
✅ Firefox - 阻止跨域  
✅ Safari - 阻止跨域
✅ Edge - 阻止跨域
✅ Opera - 阻止跨域

3. 具体操作

后端设置（只需要一次）

// 在你的 main.go 里加这几行
r.Use(cors.New(cors.Config{AllowOrigins: []string{"http://localhost:3000"},AllowMethods: []string{"GET", "POST", "PUT", "DELETE", "OPTIONS"},AllowHeaders: []string{"Origin", "Content-Type", "Accept", "Authorization"},
}))

前端不用改

// 前端代码完全不用改
fetch('http://localhost:8080/api/users').then(response => response.json()).then(data => console.log(data))

为什么没有设置 IP 端口？

// 这样写 = 允许任何网站访问
c.Header("Access-Control-Allow-Origin", origin)// 应该这样写 = 只允许特定网站访问
c.Header("Access-Control-Allow-Origin", "http://localhost:3000")

123