1

Estoy desarrollando una aplicación con ionic y necesito capturar una información que hay en una pagina web externa, he intentado incrustar la web con una etiqueta <iframe> y intento seleccionar el elemento html que contiene el dato pero no logro hacerlo, la información que necesito obtener es lo que esta resaltado en rojo:

introducir la descripción de la imagen aquí

Lo que he intentado es lo siguiente:

Html:

<ion-header>
  <ion-navbar>
    <ion-title>
      Home
    </ion-title>
  </ion-navbar>
</ion-header>

<ion-content >
  <iframe class="iframe" src="http://www.flalottery.com/fantasy5"></iframe>
</ion-content>

ts:

import { Component, ViewChild } from '@angular/core';
import { NavController } from 'ionic-angular';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';

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

    @ViewChild('gameContentLeft') sorteo;
  constructor(public navCtrl: NavController) {
  }

  ionViewDidLoad() {
    var sorteo = document.getElementById('gameContentLeft')
    console.log([sorteo, this.sorteo]);
    console.log('ionViewDidLoad RegistroPage');
  }

}

Pero todo me da como undefined o null, ¿de que manera puedo extraer estos datos de esta pagina usando JavaScript? ¿Existe alguna otra forma para extaer estos datos con ionic sin necesidad de usar la etiqueta <iframe>?

1 respuesta 1

0

Si la página que estas mostrando en el iframe es tuya puedes usar el metodo window.postMessage() que permite de forma segura la comunicación de origen cruzado.

Enviar mensaje desde la página web

sendMessage(){
  mensaje = "hola";
      this.iframe.nativeElement.contentWindow.postMessage(mensaje,'*');
};

Capturar el mensaje en la app ionic

window.onmessage = (e)=>{
   console.log("Mensaje: ", e.data);    
      };

Normalmente, las secuencias de comandos en diferentes páginas pueden acceder entre ellas si y solo si las páginas que las ejecutaron están en ubicaciones con el mismo protocolo (generalmente ambas https), número de puerto (443 es el predeterminado https) y host (módulo Document.domain establecido por ambos) páginas con el mismo valor). window.postMessage()proporciona un mecanismo controlado para eludir esta restricción de una manera segura cuando se usa apropiadamente.

Mas información: https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage

1
  • No, la pagina donde se encuentran los datos que necesito no es mía, es una lotería de otro país, por ahora tengo medio solucionado el tema, estoy usando un servidor apache ejecuta un archivo PHP y este me extrae completo el código HTML y luego proceso esa información y extraigo los datos que están resaltado en rojo, lo que necesito es hacer eso mismo pero con JavaScript Commented el 29 oct. 2017 a las 1:42

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.