js ajax操作中，默认不能进行跨域访问，我们可以通过CORS配置实现最简单的跨域访问。这种方式是在服务端进行跨域访问控制。
一、编写服务端代码
新建一个ASP.NET MVC/WebApi项目，在其中分别新建Api方法及MVC Action方法：
WebApi方法如下：
public class ValuesController : ApiController { // GET api/values public IEnumerable<string> Get() { return new string[] { "value1", "value2" }; } // GET api/values/5 public string Get(int id) { return "value"; } // POST api/values public string Post([FromBody]MyModel value, string name) { TextHelper.WriteLineAppend(@"D:我的日志.txt", string.Format("API 你写的名字是：{0}", name)); return string.Format("API Hello, {0}", name); } // PUT api/values/5 public void Put(int id, [FromBody]string value) { } // DELETE api/values/5 public void Delete(int id) { } }
MVC Action方法如下：
public class HomeController : Controller { public ActionResult Index() { return View(); } public string MyTest(string name1, MyModel m) { TextHelper.WriteLineAppend(@"D:我的日志.txt", string.Format("MVC 你写的名字是：{0}", name1)); return string.Format("MVC Hello, {0}", name1); } }
二、编写客户端代码
新建另外一个ASP.NET MVC项目，引用jQuery文件，在页面中POST方式访问Api或MVC方法。
@{ Layout = null; } <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width" /> <title>Index</title> <script src="~/Scripts/jquery-1.8.2.min.js"></script> <script type="text/javascript"> $(function() { $("#btnTest").click(function () { //var url = "http://192.168.0.12:8013/api/values?name=HuaTao"; var url = "http://192.168.0.12:8013/home/mytest?name1=HuaTao"; $.post(url, {'No':3, Name:'WangGood', BirthDay:'2011-03-08 13:25:33'}, function(data) { alert(data); }); }); }); </script> </head> <body> <div> <input type="button" id="btnTest" value="测试" /> </div> </body> </html>
这样访问是不行的，会提示如下错误：
已 阻止跨源请求：同源策略禁止读取位于 http://192.168.0.12:8013/home/mytest?name1=%E5%8D%8E%E6%B6%9B 的远程资源。（原因：CORS 头缺少 'Access-Control-Allow-Origin'）。
三、在服务端添加CORS配置
为解决JS跨域问题，在服务端项目的配置文件中配置CORS：
<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>
如此即可进行JS跨域访问。