認真的用fiddle處理跨域
相信很多前端的同學都或多或少被跨域這個問題煩惱過，網上很多處理的方式其實都是要后端處理，
用fiddle來處理 ，就不必看后端的臉色了，自己安安心心的倒騰接口，何樂而不為。
在使用fiddle處理跨域之前，所需要注意的：
- 1、是http請求還是的https請求，如果是https請求的話，要導入下證書，具體的步驟的：
- 2、下載證書 點擊下載
- 3、下載完后雙擊安裝即可。
- 4、然后是fiddle的一些配置，可以參考下這篇文章只需要看前面半部分的配置即可
- 5、可以輸入 https://www.baidu.com 測試下是否能夠捕獲https請求。
- 6、到這里前期工作基本完成。
要區分需要處理跨域的場景
1、網上百花撩亂的fiddle處理方式
如果去搜索fiddle處理跨域，想必會搜索出來滿屏幕的fiddle的處理方式。
不能用的不能說是錯的，只是可能不適用當前自己所需要的場景。
2、場景1，用本地的文件來替代網絡上的文件，進行規則替換
這類的文章少說占了搜索結果的一半，
例如csdn的一篇 前端開發fiddler跨域請求代理
實際上就是對線上的文件進行替換，單個替換，正則匹配都行。
替換成功后，便可以在本地修改代碼使之生效。
3、場景2，修改的Customize Rules，通常我們都這這類去修改規則，才能解決自己的跨域問題
值得注意的是，在這個場景值其實也分為兩塊，一塊是在OnBeforeRequest中，還有一塊是在OnBeforeResponse中，
就是一個發送請求之前，另一個是在發送請求之后響應之前 搞清楚了這個以后，就很容易知道自己在哪個地方，去添加什么代碼了
如圖所示：
具體舉例說明：
1、當需求在請求返回的時候解決跨域，要設置 Access-Control-Allow-Origin:*
static function OnBeforeResponse(oSession: Session) {
if (m_Hide304s && oSession.responseCode == 304) {
oSession["ui-hide"] = "true";
}
oSession.responseCode=200;
oSession.oResponse.headers.Add("Access-Control-Allow-Headers", "content-type,x-requested-with");
oSession.oResponse.headers.Add("Access-Control-Allow-Origin","*");
}
可以參考 這篇文章
2、當要設置請求頭部的時候，就需要在OnBeforeRequest做文章了
if (oSession.HostnameIs("xxx.xxx.com")){
oSession.oRequest.headers.Remove("Origin");
}
例如可以針對特定的域名移除掉Origin
此外也可以處理重定向
var origin_host="172.16.11.21";
var origin_port="8080";
var origin_domain=origin_host+":"+origin_port;
var replace_host="www.hongbaorili.com";
var replace_port="80";
var replace_domain=replace_host+":"+replace_port;
if(oSession.host==origin_domain){
oSession.host=replace_domain;
}
if ( (oSession.PathAndQuery == (origin_host+":"+origin_port))) {
oSession.PathAndQuery = replace_host+":"+replace_port;
}
結尾：
其實在Customize Rules.js這個文件中還可以處理很多場景下的東西，有興趣的話可以自己再多研究，另外這一篇文章，也介紹的蠻多詳情點，點擊這里
這段時間都一直浸淫在小程序當中，有願意討論的童鞋歡迎，目前小程序已穩定上線2個多月，社區類的小程序。
轉載請注明原文地址 https://www.cnblogs.com/star-wind/p/10341573.html:謝謝
我的github,歡迎拍磚