解決 Chrome 瀏覽器跨域加載本地文件的問題

解決 Chrome 瀏覽器跨域加載本地文件的問題

Chrome Three.js

---

使用 Three.js 加載本地紋理圖片時，發現加載出來的 3D 模型會所有爲黑色，發現是瀏覽器跨域問題。

瀏覽器報錯爲：

index.html:1 Access to Image at 'file:///Users/inxx/Code/Github/Note/WebGL/3D%E7%94%B5%E6%B0%94%E5%AE%A4/img/floor.jpg' from origin 'null' has been blocked by CORS policy: Invalid response. Origin 'null' is therefore not allowed access.

1. Windows：

1. 在Chrome的快捷圖標上點擊鼠標右鍵
2. 選擇屬性
3. 選擇快捷方式標籤
4. 在目標裏面，在原 Chrome 路徑的基礎上加上 --disable-web-security
5. 點擊應用
6. 點擊肯定關閉屬性窗口
7. 關閉全部已打開的 Chrome，從新啓動
8. 看到地址欄下面的小黃條你使用的是不受支持的命令標記 --disable-web-security，就成功了

注意： --前面有個空格
若是是 49 以上的版本：
步驟和上面的同樣，只是第4步的參數稍微不同。

--disable-web-security --user-data-dir=C:\MyChromeDevUserData

注：C:MyChromeDevUserData 是你本地硬盤的一個目錄，你本身最好新建一個，上面的目錄路徑換成你新建的目錄就能夠了。

2. Mac：

在終端中輸入

open -a /Applications/Google\ Chrome.app --args --disable-web-security --user-data-dir