跨域理解及常用解決方案

什么是跨域？

瀏覽器從一個域名的網頁去請求另一個域名的資源時，域名、端口、協議任一不同，都是跨域。
跨域並不是請求發不出去，請求能發出去，服務端能收到請求並正常返回結果，只是結果被瀏覽器攔截了。
這是由於瀏覽器的同源策略而導致的，同源策略限制了不同源之間的資源進行交互，用於隔離潛在的惡意文件的安全機制，並且是瀏覽器最基本的安全機制。

以 https://www.cnblogs.com/liangshibo/p/12275129.html 為例：域名是指"//"和"/"之間的全部內容，也就是"www.cnblogs.com",當我們從另一個域名的js中獲取該域名下的資源時，就會產生跨域。
當然，如果你直接在地址欄里獲取資源，是不會產生跨域的，這也就是為什么有的后台接口在地址欄里打開沒問題，用ajax獲取就報錯的原因。

常見的跨域場景有哪些？

1、同一域名，不同端口。http://www.demo.com:8000/a.js && http://www.demo.com/b.js
2、同一域名，不同協議。http://www.demo.com:8000/a.js && https://www.demo.com/b.js
3、域名和域名對應相同 IP。http://localhost:8000/a.js && http://127.0.0.1:8000/b.js

如何解決跨域？

1、jsonp，是json的一種使用模式，僅支持get方式，這里就不寫了，畢竟一搜一大堆，我應該也用不到

2、跨域資源共享（cors），在服務器端的webconfig設置允許跨域。以下是代碼：

<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>