从 WKWebview 的 cordova-ios 中的数据目录加载 html 文件答案

【问题标题】：Load html file from data directory in cordova-ios from WKWebview从 WKWebview 的 cordova-ios 中的数据目录加载 html 文件
【发布时间】：2021-01-29 13:05:05
【问题描述】：

我正在开发 cordova-ios 应用程序。我的应用程序将从服务器下载 zip 文件（包含 html 文件 ex:-second_login.html），然后我们将其解压缩到数据目录中。成功解压缩后，应用程序应导航到 second_login.html。应用程序在带有 cordova-ios 5.1.1 的 UIWebview 中运行良好。但它不适用于带有 WKWebview 的 cordova-ios-6.1.0。

使用cordova-ios-6.1.0，我在数据目录中成功下载并解压到以下路径。

/var/mobile/Containers/Data/Application/<APPID>/Library/NoCloud/<APP_NAME>//files/www-24862240/second_login.html.

为了加载这个 second_login.html，我使用的是document.location = "<PATH_MENTIONED_ABOVE>"

最初，我们在下载 zip 文件时遇到问题（Cookie 同步问题），为此我们使用了 cordova-plugin-ios-xhr 插件。然后我们成功下载了 zip 文件。

【问题讨论】：

您可能需要将其移至 www 并执行 document.location = "app://localhost/second_login.html" 或您选择的任何 url 方案。
@NikosJs：但是我的捆绑包（下载的内容）包含大量文件。我们的项目不建议移动下载的内容。有什么建议。感谢您的回复。

标签： ios cordova wkwebview cordova-ios

【解决方案1】：

经过 2 个月的努力，我们找到了解决问题的方法。本机 Webkit webview 在 swift 中运行良好。所以我们发现cordova-ios 做了一些限制。所以我们在cordovaLib xcode项目中添加了一些方法。

找出cordovalib xcode 项目中的WebviewEngine 文件夹。 (cordovaLib.xcodeproj -> 私有 -> 插件 -> CDVWebviewEngine)
在CDVWebViewEngine.h文件allowsBackForwardNavigationGestures函数后添加新函数

- (void)loadFileURL:(CDVInvokedUrlCommand*)command;

3)在CDVWebViewEngine.m文件defaultResourcePolicyForURL函数后添加以下函数

-(void)loadFileURL:(CDVInvokedUrlCommand*)command;
{

NSString* fileurlStr = [command argumentAtIndex:0];
NSString* folderurlStr = [command argumentAtIndex:1];
NSURL *nsURLfile = [NSURL fileURLWithPath:fileurlStr];
NSURL *nsURLfileroot = [NSURL fileURLWithPath:folderurlStr];

NSFileManager* fileManager = [NSFileManager defaultManager];
NSArray* contentOfDirectory = [fileManager contentsOfDirectoryAtPath:folderurlStr error:nil];
int contentCount = [contentOfDirectory count];

int i;
for(i=0;i<contentCount;i++){
NSString* fileName = [contentOfDirectory objectAtIndex:i];
NSString* path = [folderurlStr stringByAppendingFormat:@"%@%@",@"/",fileName];
NSLog(path);
}

if ([fileManager fileExistsAtPath:[nsURLfile path]]){
[(WKWebView*)_engineWebView loadFileURL:nsURLfile allowingReadAccessToURL:nsURLfileroot];
}else{
NSLog(@"file does not exist");
}
}

然后在我们的应用程序 javascript 文件中，使用以下代码导航到下载的捆绑文件。这里的路径是使用自定义文件夹名称（在我们的例子中）下载并提取到数据目录位置的 zip。

if(isIOS()){

          var path = cordova.file.dataDirectory + APP_NAME_FOLDER + "/" + localStorage.zipExtractLocation +"/";

            var wkPath = path.replace("file://", "");

         cordova.exec( null, null, 'CDVWebViewEngine', 'loadFileURL', [wkPath+"index.html", wkPath] );

         }

在 config.xml 中添加以下首选项

<preference name="deployment-target" value="12" />
<preference name="allowFileAccessFromFileURLs" value="true" />

【讨论】：

【解决方案2】：

我遵循了这些步骤。重定向成功。

但我收到“XMLHttpRequest”错误。然后我安装了“https://github.com/globules-io/cordova-plugin-ios-xhr”插件。

我在 config.xml 中添加了以下设置；

<preference name="NativeXHRLogging" value="full" />
<preference name="AllowUntrustedCerts" value="true" />
<preference name="InterceptRemoteRequests" value="all" />
<preference name="allowFileAccessFromFileURLs" value="true" />
<preference name="allowUniversalAccessFromFileURLs" value="true" />

一切都恢复正常了。

uyummobile/cordova-ios

【讨论】：