Как загрузить страницу Google Play с помощью WebView?

Question

Я использую Ionic 3. Этот код работает с другими сайтами, но с URL Google Play он не работает.Как загрузить страницу Google Play с WebView?

import { Component } from '@angular/core';
import { NavController, Platform } from 'ionic-angular';
import { InAppBrowser, InAppBrowserOptions } from '@ionic-native/in-app-browser';

declare var navigator: any;
declare var Connection: any;

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})

export class HomePage {
    Connection: any;
    isLaunch: Boolean = false;

    constructor( private platform: Platform, private iab: InAppBrowser) {
        this.platform.ready().then(() => {
            this.launch();
        });

    }

    launch() {
        this.isLaunch = true;
        const browser = this.iab.create('https://play.google.com','_self' , "location=yes");

        browser.show();
    }
    }

 <ion-content>
    <iframe width='100%' height='100%'
    src="https://play.google.com/" frameborder="0" allowfullscreen>
   </iframe>
  </ion-content>

Заранее спасибо.

Answer 1

Вы не сможете сделать это.

Вы пытаетесь загрузить Google Play в кадре с другого доменного имени. Если бы Google допустил это, это было бы большой угрозой безопасности, например, это могло бы позволить вам обманом заставить пользователей нажимать на ваш сайт, когда они думали, что нажимают на Play.

Чтобы предотвратить это, Google и другие сайты используют заголовок " X-FRAME-OPTIONS ", установленный на "SAMEORIGIN". Это говорит браузеру не разрешать помещать его в iframe, если исходный URL также не взят из play.google.com. Многие другие веб-страницы делают это тоже. Вы можете увидеть это, если откроете play.google.com в Chrome и воспользуетесь инструментами разработчика, чтобы посмотреть заголовок запроса.

Answer 2

Я использовал модуль in-app-browser для загрузки своей веб-страницы в приложения.Следующий код я пишу, чтобы показать веб-страницу в приложениях.

  import {Component} from '@angular/core';
  import {NavController, Platform} from 'ionic-angular';
  import { InAppBrowser } from '@ionic-native/in-app-browser';

  declare var navigator: any;
  declare var Connection: any;

  @Component({
      selector: 'page-home',
      templateUrl: 'home.html'
  })
  export class HomePage {
      Connection: any;
      isLaunch: Boolean = false;

      constructor( private platform: Platform, private iab: InAppBrowser) {
          this.platform.ready().then(() => {
              this.launch();
          });

      }

      launch() {
          this.isLaunch = true;
          const browser = this.iab.create('https://play.google.com','_self' , "location=yes");

          browser.show();
      }
  }

<ion-content>

  <div #frame style="width:100%;height:100%;overflow:scroll !important;-webkit-overflow-scrolling:touch !important"> 
    <iframe [src]="https://play.google.com" class="iframe" scrolling="yes" ></iframe> </div>
  
</ion-content>