先簡單介紹下我在工作中關(guān)于WKWebView的使用場景:
1、首先是從后臺(tái)獲取到HTML富文本字符串內(nèi)容,然后使用WKWebView加載出來
2、將CSS樣式文件下載到沙盒,以及將CSS樣式文件預(yù)存到應(yīng)用程序資源路徑下,使用WKWebView加載樣式文件。CSS文件下載成功的情況下使用下載的CSS文件,要是下載失敗就使用程序資源路徑下的CSS文件
加載資源路徑下的CSS文件
//imageJS為HTML富文本字符串內(nèi)容
var imageJS = """
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<!--meta-->
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1.0, user-scalable=no"/>
<meta http-equiv="Content-Style-Type" content="text/css" />
<link rel="stylesheet" type="text/css" href="\(cssFileName).css">
</head style='width:100% !important'>
<body>
<div class="ql-container ql-snow">
<div class="ql-editor">
\(self.HTMLContentStr)
</div>
</div>
</body>
</html>
"""
//self.HTMLContentStr為HTMLbody的內(nèi)容
//cssFileName為CSS樣式文件的名字
cssFileUrl = Bundle.main.bundlePath
//采用loadHTMLString方式加載
self.contentWeb.loadHTMLString(imageJS, baseURL: URL(fileURLWithPath: cssFileUrl))
此處溫馨提示下,項(xiàng)目中使用多個(gè)TARGETS的話,記得把CSS文件的Target Membership 勾上:
截屏2019-10-11下午2.52.44.png
加載沙盒路徑下的CSS文件
嘗試一:
self.contentWeb.loadHTMLString(imageJS, baseURL: URL(fileURLWithPath: cssFileUrl))
//imageJS與上面一樣
//cssFileUrl改為沙盒中CSS文件的路徑
樣式文件沒有生效,嘗試失敗。
嘗試二:
self.contentWeb.loadHTMLString(imageJS, baseURL: URL(fileURLWithPath: cssFileUrl, isDirectory: false))
//imageJS與上面一樣
//cssFileUrl為沙盒中CSS文件的路徑
這個(gè)時(shí)候用模擬器跑出來是可以正確加載CSS文件的,可是換成真機(jī)卻沒效果了????????
這里我嘗試了很多辦法,可在真機(jī)情況下依舊無法加載CSS文件,如果有解決辦法,歡迎在評論區(qū)討論??
嘗試三:
換一種加載方式,使用:
open func loadFileURL(_ URL: URL, allowingReadAccessTo readAccessURL: URL) -> WKNavigation?
do {
//將HTML富文本內(nèi)容寫入沙盒CSS同一文件夾下,采用loadFileURL方式加載
//cssFileUrl為沙盒中CSS文件所在文件夾的路徑
let _ = try imageJS.write(to: URL(fileURLWithPath: cssFileUrl + "/content.html"), atomically: true, encoding: .utf8)
let contentURL = URL(fileURLWithPath: cssFileUrl + "/content.html")
let AccessURL = URL(fileURLWithPath: cssFileUrl)
self.contentWeb.loadFileURL(contentURL, allowingReadAccessTo: AccessURL)
}catch{
}
模擬器運(yùn)行正常,真機(jī)運(yùn)行正常????????
注意 注意 注意 cssFileUrl為沙盒中CSS文件所在文件夾的路徑,即下圖中cssFile文件的路徑。

截屏2019-10-11下午3.37.53.png
總結(jié)下
WKWebView使用:
open func loadHTMLString(_ string: String, baseURL: URL?) -> WKNavigation?
在真機(jī)下可以正確加載資源路徑下的CSS文件,而在沙盒路徑下的CSS文件不能正確加載(如果該方法有加載沙盒路徑CSS文件的方法,歡迎大家在評論區(qū)告訴我??????)
WKWebView使用:
open func loadFileURL(_ URL: URL, allowingReadAccessTo readAccessURL: URL) -> WKNavigation?
在真機(jī)下可以正確加載沙盒路徑下的CSS文件。資源路徑為只讀,不可寫入就不討論了。