https://blog.csdn.net/zhoucheng05_13/article/details/53580683
No 'Access-Control-Allow-Origin' header is present on the requested resource.'Ajax跨域訪問解決方案
當使用ajax訪問遠程服務器時,請求失敗,瀏覽器報如上錯誤。這是出於安全的考慮,默認禁止跨域訪問導致的。
一、什么是跨域訪問
舉個栗子:在A網站中,我們希望使用Ajax來獲得B網站中的特定內容。如果A網站與B網站不在同一個域中,那么就出現了跨域訪問問題。你可以理解為兩個域名之間不能跨過域名來發送請求或者請求數據,否則就是不安全的。跨域訪問違反了同源策略,同源策略的詳細信息可以點擊如下鏈接:Same-origin_policy;
總而言之,同源策略規定,瀏覽器的ajax只能訪問跟它的HTML頁面同源(相同域名或IP)的資源。
二、解決方案
常用的解決方案有兩種,可以分為客戶端解決方案和服務器端解決方案。先說服務器端解決方案:
-
服務器端解決方案
在服務器端的filter或者servlet里面添加response.setHeader("Access-Control-Allow-Origin", "*");
“Access-Control-Allow-Origin”表示允許跨域訪問,“*”表示允許所有來源進行跨域訪問,這里也可以替換為特定的域名或ip。
很顯然,這種方式對非網站擁有人員來說是不能做到的。而且此種方式很容易受到CSRF攻擊。 -
客戶端解決方案
$(function($){ var url = 'http://*****/index'; $.ajax(url, { data: { 'cityname': '成都', 'date': '2016.12.12' }, dataType: 'jsonp', crossDomain: true, success: function(data) { if(data && data.resultcode == '200'){ console.log(data.result.today); } } });
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
將ajax請求中的dataType屬性設置為“jsonp”,jsonp是專門用來解決跨域訪問而誕生的。
從服務器端和前端兩個角度更加詳細的講解以及完整實例請參看博客:從前端和后端兩個角度分析jsonp跨域訪問(完整實例)
https://www.cnblogs.com/lovling/p/6397039.html
在web.config文件中的 system.webServer 節點下 增加如下配置
<httpProtocol> <customHeaders> <add name="Access-Control-Allow-Origin" value="*" /> <add name="Access-Control-Allow-Headers" value="*" /> <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE" /> </customHeaders> </httpProtocol>