我正在做一个项目，在这个项目中，我大量使用InAppBrowser来查看不同的文档（PDF，DOC，DOCX）。我在OCH X1 M1 N1 X的帮助下完成了这一点，文档存储在X1 M2 N1 X中。大多数时候它在我的Android设备上运行得很好！但有时我得到的只是一个空的白色屏幕，并且我必须按Back按钮来关闭InAppBrowser，然后重新打开它来显示文档。
在Chrome开发者工具中远程调试这个奇怪的行为时，我看到loadstart和loadstop事件被正确调用：
当我在空的/白色的InAppBrowser中查看HTML时，我看到空的<body>-标签：
打开InAppBrowser的代码：
import { Injectable } from '@angular/core';
import { Platform } from 'ionic-angular';
import { InAppBrowser, InAppBrowserObject } from '@ionic-native/in-app-browser';
import { ScreenOrientation } from '@ionic-native/screen-orientation';
import { LoaderService } from './loader-service';
import * as firebase from 'firebase';
@Injectable()
export class FirebaseStorageService{
browserOptions: string;
browser: InAppBrowserObject;
constructor(
private iab: InAppBrowser,
private loaderService:LoaderService,
private platform: Platform,
private screenOrientation: ScreenOrientation
){
this.browserOptions = 'zoom=no,location=no,useWideViewPort=no,hidden=yes,enableViewportScale=yes';
}
viewPdf(path: string, loadText?:string):Promise<any>{
this.showLoader(loadText);
return new Promise<any>((resolve, reject) => {
firebase.storage().ref().child(path).getDownloadURL().then(url => {
let newURL = 'https://docs.google.com/gview?&url=' + encodeURIComponent(url);
this.startBrowser(newURL);
resolve();
})
.catch(err => {
if(this.platform.is('cordova')){
this.loaderService.dismissLoader();
}
reject(err);
});
})
}
private startBrowser(path:string):void{
this.browser = this.iab.create(path, '_blank', this.browserOptions);
if(this.platform.is('cordova')){
this.handleBrowserSubscriptions();
this.screenOrientation.unlock();
}
}
private handleBrowserSubscriptions():void{
let stopSub = this.browser.on('loadstop').subscribe(event => {
console.log('loadstop', event)
this.loaderService.dismissLoader();
this.browser.show();
stopSub.unsubscribe();
errorSub.unsubscribe();
});
let exitSub = this.browser.on('exit').subscribe(event => {
console.log('exit:',event)
this.loaderService.dismissLoader();
exitSub.unsubscribe();
this.browser.close();
this.screenOrientation.lock(this.screenOrientation.ORIENTATIONS.PORTRAIT);
});
let errorSub = this.browser.on('loaderror').subscribe(event => {
console.log('loaderror', event)
this.loaderService.dismissLoader();
this.browser.close();
this.screenOrientation.lock(this.screenOrientation.ORIENTATIONS.PORTRAIT);
stopSub.unsubscribe();
errorSub.unsubscribe();
});
let startSub = this.browser.on('loadstart').subscribe(event => {
console.log('loadstart', event);
})
}
}离子信息：Cordova CLI: 7.0.1 Ionic Framework Version: 3.2.0 Ionic CLI Version: 2.2.1 Ionic App Lib Version: 2.2.0 Ionic App Scripts Version: 1.3.7 ios-deploy version: Not installed ios-sim version: Not installed OS: Windows 10 Node Version: v6.9.4 Xcode version: Not installed
有没有其他人经历过这种情况，或者有没有人知道如何解决这种情况？
2条答案
按热度按时间eit6fx6z1#
您正在使用其中一种方式在Android的Web视图中打开文档
**解决方案-1：**您可以按如下方式修改当前Web视图：
编码包括
https://docs.google.com完整URL这里是加载URL的另一种方式：
http://docs.google.com/viewer?url=http://example.com/example.pdf
如果这些解决方案中的任何一个都不起作用，则尝试下载文件并在浏览器中打开它。
t2a7ltrp2#
第一步=〉安装流媒体插件=〉https://ionicframework.com/docs/native/streaming-media
第二步：让网址="+您的网址;
这是我的作品。