vue常用的跨域处理方式是什么


这篇文章主要讲解了“vue常用的跨域处理方式是什么”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“vue常用的跨域处理方式是什么”吧!

设置express代理请求

在基于vue-cli的项目中,在开发环境配置(config/dev.env.js)中设置代理,能够将所有/apidomain开头的请求都通过npm run dev启动的express服务器重定向到目标接口

proxyTable:{'/apidomain':{target:'localhost:prot',//或ip或域名。changeOrigin:true,pathRewrite:{'^/apidomain':''}}},

若要通过IP在局域网访问h6,启动开发服务器的时候添加host参数即可

即package.json的dev命令配置如下

"dev":"webpack-dev-server--inline--progress--configbuild/webpack.dev.conf.js--host0.0.0.0",

关闭chrome安全策略实现跨域

windows中新建一个bat文件粘贴下面的命令即可以此模式打开

cd"C:\ProgramFiles(x86)\Google\Chrome\Application"chrome.exe--disable-web-security--user-data-dir=c:/CorsUserData

asp.net core 服务端的CORS跨域设置

在实际设置中,因为在h6端添加header参数产生了预检(OPTIONS)请求,看了上述文章后将通用参数修改到了query参数中

1. 添加cors服务

publicvoidConfigureServices(IServiceCollectionservices){//若只有部分接口则定义一个或多个命名的CORS策略,并在运行时按名称然后选择的策略,通过特性标记去设置跨域详情见文档services.AddCors();}

2. 启用中间件

//读取配置文件中设置的允许跨域的域名CorsOrigins为一个数组设置["*"]则会允许所有varorigins=Configuration.GetSection("CorsOrigins").GetChildren().Select(s=>s.Value).ToArray();app.UseCors(e=>{e.WithOrigins(origins).AllowAnyHeader().AllowAnyMethod().AllowCredentials();});
//Startup文件中Configuration对象的获取publicIConfigurationConfiguration{get;}publicStartup(){varbuilder=newConfigurationBuilder()//...AddJsonFile($"appsettings.json");Configuration=builder.Build();}

JSONP

JSONP只支持GET请求,CORS支持所有类型的HTTP请求。JSONP的优势在于支持老式浏览器,以及可以向不支持CORS的网站请求数据。

感谢各位的阅读,以上就是“vue常用的跨域处理方式是什么”的内容了,经过本文的学习后,相信大家对vue常用的跨域处理方式是什么这一问题有了更深刻的体会,具体使用情况还需要大家实践验证。这里是主机评测网,小编将为大家推送更多相关知识点的文章,欢迎关注!


上一篇:php如何实现字符转电码

下一篇:Vue中怎么设置全局的cookie对象


Copyright © 2002-2019 测速网 www.inhv.cn 皖ICP备2023010105号
测速城市 测速地区 测速街道 网速测试城市 网速测试地区 网速测试街道
温馨提示:部分文章图片数据来源与网络,仅供参考!版权归原作者所有,如有侵权请联系删除!

热门搜索 城市网站建设 地区网站制作 街道网页设计 大写数字 热点城市 热点地区 热点街道 热点时间 房贷计算器