swift WKWebView 加載本地H5以及css/js/img不顯示

Create folder references & create group 區(qū)別

在本地加載html帶css,js文件需要加載時

1.使用create group 方式引入文件,文件夾為黃色, 加載html代碼如下:

html文件里面使用js,css文件,相對路勁,需要修改去掉引用./, ../../ 之類的,否則css文件無法生效, 如果多處使用了js,css,img等就需要多次修改容易出錯

let filepath = Bundle.main.path(forResource: "WhiteBoardHT", ofType: "html")
self.webView?.load(URLRequest(url: URL.init(fileURLWithPath: filepath!)))

html文件
<script defer="defer" src="chunk-vendors.672038ac.js"></script>
<script defer="defer" src="app.60451670.js"></script>
<link href="chunk-vendors.ea9a733d.css" rel="stylesheet">
<link href="app.d2b833f3.css" rel="stylesheet">

2.Create folder references 方式引入文件, 文件夾為藍(lán)色, 這種方式加載的文件不會去修改html,css,js, img路勁

image.png

看看 copy bundle resource 里面是否添加了藍(lán)色


image.png

這種方式不需要修改html,js,css文件里面的路徑

如果直接使用let filepath = Bundle.main.path(forResource: "WhiteBoardHT", ofType: "html"),filepath始終為nil, 需要添加inDirectory: "assets"
正確使用代碼如下
let filepath = Bundle.main.path(forResource: "WhiteBoardHT", ofType: "html", inDirectory: "assets")
let pathurl = URL.init(fileURLWithPath: filepath!)
webView?.loadFileURL(pathurl, allowingReadAccessTo: pathurl)

<script defer="defer" src="./static/js/chunk-vendors.672038ac.js"></script>
<script defer="defer" src="./static/js/app.60451670.js"></script>
<link href="./static/css/chunk-vendors.ea9a733d.css" rel="stylesheet">
<link href="./static/css/app.d2b833f3.css" rel="stylesheet">

問題1.如果直接使用[NSBundle mainBundle]查找路徑,會發(fā)現(xiàn)路勁查找不到為空,
問題2.[_wkWebView loadRequest:request] ,這種方式加載不出來,并且這個方法不允許加載本地的html。正確的方式是用這個loadFileURL:allowingReadAccessToURL:的方法,就可以加載出html了,而且有css和js以及img的。

參考: https://blog.51cto.com/u_4955660/2842848

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容