Is there a JavaScript way to do file_get_contents()?

Question

Here is the PHP documentation

Here is how I would use it in an Ajax call, if I don't find a pure client way to do this.

$homepage = file_get_contents('http://www.example.com/');
echo $homepage;

Is there way to do this client side instead so I don't have to ajax the string over?

Answer 1

It's 2020 and some modern approach;

async function file_get_contents(uri, callback) {
    let res = await fetch(uri),
        ret = await res.text(); 
    return callback ? callback(ret) : ret; // a Promise() actually.
}

file_get_contents("https://httpbin.org/get", console.log);
// or
file_get_contents("https://httpbin.org/get").then(ret => console.log(ret));

Answer 2

you could do

JS code:

$.post('phppage.php', { url: url }, function(data) {
    document.getElementById('somediv').innerHTML = data;        
});

PHP code:

$url = $_POST['url'];
echo file_get_contents($url);

That would get you the contents of the url.

Answer 3

JavaScript cannot go out and scrape data off of pages. It can make a call to a local PHP script that then goes on its behalf and grabs the data, but JavaScript (in the browser) cannot do this.

$.post("/localScript.php", { srcToGet: 'http://example.com' }, function(data){
  /* From within here, data is whatever your local script sent back to us */
});

You have options like JSONP and Cross-Origin Resource Sharing at your disposal, but both of those require setting up the other end, so you cannot just choose a domain and start firing off requests for data.

Further Reading: Same origin policy

Answer 4

This function will return the file as a string just like the PHP file_get_contents().

function file_get_contents(uri, callback) {
    fetch(uri).then(res => res.text()).then(text => callback(text));
}

However unlike PHP, JavaScript will go on to the next statement, not waiting for the data to return.

Answer 5

Not in a general sense. Cross-domain restrictions disallow Javascript code from doing this.

If the target site has CORS (cross-origin resource sharing) set up, you can use XMLHttpRequest to load files. Most sites do not, as it's off by default for security reasons, and is rarely necessary.

If you just need to include an HTML page, you can stick it in an <iframe> element. This is subject to some layout gotchas, though (the page ends up in a fixed-size element).

Answer 6

Or You can use php.js library. Which allow some php functions for javascript. file_get_contents() function one of them.

<script>
var data = file_get_contents('Your URL');
</script>

You can find more info about php.js : http://phpjs.org/

Answer 7

I think this may be useful for you:

An npm package with the "file-get-contents" method for node.js https://www.npmjs.com/package/file-get-contents

It is asynchronous so if you are using express it should be used like this

app.get('/',  async (req, res)=>{
    //paste here the code below
}

Example

const fileGetContents = require('file-get-contents');
 
// A File request
 
try {
    let data = await fileGetContents('/tmp/foo/bar');
 
    console.log(data);
} catch (err) {
    console.log('Unable to load data from /tmp/foo/bar');
}
 
// Or a HTTP(S) request
 
fileGetContents('https://pokeapi.co/api/v2/pokemon/1/').then(json => {
    const pokemon = JSON.parse(json);
 
    console.log(`Name of first pokemon is ${pokemon.name}`);
}).catch(err => {
    console.err(`Unable to get content from PokeAPI. Reason: ${err.message}`);
});

Answer 8

  <div id="svg">

  </div>
  <script>

    function file_get_contents(uri, callback) {
         fetch(uri).then(res => res.text()).then(text => 
        {

            var xmlSvg =text;
            console.log(xmlSvg );
            document.getElementById('svg').innerHTML = xmlSvg;
        })
    }

    
    var uri ='You-urlllllllll-svg';

    file_get_contents(uri);

</script>

Answer 9

function file_get_contents(filename) {
    fetch(filename).then((resp) => resp.text()).then(function(data) {
        document.getElementById("id").innerHTML = data;
    });
}
file_get_contents("url");

<span id="id"></span>