What is the equivalent of file_get_contents ($ url) in JavaScript or TypeScript?

Question

I am developing an application with ionic 2 and I want to extract some data from an external page in another domain, and the way I have solved it is with php in the following way:

myPhp.php

<?php
    header('Access-Control-Allow-Origin: *');

    //$url = 'http://www.flalottery.com/fantasy5';
    $url = 'http://www.flalottery.com/exptkt/ff.html';
    $pagina = file_get_contents($url);
    echo  $pagina;
?>

home.ts

import { Http } from '@angular/http';
import 'rxjs/add/operator/map'
import { NavController } from 'ionic-angular';
@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

  constructor(public navCtrl: NavController,
              public http:  Http ) {
     this.http.get('http://localhost/myPhp.php').subscribe(
       datos => console.log(datos._body))
  }
}

The php file is running on a local apache server.

How can I do what the php file does but with JavaSecript or TypeScript?

You probably can't due to CORS restrictions and your server side proxy approach is the most common way to do such things. Note you don't need the access control header since your client side request is same domain — charlietfl, Oct 29 '17 at 18:57
@Tenbo that won't work cross domain when CORS is not enabled on remote server — charlietfl, Oct 29 '17 at 19:00

score 0 · Answer 1 · answered Oct 29 '17 at 20:42

0

Use Ajax

$.ajax({
    type: "GET",
    url: "http://www.flalottery.com/exptkt/ff.html"
}).done(function(data){
    console.log(data);
});

Or use a simple get request

$.get("http://www.flalottery.com/exptkt/ff.html", function(data) { 
    console.log(data);
});

Or use XHR

var xhr = new XMLHttpRequest();
xhr.open("GET", "http://www.flalottery.com/exptkt/ff.html", true);
xhr.onload = function () {
    console.log(xhr.responseText);
};
xhr.send();

answered Oct 29 '17 at 20:42

Ashley Simpson Stock

73
4

Try option 3, but this did not work, I want to try option 1 and 2 but I can not do this in a .ts file, do some research and say that it's up to install jquery https://forum.ionicframework.com/t/jquery-in-ionic-and-typescript / 54015, First install the package. npm install jquery --save , Install (typings and) the typings file, npm install -g typings, typings install dt ~ jquery --global --save, and finally, import the jquery to your ts file, import * as $ from 'jquery', I do this and I get the following error: Uncaught Error: Cannot find module "jquery" – Daniel Enrique Rodriguez Caste Oct 29 '17 at 22:45
I already try to try the three options that you give me, but in all of them I get the same error: Failed to load http://www.flalottery.com/fantasy5: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http: // localhost: 8100' is therefore not allowed access. I do not get the html coding – Daniel Enrique Rodriguez Caste Oct 29 '17 at 23:07
1

Try adding crossDomain: true, to the first ajax request, if that fails then the website you are requesting data from is blocking third party get requests – Ashley Simpson Stock Nov 15 '17 at 10:00

What is the equivalent of file_get_contents ($ url) in JavaScript or TypeScript?

1 Answers1