利用CORS配置实现jQuery对WebApi及MVC的跨域访问
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) { } }
View CodeMVC 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); } }
View Code 二、编写客户端代码新建另外一个ASP.NET MVC项目,引用jQuery文件,在页面中POST方式访问Api或MVC方法。
@{ Layout = null; } <!DOCTYPE html> <html> <head> <meta name=http://www.mamicode.com/"viewport" content=http://www.mamicode.com/"width=device-width" /> <title>Index</title> <script src=http://www.mamicode.com/"~/Scripts/jquery-1.8.2.min.js"></script> <script type=http://www.mamicode.com/"text/javascript"> $(function() { $("#btnTest").click(function () { //var url = ":8013/api/values?name=HuaTao"; var url = ":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=http://www.mamicode.com/"button" id=http://www.mamicode.com/"btnTest" value=http://www.mamicode.com/"测试" /> </div> </body> </html>
View Code这样访问是不行的,会提示如下错误:
已 阻止跨源请求:同源策略禁止读取位于 :8013/home/mytest?name1=%E5%8D%8E%E6%B6%9B 的远程资源。(原因:CORS 头缺少 ‘Access-Control-Allow-Origin‘)。
三、在服务端添加CORS配置
为解决JS跨域问题,在服务端项目的配置文件中配置CORS:
温馨提示: 本文由Jm博客推荐,转载请保留链接: https://www.jmwww.net/file/67793.html
- 上一篇:delphi log
- 下一篇:C#之#if #endif的简单用法