Web Api 跨域解决方案
2024-10-12 17:05:54
一、跨域问题的由来
同源策略:出于安全考虑,浏览器会限制脚本中发起的跨站请求,浏览器要求JavaScript或Cookie只能访问同域下的内容。
正是由于这个原因,我们不同项目之间的调用就会被浏览器阻止。比如我们最常见的场景:WebApi作为数据服务层,它是一个单独的项目,我们的MVC项目作为Web的显示层,这个时候我们的MVC里面就需要调用WebApi里面的接口取数据展现在页面上。因为我们的WebApi和MVC是两个不同的项目,所以运行起来之后就存在上面说的跨域的问题。
二、跨域问题解决原理
CORS全称Cross-Origin Resource Sharing,中文全称跨域资源共享。它解决跨域问题的原理是通过向http的请求报文和响应报文里面加入相应的标识告诉浏览器它能访问哪些域名的请求。比如我们向响应报文里面增加这个Access-Control-Allow-Origin:http://localhost:8081,就表示支持http://localhost:8081里面的所有请求访问系统资源。其他更多的应用我们就不一一列举,可以去网上找找。
三、跨域问题解决细节
1、引用CORS
首先介绍下CORS如何使用,在WebApiCORS项目上面使用Nuget搜索“microsoft.aspnet.webapi.cors”,安装第一个
2、添加dll文件的引用
3、在web.config中添加配置
//代码
<!--httpProtocol为webApi跨域问题 -->
<httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Origin" value="*" />
<add name="Access-Control-Allow-Headers" value="Content-Type" />
<add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />
</customHeaders>
</httpProtocol>
4、下一步在web api 配置和服务中配置下
5、调用api的时候url写全
最新文章
- 网络编程之getaddrinfo
- Android Studio doesn&#39;t list my android phone
- Caring for our seniors
- 二叉树的建立与递归遍历C语言版
- Oracle的表空间和数据文件
- Yii2中系统定义的常用路径别名,如果获取web的url
- 从Trie谈到AC自动机
- 160921、React入门教程第一课--从零开始构建项目
- Js判断键盘按键
- Java实现0~100之和
- 使用phpExcel向mysql数据库导入excel
- STP根交换机,指定端口,根端口,阻塞端口
- React 组件开发初探
- PHP的线程安全与非线程(NTS)安全版本的区别
- ubuntu下ftp服务
- [Swift]SwiftyJSON的使用:解析JSON
- 【原创】VirtualBox 磁盘扩容教程
- (网页)web性能优化(转)
- arcgis api for javascript中使用proxy.jsp
- video组件的使用