WKWebView 顯示H5網(wǎng)頁時 加載本地資源文件 方案

WKWebView加強了安全性,不再允許跨域訪問,所有跨域地址都失效了,包括不在同一文件夾下的CSS、JS等文件引用。

問題:

加載本地沙盒內(nèi)資源文件時候,例如file://localhost/var/...../Library/a.png,雖然能找到資源文件真實存在,但是在H5中會加載失敗,所以我們就不能用之前的方式進行加載

解決辦法:

1、把src中的圖片單獨讀取出來,然后轉(zhuǎn)成data拼到src中(這種方案加載速度太慢,不推薦)。
2、啟動一個本地服務(wù)器,擁有一個讀取沙盒的權(quán)利(推薦使用)

導(dǎo)入一個三方 GCDWebServer

1、你可以使用CocoaPods,在Podfile中添加下面代碼之后,執(zhí)行 pod install安裝 GCDWebServer

pod "GCDWebServer", "~> 3.0"

如果你想使用 GCDWebUploader ,添加下方代碼

pod "GCDWebServer/WebUploader", "~> 3.0"
pod "GCDWebServer/WebDAV", "~> 3.0"    # 如果要使用 GCDWebDAVServer 就打開注釋

2、如果要直接把文件放到程序中,可以下載 GCDWebServer源碼后把下面文件夾中內(nèi)容引入到程序中。

GCDWebServer目錄


開始啟動本地服務(wù)

Tips: 在沙河目錄中指定文件夾開啟服務(wù)后,可以使用http://localhost/ 方式訪問本地資源
使用文件路徑方式 file://localhost/var/...../Library 加載資源文件會失敗

自行import然后開啟服務(wù),可以寫到單獨頁面的ViewDidLoad中,也可以全局寫到AppDelegate

建議:如果程序中H5頁面較多,建議寫到全局中訪問,不用每次打開H5頁面都要重新開啟和關(guān)閉服務(wù)
1、引入 GCDWebServer

#import "GCDWebServer.h"
#import "GCDWebServerDataResponse.h"

2、創(chuàng)建 server對象

@interface AppDelegate : UIResponder <UIApplicationDelegate, GCDWebServerDelegate> {
    //聲明全局對象    
    GCDWebServer* _webServer;
}
@end

-(void)initWebServer{
    // Create server
    _webServer = [[GCDWebServer alloc] init];
    _webServer.delegate = self;

    //確定要開啟服務(wù)的沙盒文件夾目錄,如果沒有就創(chuàng)建文件夾
    NSString* path = [NSHomeDirectory() stringByAppendingPathComponent:@"Library/Resources"];
    if ([[NSFileManager defaultManager] fileExistsAtPath:path] == NO){
        [[NSFileManager defaultManager] createDirectoryAtPath:path withIntermediateDirectories:YES attributes:nil error:nil];
    }

    // Add a handler to respond to GET requests on any URL
    [_webServer addGETHandlerForBasePath:@"/" directoryPath:path indexFilename:nil cacheAge:3600 allowRangeRequests:YES];
    // Start server on port 8080
    [_webServer startWithPort:8080 bonjourName:nil];

}

//代理回調(diào),確認本地服務(wù)成功開啟
- (void)webServerDidStart:(GCDWebServer*)server{
    NSLog(@"-------webServerDidStart--------------");
}

進行地址替換

在處理網(wǎng)絡(luò)資源src 本地路徑的位置,進行地址替換。
最終目的是要把 file://localhost/var/...../LibraryLibrary前面的換成 http://localhost/ 再拼上后續(xù)地址

    NSString* filepath = "file://localhost/var/...../Library/Resources/a.png";
    NSString* path = [filepath componentsSeparatedByString:@"/Library/"].lastObject;
    NSString* localPath = "http://localhost/" + path;


關(guān)閉服務(wù)

最后,如果是單頁面開啟服務(wù)的話,需要在頁面關(guān)閉時候關(guān)閉掉本地服務(wù)。代碼如下:

- (void)dealloc {
    //停止本地服務(wù)
    if ([self.webSever != nil]) {
        [self.webSever stop];
        self.webSever = nil;
    }
}

Tips: 完美收官,你可以飛了!!!

最后編輯于
?著作權(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)容