Simultaneously saving data across pages, ajax or curl

Question

I have one page that fetches html, and another to parse it. The ultimate end goal has the data formatted and saved to a local data.json file. I am using different scripts to add JavaScript into the mix, as it parses html much more nicely than php. (the actual application does more involved HTML handling.)

The current iteration looks like this:

index.php

public function parseHTML(string $site, string $html)
{
    $data = [
        'html' => '<div id="get">this is text</div>',
        'site' => $site,
    ];

    $url = 'tehsaurux.net/test.php';

    $ch = curl_init();
    curl_setopt($ch, CURLOPT_URL, $url);
    curl_setopt($ch, CURLOPT_HEADER, false);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
    curl_setopt($ch, CURLOPT_POST, 2);
    curl_setopt($ch, CURLOPT_POSTFIELDS, $data);

    $synonyms = curl_exec($ch);

    if ($synonyms === false) {
        print_r(curl_error($ch));
        return false;
    }
    return $synonyms;
}

test.php

<?php
if (isset($_POST['html'])) {
    echo $_POST['html'];
} else {
    echo "No post data in the first test page.<br>";
}
?>


<script src="http://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>


result = $("#get").innerHTML;

$.post('test2.php', {data: result}, function(d) {
    document.write("Here is the result of the second ajax request.", d);
});
</script>

test2.php

<?php
if (isset($_POST['data'])) {
    echo "Test1 page data is ", print_r($_POST['data']), "<br>";
    file_put_contents('data.txt', $data);

} else {
    echo "NO DATA from page 1.<br>";
}

?>

And the output as printed on index.php at the end:

Here is the result of the second ajax request.NO DATA from page 1.
Here is the result of the second ajax request.NO DATA from page 1.

It appears then that the Ajax request on test.php to test2.php does not send the data. What's more is the document.write call on test.php writes its output to index.php rather than itself. Does an Ajax call essentially load the script into the initial page then, much like a require statement?

I would really like to be able to send the fetched html to an external script, parse it, and return a nice, clean list of csv data.

. . . . I have also tried using document.write() to print the desired data on each script page since it that is what is returned. The issue there is that the result as well as the fetched html get printed. No good.

Answer 1

Honestly, I don't think you took the right approach for parsing your code. You send a html page to the server - which send it back to the user browser for interpretation. Then some selected content is sent again to the server. Where does the html come from? If it 100% yours it could work. But if it is the users', then you expose your project to all sort of security issues.

Technically speaking, your code is almost working. Two things you need to change.

Remove the backslashes in your html, so the get is interpredted as an ID:

'<div id="get">this is text</div>'

This is perfectly fine to have " in a string delimited by ' in php.

The other thing is $("#get") . It looks like jQuery expects a well-formatted document - with doctype, html, body, etc - but your whole document consists in a div . So use getElementById() instead:

var result = document.getElementById("get").innerHTML;