上次小喵之前一篇【WebAPI 設定多組(Multiple) 跨 Domain】裡面，透過Global.asax，讀取設定檔方式來判斷Client端傳入的Origin，藉此回傳【Access-Control-Allow-Origin】的Header來讓Client端允許CORS。後來同事又提供另一個方式來處理，只需在Server上放一個html，不用任何設定，就可以達到CORS限定多Domain的功能，方法真的非常簡單，怎麼做，讓我們看下去~
緣起
上次小喵之前一篇【WebAPI 設定多組(Multiple) 跨 Domain】裡面，透過Global.asax，讀取設定檔方式來判斷Client端傳入的Origin，藉此回傳【Access-Control-Allow-Origin】的Header來讓Client端允許CORS。後來同事又提供另一個方式來處理，只需在Server上放一個html，不用任何設定，就可以達到CORS限定多Domain的功能，方法真的非常簡單，怎麼做，讓我們看下去~
XDomain
這方式主要是使用 XDomain 的 JS Library，官方的網址如下：
【https://github.com/jpillora/xdomain】
官方的說明還蠻清楚的，小喵這邊就略做翻譯的工作，如果功能或方式有變，請以官方的為主。
使用方式：
假設小喵的相關狀況如下：
WebAPI端：網址是 http://xyz.domain1.com
Client端：網址是http://abc.domain2.com
其中使用到的xdomain.min.js可以下載到WebAPI端或Client端
單一Domain時：
1.WebAPI端
新增一個proxy.html的網頁，放在【http://xyz.domain1.com/xdomain/proxy.html】，其內容如下：
<!DOCTYPE HTML>
<script src="http://jpillora.com/xdomain/dist/0.5/xdomain.min.js" master="http://abc.domain2.com"></script>2.Client端
在使用Ajax的頁面中，新增一個JS的include，相關內容如下：
<script src="http://jpillora.com/xdomain/dist/0.5/xdomain.min.js" slave="http://xyz.domain1.com/xdomain/proxy.html"></script>
就這樣，剩下的就是直接使用Ajax，本來會遇到的CORS被拒絕的訊息瞬間不見。
多Domain時
1.Server端一樣新增一個proxy.html的檔案，不過內容可以
a.用*代表某domain下的各主機，例如：abc1.domain2.com , abc2.domain2.com, abc3.domain2.com , …，就可以設定為 *.domain2.com
所以proxy.html的內容將會是
<!DOCTYPE HTML> <script src="http://jpillora.com/xdomain/dist/0.5/xdomain.min.js" master="http://*.domain2.com"></script>b.多Domain，分別不同，假設分別有abc.domain2.com , def.domian3.com , ghi.domain4.com , …
那麼proxy.html的內容將會是
<script src="http://jpillora.com/xdomain/dist/0.5/xdomain.min.js"></script> <script> xdomain({ masters: { 'http://abc.domain2.com': /.*/ ,'http://def.domain3.com': /.*/ ,'http://ghi.domain4.com': /.*/ } }); </script>
2. 每個Client端都一樣，只需要設定好Server端的 proxy.html在哪裡，引用xdomain.min.js即可
<script src="http://jpillora.com/xdomain/dist/0.5/xdomain.min.js" slave="http://xyz.domain1.com/xdomain/proxy.html"></script>
末記
這方式提供了在Server端設定CORS的另一個選擇的方式，在XDomain裡面，使用這方式，也不會先送OPTION的Method，然後再送GET, POST，所以也不必特意去處理OPTION的Action。至於要用哪種，就由看官們決定囉。
^_^
以下是簽名：
- 歡迎轉貼本站的文章，不過請在貼文主旨上加上【轉貼】，並在文章中附上本篇的超連結與站名【topcat姍舞之間的極度凝聚】，感恩大家的配合。
- 小喵大部分的文章會以小喵熟悉的語言VB.NET撰寫，如果您需要C#的Code，也許您可以試著用線上的工具進行轉換，這裡提供幾個參考
| Microsoft MVP Visual Studio and Development Technologies (2005~2019/6) | topcat Blog:http://www.dotblogs.com.tw/topcat |
