vite中请求接口https://csm.sodsoft.cn/Learning/api/ProductManual/listAllClass,跨域怎么处理
时间: 2023-12-20 21:04:28 浏览: 32
在 Vite 中处理跨域请求有两种方式:
1. 通过 vite.config.js 配置文件设置代理
在项目根目录下创建 `vite.config.js` 文件,然后添加如下代码:
```javascript
module.exports = {
proxy: {
'/api': {
target: 'https://csm.sodsoft.cn',
changeOrigin: true,
rewrite: path => path.replace(/^\/api/, '/Learning/api')
}
}
}
```
这里设置了一个代理,将所有以 `/api` 开头的请求转发到 `https://csm.sodsoft.cn/Learning/api` 地址,其中 `changeOrigin` 参数表示是否改变请求头中的 Origin 字段,`rewrite` 参数表示重写请求路径。这样,我们就可以使用 `/api/ProductManual/listAllClass` 来请求数据了。
2. 在接口请求中添加 CORS 头信息
在请求接口时,通过添加 CORS 头信息来实现跨域请求。可以使用 `fetch` 函数或者 `axios` 库来发送请求,这里以 `fetch` 函数为例:
```javascript
fetch('https://csm.sodsoft.cn/Learning/api/ProductManual/listAllClass', {
mode: 'cors',
headers: {
'Access-Control-Allow-Origin': '*'
}
}).then(response => {
// 处理响应数据
}).catch(error => {
// 处理请求失败
})
```
在请求头中添加 `Access-Control-Allow-Origin: *` 字段,表示允许所有域名访问该接口。注意,这种方法需要服务器端也支持 CORS,否则无法正常访问。
相关推荐
![rar](https://img-home.csdnimg.cn/images/20210720083606.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)