解決跨域問題的方式有很多,例如:Nginx代理、通過http頭來解決等,我找到了一個在前端分離開發(fā)階段比較簡單的方式,配置瀏覽器解決跨域問題。記錄如下:
現(xiàn)在的瀏覽器出于安全策略的限制,都是不允許跨域的,但是開發(fā)的時候經(jīng)常需要一些別的域的接口,特別是一些接口不是自己能控制的時候,往往會造成開發(fā)困難。
今天無意中知道了,瀏覽器可以通過設(shè)置,解決跨域問題。
如果 版本在49之前,設(shè)置方法如下:
1、在的快捷圖標(biāo)上點擊鼠標(biāo)右鍵(如果沒快捷方式,可以找到文件路勁,發(fā)送快捷方式到桌面)
2、選擇“屬性”
【除了右鍵選擇屬性的方式查看之外,還可以按住alt雙擊圖標(biāo),直接打開屬性面板】
3、選擇快捷方式標(biāo)簽
4、在“目標(biāo)”里面,在原路徑的基礎(chǔ)上加上 ---web- 【注意--之前有空格】
5、點擊“應(yīng)用”
6、點擊“確定”關(guān)閉屬性窗口
7、關(guān)閉所有已打開的,重新啟動(必須點擊該快捷方式打開)
8、看到地址欄下面的小黃條你使用的是不受支持的命令標(biāo)記 –-web-,就成功了
如果是49以上的版本:
步驟和上面的一樣,只是第4步的參數(shù)稍微不一樣。
--disable-web-security --user-data-dir=C:\chromedata

【注意--之前有空格】
C:\ 是你本地硬盤的一個目錄,你自己最好新建一個,上面的目錄路徑換成你新建的目錄就可以了。
屬性配置截圖如下:
配置后,運行彈出的警告截圖如下(因為我的是49以上的版本谷歌瀏覽器本地跨域,所以警告內(nèi)容是---web-):
【備注:這樣的方式比較適合前期在前端和后端開發(fā)不在同一個web服務(wù)器的情況,通過瀏覽器配置的方式讓前端也可以訪問到后端接口谷歌瀏覽器本地跨域,在正式上線時,如果放在同一個web容器中,自然就不會出現(xiàn)類似的問題了。這種方式僅適合在開發(fā)的時候使用,不適合做正式的跨域解決方案】
作為測試,我寫了段代碼(本地使用ajax去訪問百度,并將百度的網(wǎng)頁源代碼獲取出來顯示在一個div上),如下:
<html>
<head>
<meta charset="utf-8" />
<title>Ajax跨域demotitle>
<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous">script>

head>
<body>
<div id="myDiv">
div>
body>
<script>
$(function(){

$.get("http://www.baidu.com",function(data){
$("#myDiv").text(data);
});
});
script>
html>
執(zhí)行結(jié)果如下,可見配置成功了:
參考博客: