只要按照 步骤1 和 步骤2 就可以轻松解决跨域问题
1、配置web.config
需要在web.config的<system.webServer>节点增加如下内容
<system.webServer> <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> </system.webServer>
如需要支持自定义头信息,只需要在 <add name="Access-Control-Allow-Headers" value="Content-Type" /> 的value属性中增加即可。
例如,添加自定义 token 头信息,可以表示如下。
<add name="Access-Control-Allow-Headers" value="Content-Type,token" />
2、响应OPTIONS请求
跨域访问时,浏览器会先向web api服务器发送一个OPTIONS请求,所以Web api需要正确响应OPTIONS请求。只需要在 Global.asax 文件中,添加如下内容即可。
protected void Application_BeginRequest(object sender, EventArgs e) { var req = System.Web.HttpContext.Current.Request; if (req.HttpMethod.ToUpper() == "OPTIONS")//跨域响应 { Response.StatusCode = 200; Response.SubStatusCode = 200; Response.End(); } }
3、部署到IIS注意事项
部署到IIS时配置的应用程序池的托管管道模式要选择`集成`模式。使用`经典`模式,将无法正确响应OPTIONS请求,返回404 Not Found的错误。
4、前端注意事项
对于指定 Content-Type 为 application/json 的POST请求
- 若使用JQuery,则data中的字符串需要使用`JSON.stringify`进行序列化,否则后端接收到参数将为null(经测试验证即使字符串的格式本身已经符合json规范,也要使用JSON.stringify进行序列化)
- 若使用Angular,data中的字符串符合json格式规范即可。
5、参考资料