新上手一個混合開發(fā)APP的項目及刻，需要IOS和android通過webview調(diào)用本地html文件镀裤，要求能顯示H5頁面并產(chǎn)生交互。
因為之前沒接觸過混合開發(fā)缴饭，項目在一開始就遇到了問題暑劝，ios和android在調(diào)用本地html文件時，可以引入資源颗搂，但js不能讀寫加載的內(nèi)容担猛。如路由導(dǎo)航功能渲染的頁面無法顯示，以及數(shù)據(jù)無法加載丢氢。
后面嘗試把html文件放到服務(wù)器上傅联，webview通過請求遠程地址加載html文件，發(fā)現(xiàn)顯示正常疚察，內(nèi)容和數(shù)據(jù)都能正常渲染蒸走。于是猜測是域名URL的問題，在百度上搜索“file:///加載html文件”時貌嫡，發(fā)現(xiàn)一個關(guān)鍵詞——“同源策略”比驻。
1.1该溯、先來說說什么是源
源（origin）就是協(xié)議、域名和端口號别惦，若地址里面的協(xié)議狈茉、域名和端口號均相同則屬于同源。
以下是相對于http://www.a.com/test/index.html?的同源檢測
? http://www.a.com/dir/page.html?----成功
? http://www.child.a.com/test/index.html?----失敗掸掸，域名不同
? https://www.a.com/test/index.html?----失敗氯庆，協(xié)議不同
? http://www.a.com:8080/test/index.html?----失敗，端口號不同
1.2.什么是同源策略猾漫？同源策略是瀏覽器的一個安全功能点晴，不同源的客戶端腳本在沒有明確授權(quán)的情況下，不能讀寫對方資源悯周。所以http://a.com下的js腳本采用ajax讀取http://b.com里面的文件數(shù)據(jù)是會報錯的粒督。
? 不受同源策略限制的：1、頁面中的鏈接禽翼，重定向以及表單提交是不會受到同源策略限制的屠橄。2、跨域資源的引入是可以的闰挡。但是js不能讀寫加載的內(nèi)容锐墙。如嵌入到頁面中的<script src="..."></script>，<img>长酗，<link>溪北，<iframe>等。
在明白什么是同源策略后夺脾，問題差不多已經(jīng)找到原因了之拨，繼續(xù)在網(wǎng)上查找了一番，看到一篇文章——WebView的優(yōu)化--處理WebView的容易忽略的漏洞咧叭，在這篇文章里面找到了安卓端的解決方法：
setAllowFileAccess（）
// 設(shè)置是否允許 WebView 使用 File 協(xié)議
webView.getSettings().setAllowFileAccess(true);
// 默認(rèn)設(shè)置為true蚀乔，即允許在 File 域下執(zhí)行任意 JavaScript 代碼
1：禁用 file 協(xié)議；
webView.getSettings().setAllowFileAccess(false);
這樣雖然最方便菲茬，但同時也限制了WebView 的功能吉挣，使其不能加載本地的 html 文件。
2：對于需要使用 file 協(xié)議的應(yīng)用婉弹，禁止 file 協(xié)議加載 JavaScript睬魂。；
setAllowFileAccess(true);
// 禁止 file 協(xié)議加載 JavaScript
if (url.startsWith("file://") {
????setJavaScriptEnabled(false);
} else {
????setJavaScriptEnabled(true);
}
setAllowFileAccessFromFileURLs（）
// 設(shè)置是否允許通過 file url 加載的 Js代碼讀取其他的本地文件
webView.getSettings().setAllowFileAccessFromFileURLs(true);
// 在Android 4.1前默認(rèn)允許
// 在Android 4.1后默認(rèn)禁止
這樣不安全镀赌，解決辦法直接關(guān)掉setAllowFileAccessFromFileURLs(false);
setAllowUniversalAccessFromFileURLs（）
// 設(shè)置是否允許通過 file url 加載的 Javascript 可以訪問其他的源(包括http汉买、https等源)
webView.getSettings().setAllowUniversalAccessFromFileURLs(true);
// 在Android 4.1前默認(rèn)允許（setAllowFileAccessFromFileURLs（）不起作用）
// 在Android 4.1后默認(rèn)禁止
這個一般還好，如果想保證資源的安全的話佩脊，建議關(guān)掉
setAllowUniversalAccessFromFileURLs(false);
setJavaScriptEnabled（）
// 設(shè)置是否允許 WebView 使用 JavaScript（默認(rèn)是不允許）
webView.getSettings().setJavaScriptEnabled(true);
// 但很多應(yīng)用（包括移動瀏覽器）為了讓 WebView 執(zhí)行 http 協(xié)議中的 JavaScript蛙粘，都會主動設(shè)置為true垫卤，不區(qū)別對待是非常危險的。
android應(yīng)用重新設(shè)置后出牧，頁面正常顯示穴肘，內(nèi)容和數(shù)據(jù)都可以渲染，問題解決一半舔痕，剩下的就是找到ios類似的方法评抚。感謝博主Vincent__Lee，附上文章鏈接：WebView的優(yōu)化--處理WebView的容易忽略的漏洞 - li15225271052的博客 - CSDN博客
