存储网页以供离线查看离子3



我想知道是否可以像用离子2/3中的图像一样将网页放置在LocalStorage中,或在本地保存以进行离线查看。这是我使用Google文档访问远程书籍的代码:

book.ts

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import {SafeResourceUrl, DomSanitizer} from '@angular/platform-browser';
import { Storage } from '@ionic/storage';
@IonicPage()
@Component({
  selector: 'page-view-book',
  templateUrl: 'view-book.html',
})
export class ViewBookPage {
    book: any;
    pdfUrl: SafeResourceUrl;
  constructor(private domSanitizer: DomSanitizer, 
              public navCtrl: NavController, 
              public navParams: NavParams) {
    this.book = navParams.data.book;
    // get url of pdf and embed in iframe from google docs
    this.pdfUrl = this.domSanitizer.bypassSecurityTrustResourceUrl(
        'http://docs.google.com/gview?url='+this.book+'&embedded=true');
  }

book.html

<ion-header>
  <ion-navbar>
    <ion-title>View book</ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>
 <iframe width="100%" height="100%" [src]="pdfUrl" frameborder="0" allowfullscreen>
</iframe>

</ion-content>

现在我需要的是能够在第一次加载后离线查看网页(也许在iframe中)。谢谢

我强烈建议您使用离子缓存服务

离子缓存服务几乎可以缓存。它缓存 请求,可观察到,承诺和经典数据。它使用离子 存储,因此我们支持IndexedDB,Sqlite(Cordova),WebSQL 命令。它可以在Angular 2应用中分别使用。

npm install ionic-cache @ionic/storage --save

很棒的 simon 的视频和文章。

相关内容

  • 没有找到相关文章