在iframe中显示位于www文件夹外的html文件——在InAppBrowser中工作或解析文本



我使用自己构建的自定义插件成功地将一些随需应变资源下载到了我的Cordova应用程序中。

我现在需要做的是将它们加载到我的应用程序中的iframe中。这可能吗??

如果它们位于(叹息,只读(www文件夹中,我可以简单地指向${cordova.file.applicationDirectory}/www/game.html
。。。但是,如果将它们放在Library文件夹中(例如,请参阅下面的路径(,有没有办法在iframe中显示它们
('/var/mobile/Library/OnDemandResources/AssetPackages/2F2887A0-7B16-4S5D-83C2-1C588A69DA80/155333011734738522725/com.us company.sports beta enterprise.asset-pack-5a105e8b9d10e3329780d62ea2265d8a.assetpack/game.html'(


到目前为止,我设法显示它们的唯一方法是:

1InAppBrowser使用cdvfile://localhost路径(见下文(-->,但我希望避免这种情况
(cdvfile://localhost/root/Users/user/Library/Developer/CoreSimulator/Devices/D016D3BC-E9F9-43F2-8EC1-9A471819A9B5/data/Library/OnDemandResources/AssetPacks/11129225-E96A-4BEC-9051-735912378DB0/15538308173473832725/com.us-company-us.sports-beta-enterprise.asset-pack-5a105e8b9d40e1329780d62ea2265d8a.assetpack/flying-block-game.html)

2.自己使用document.createRange+createContextualFragment-->解析html文本对于非琐碎的游戏来说变得很复杂。

任何在应用程序本身的iframe中显示此信息的帮助,以便所有请求都通过Ionic引擎,并拥有我自己的iosapp://自定义方案,而不是cdvfile://localhost(这可能会导致CORS阻滞剂(?

或者,对于为ODR下载的文件提供服务的本地Web服务器,它是否可以使用不同的插件?

 nbsp nbsp nbsp nbsp nbsp nbsp nbsp nbsp nbsp nbsp nbsp nbsp nbsp nbsp nbsp nbsp nbsp nbsp nbsp nbsp nbsp nbsp nbsp nbspGithub问题

我使用cordova插件ionic webview的window.Ionic.WebView.convertFileSrc:轻松解决了我的问题

游戏以这种方式正确加载到我的Cordova应用程序中的iframe中:

var iframe = document.createElement('iframe');
iframe.src = window.Ionic.WebView.convertFileSrc('file:////Users/gsacchi/Library/Developer/CoreSimulator/Devices/D016D2BC-E9F9-43F2-8EC1-9A471819A9B5/data/Library/OnDemandResources/AssetPacks/11159225-E96A-4BEC-9051-735912378DB0/15538308173473832725/com.company-us.sports-beta-enterprise.asset-pack-5a105e8b9d40e2329780d62ea2265d8a.assetpack/flying-block-game.html');
var target = document.body.appendChild(iframe);

关于CORS问题,第三方通常不会将file:///或localhost列入白名单,但好消息是:从iframe发出的请求与应用程序具有相同的自定义主机名和方案,因此不存在CORS问题!

如果你已经有html内容,你可以用这种方式设置iframe内容,而不是src=";,并且您应该能够避免WkWebView:中的CORS问题

var htmlToWrite = "<html><head></head>" +
"<body>" +
"iframe body" +
"<script>window.parent.alert('iframe even same-origin as parent.');</script>" +
"</body></html>";
var frameEl = document.createElement('iframe');
frameEl.src = "about:blank";
document.body.appendChild(frameEl);
frameEl.contentWindow.document.open('text/htmlreplace');
frameEl.contentWindow.document.write(htmlToWrite);
frameEl.contentWindow.document.close();

更多上下文:https://stackoverflow.com/a/65132249/5669636

我想知道是谁强制执行www约束,也许我可以分叉并更改它。。在这种情况下,我将能够在嵌入到ionic webview服务的应用程序中的iframe中加载单个游戏,并更容易地解决CORS问题,因为我可以依赖我的自定义方案和应用程序域集作为config.xml中的首选项。

这是插件代码:

-(NSString *) getStartPath {
NSString * wwwPath = [[NSBundle mainBundle] pathForResource:@"www" ofType: nil];
NSUserDefaults* userDefaults = [NSUserDefaults standardUserDefaults];
NSString * persistedPath = [userDefaults objectForKey:CDV_SERVER_PATH];
if (![self isDeployDisabled] && ![self isNewBinary] && persistedPath && ![persistedPath isEqualToString:@""]) {
NSString *libPath = [NSSearchPathForDirectoriesInDomains(NSLibraryDirectory, NSUserDomainMask, YES) objectAtIndex:0];
NSString * cordovaDataDirectory = [libPath stringByAppendingPathComponent:@"NoCloud"];
NSString * snapshots = [cordovaDataDirectory stringByAppendingPathComponent:@"ionic_built_snapshots"];
wwwPath = [snapshots stringByAppendingPathComponent:[persistedPath lastPathComponent]];
}
self.basePath = wwwPath;
return wwwPath;
}

所以我认为这样的东西应该指向下载的游戏ODR文件夹:

NSString *odrPath= [[NSBundle mainBundle] pathForResource:@"games" ofType: nil];

但不确定同时运行两个实例是否可行

Cordova松弛通道中的更多讨论点:https://cordova.slack.com/archives/C068CHRJ5/p1586747888233400

最新更新