wkwebview離線化載入h5資源解決方案

2021-09-11 09:42:50 字數 4085 閱讀 1757

思路: 使用nsurlprotocol攔截請求**到本地。

於是考慮使用離線化載入。

確保[低速網路]或[無網路]可網頁秒開。

複製**

區別於uiwebview wkwebview使用如下方法攔截

@inte***ce viewcontroller ()

@end

@implementation viewcontroller

- (void)viewdidload

}複製**

# 註冊nsurlprotocol攔截

- (ibaction)regist:(id)sender

複製**

# 登出nsurlprotocol攔截

- (ibaction)unregist:(id)sender

複製**

需要先 #import "ssziparchive.h

- (void)downloadzip 

else

}else

}else

}];[downloadtask resume];

}複製**

[wkwebview]真機不支援直接載入[nscache]資源

需要先遷移資源至[nstemporary]

- (void)migratedisttotempory 

複製**

如果[/static]開頭 => 則**[request]到本地[.css/.js]資源

如果[index.html]結尾 => 就直接[load]本地[index.html] (否則[index.html]可能會載入失敗)

//

// protocolcustom.m

// proxy-browser

//// created by melo的微博 on 2018/4/8.

//#import #import #import static nsstring*const matchingprefix = @"";

static nsstring*const regprefix = @"";

static nsstring*const filteredkey = @"filteredkey";

@inte***ce filteredprotocol : nsurlprotocol

@property (nonatomic, strong) nsmutabledata *responsedata;

@property (nonatomic, strong) nsurlconnection *connection;

@end

複製**

@implementation filteredprotocol

+ (bool)caninitwithrequest:(nsurlrequest *)request

複製**

+ (nsurlrequest *)canonicalrequestforrequest:(nsurlrequest *)request

return mutablereqeust;

}複製**

+ (bool)requestiscacheequivalent:(nsurlrequest *)a torequest:(nsurlrequest *)b

複製**

# 如果[index.html]結尾 => 就直接[load]本地[index.html]

- (void)startloading else

//4.響應

[[self client] urlprotocol:self didreceiveresponse:response cachestoragepolicy:nsurlcachestoragenotallowed];

[[self client] urlprotocol:self didloaddata:data];

[[self client] urlprotocoldidfinishloading:self];

}else

}複製**

- (void)stoploading

}複製**

- (nsstring *)getmimetypewithcapiatfilepath:(nsstring *)path

cfstringref uti = uttypecreatepreferredidentifierfortag(kuttagclassfilenameextension, (__bridge cfstringref)[path pathextension], null);

cfstringref mimetype = uttypecopypreferredtagwithclass (uti, kuttagclassmimetype);

cfrelease(uti);

if (!mimetype)

return (__bridge nsstring *)(mimetype);

}複製**

#pragma mark - 拼接響應response

}複製**

#pragma mark- nsurlconnectiondelegate

- (void)connection:(nsurlconnection *)connection didfailwitherror:(nserror *)error

複製**

#pragma mark - nsurlconnectiondatadelegate

- (void)connection:(nsurlconnection *)connection didreceiveresponse:(nsurlresponse *)response

複製**

- (void)connection:(nsurlconnection *)connection didreceivedata:(nsdata *)data 

複製**

- (void)connectiondidfinishloading:(nsurlconnection *)connection 

複製**

+ (nsstring *)generateproxypath:(nsstring *) absoluteurl 

複製**

+ (nsstring *)generatedatereadpath:(nsstring *) absoluteurl 

@end

複製**

完整[demo]請參考: github.com/meloalright…

(∩_∩)求給個☆哦

2.github: yeatse/nsurlprotoc…

WKWebView載入本地檔案

wkwebview無法載入本地路徑的資源檔案,因為資源路徑需要手動設定,下面 中將canvas資料夾設為baseurl,這樣就可以將本地載入的檔案放到該資料夾下,為了適配src x wkwebview webview wkwebview alloc initwithframe cgrectmake ...

h5離線應用

在chorme瀏覽器下,可以訪問 http cache 位址 chrome cache 檢視兩者。需要注意的是,清單上的檔案路徑不能有錯,只要乙個有錯,所以檔案都不會離線儲存。第二步是,在需要離線的網頁的標籤上增加manifest屬性,指向上面的清單檔案。在chorme瀏覽器下,可以按f12開啟除錯...

H5離線快取

什麼是離線快取 離線快取可以將站點的一些檔案快取到本地,它是瀏覽器自己的一種機制,將需要的檔案快取下來,以便後期即使沒鏈結網路,被快取的頁面也可以展示 離線快取的優勢 提高使用者的訪問速度,節省流量 如何實現離線快取 內容為 cache manifest 1.0 版本號 這個注釋是給 開發者看的,代...