一、通过IIS配置
可以参考《跨域访问-需要设置HTTP响应标头》, 这种方法其实就是改了Web.config(即下面的第二种方法),只不过是提供一个操作的介面罢了。
二、配置Web.config文件 (推荐)
1、允许 "所有网站" 跨域访问写法:
<configuration>
<system.webServer>
<httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Methods" value="OPTIONS,POST,GET"/>
<add name="Access-Control-Allow-Headers" value="x-requested-with,content-type"/>
<add name="Access-Control-Allow-Origin" value="*" />
</customHeaders>
</httpProtocol>
</system.webServer>
</configuration>
2、只允许 "1个网站" 跨域访问
可以将 <add name="Access-Control-Allow-Origin" value="*" /> 改成如下写法:
<add name="Access-Control-Allow-Origin" value="http://domain1.com" />
注意:value值只能是一个域名,如果是一个具页面,例如:http://domain1.com/index.html 是无效的。
3、允许 "多个网站" 跨域访问
网上说可以用逗号(,)将网站分开,即:
<add name="Access-Control-Allow-Origin" value="http://domain1.com, http://domain2.com" />
但经测试失败。
网上《在 Web.config 中,配置允许多个指定的域名进行跨域访问》说可以利用“ URL Rewrite 组件”来实现(未测式)
可以从微软官方下载 URL Rewrite(支持 IIS 7 以及之后的版本)
可以在 IIS 中使用 Web 平台安装器 进行安装
该组件安装好后(重启服务器),在 Web.config 中定位到 <system.webServer>,不用再添加 <httpProtocol> 中的跨域配置了,取而代之的是添加 <rewrite> 的配置,如下所示:
<system.webServer>
<!-- 其它配置 -->
<rewrite>
<outboundRules>
<rule name="AddCrossDomain">
<match serverVariable="RESPONSE_Access_Control_Allow_Origin" pattern=".*" />
<conditions logicalGrouping="MatchAll" trackAllCaptures="true">
<add input="{HTTP_ORIGIN}" pattern="(http(s)?://((.+\.)?domain1\.com|(.+\.)?domain2\.com|(.+\.)?domain3\.com))" />
</conditions>
<action type="Rewrite" value="{C:0}" />
</rule>
</outboundRules>
</rewrite>
</system.webServer>
至此,允许多个指定域名的跨域访问就配置完了。
三、在webservice 的方法上改响应头信息
后端
[WebMethod]
public void SayHi()
{
//支持跨域, 改写响应头信息
HttpContext.Current.Response.Headers.Add("Access-Control-Allow-Origin", "*");
HttpContext.Current.Response.Headers.Add("Access-Control-Allow-Methods", "GET, POST, DELETE, PUT, OPTIONS, TRACE, HEAD, PATCH");
HttpContext.Current.Response.Headers.Add("Access-Control-Allow-Headers", "x-requested-with,content-type");
// 注意:如果前端dataType为"json",必须先转换再返回(否则回调前端的error而不是success)
HttpContext.Current.Response.Write(JsonConvert.SerializeObject("Say Hi!"));
HttpContext.Current.Response.End();
}
前端调用方法
$.ajax({
type: "get", // 只能用get方法, post一直试未成功
url: "http://127.0.0.1/myservice/MyService.asmx/SayHi",
dataType: "json",
success: function (result, status) {
alert(result);
},
complete: function (XMLHttpRequest, textStatus) {
var returnText = XMLHttpRequest.responseText;
},
error: function (err) {
alert("跨域访问失败!");
},
});
web.config 为支持get方法访问要加以下代码
<!-- 支持用GET、POST方法访问 WebService -->
<webServices>
<protocols>
<add name="HttpGet"/>
<add name="HttpPost"/>
</protocols>
</webServices>
<!-- 支持用GET方法访问 WebService -->
注意点:
1.前端用get方式访问
2.后端返回的数据格式要与前端datatype一致
3.后端用无返回函数(void)
4.改web.config支持用get方法访问
四、想了解更多的方式 可参考《Access-Control-Allow-Origin 如何设置多个值呢》介绍了a、b、c、d四种方法
参考资料:
1、C#.net 设置Access-Control-Allow-Origin来实现跨域
2、jquery ajax跨域请求webservice webconfig配置
3、ajax 设置Access-Control-Allow-Origin实现跨域访问
————————————————
版权声明:本文为CSDN博主「chelen_jak」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/chelen_jak/article/details/79725684