CORS（跨域资源共享）_CORS_开发者可以根据具体需求选择合适的解决方案
作者：机器人技术佬 |
发布时间：2025-07-02 |
一、CORS（跨域资源共享）
CORS 是现在浏览器普遍支持的跨域解决方案，它就像一把钥匙，让服务器告诉浏览器：“你可以访问我的资源”。下面是设置 CORS 的几个关键步骤：
- 服务器设置响应头：
- Access-Control-Allow-Origin：指定允许访问的域名
- Access-Control-Allow-Methods：指定允许的HTTP方法（如GET, POST, PUT, DELETE）
- Access-Control-Allow-Headers：指定允许的请求头
- Access-Control-Allow-Credentials：是否允许发送Cookie等凭证
示例代码（Node.js）：
```javascript
res.header('Access-Control-Allow-Origin', '');
res.header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE');
// 其他响应头设置...
```
二、代理服务器（Proxy）
在开发阶段，代理服务器就像一个中间人，帮你绕过浏览器的限制。Vue CLI 提供了内置的代理功能，你可以这样配置：
- 配置代理服务器：
在 `vue.config.js` 文件中添加代理配置：
```javascript
module.exports = {
devServer: {
proxy: {
'/api': {
target: '',
changeOrigin: true,
pathRewrite: {'^/api' : ''}
}
}
}
};
```
解释：
- `target`：目标服务器的地址
- `changeOrigin`：是否改变请求的源
- `pathRewrite`：重写路径，将前缀去掉
三、JSONP（JSON with Padding）
JSONP 是一种古老的跨域技术，它通过动态插入 `