vue3 CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
时间: 2023-08-27 09:17:04 浏览: 80
问题描述中提到的错误是CORS跨域问题。这个错误是由于浏览器的安全策略导致的,浏览器不允许从一个域名的网页上发起对另一个域名的请求,除非另一个域名在响应中包含了特定的HTTP头部信息。
在Vue3中解决CORS问题的一种常用方法是配置代理。根据引用提供的代码,我们可以创建一个vue.config.js文件,并在其中配置代理。这个配置告诉Vue开发服务器将以/api开头的请求转发到目标域名https://www.runoob.com/,从而绕过浏览器的CORS策略限制。同时,配置中的changeOrigin参数设置为true表示要更改请求头中的Origin字段,使其指向目标域名,以便服务器正确响应请求。
接着,根据引用提供的代码,我们可以使用axios库发送请求。在代码中,我们给axios.get()方法传递了一个URL,这个URL是以/api开头的,这样会触发代理配置,将请求转发到目标域名。这样就可以绕过浏览器的CORS限制,获取到响应结果。
总结起来,要解决Vue3的CORS问题,我们需要在vue.config.js中配置代理,并使用axios发送请求。请注意,代理配置中的target参数应该设置为目标域名,pathRewrite参数可以用来重写请求路径。同时,确保使用的axios版本支持Vue3。
希望这个回答对你有帮助!<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* *2* *3* [Vue3解决跨域问题,报错Access-Control-Allow-Origin](https://blog.csdn.net/qq_46213352/article/details/121357602)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT0_1"}}] [.reference_item style="max-width: 100%"]
[ .reference_list ]
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.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_column_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)