Jump to content
SheenLim08

XMLHttpRequest.Send($value)

Recommended Posts

Hi Guys,

I am following this book to learn php. Supposedly it will get return html contents from another site using async methods via XMLHttpRequest.

Quote

function CreateXMLHttpRequest() {
    var xmlhttp;
    
    // code for IE7+, Firefox, Chrome, Opera, Safari
    if (window.XMLHttpRequest) {
        xmlhttp = new XMLHttpRequest();
        
    } else { // code for IE6+
        xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
        
    }
    
    return xmlhttp;
}

Quote

<?php

// urlpost.php

if (filter_has_var(INPUT_POST, 'url')) {
    $returnValue = file_get_contents('https://' . sanitizeString(filter_input(INPUT_POST, 'url')));
    
    if (!$result) {
        echo $returnValue;
    } else {
        echo "Unable to retrieve " . filter_input(INPUT_POST, 'url');
    }
}

function sanitizeString($var) {
    return stripslashes(htmlentities(strip_tags($var)));
}

Now here is my main page calling the async method.

Quote

<!DOCTYPE html>

<html>
    <head>
        <meta charset="UTF-8">
        <title>Asynchronous Communication Example</title>
        <style>
            .bodyStle {
                text-align: center;
            }
        </style>
        <script src="CreateXMLHTTPRequest.js"></script>
    </head>
    <body class="bodyStle">
        <h1>Loading a web page into a DIV</h1>
        <div id="info">This sentence will be replaced</div>
        
        <script>
            params  = "url=www.facebook.com";
            request = new CreaterXMLHttpRequest();
            
            request.open("POST", "urlpost.php", true);
            request.setRequestHeader("Content-type", "application/x-www-form-ur-lencoded");
            //request.setRequestHeader("Content-length", params.length);
            //request.setRequestHeader("Connection", "close");
            
            request.onreadstatechange = function() {
                if (request.readyState === 4) {
                    if (request.status === 200) {
                        if (request.responseText !== null) {
                            document.getElementById('info').innerHTML = request.responseText;
                            
                        } else {
                            alert("Communication error: No data received");
                            
                        }
                    } else {
                        alert("Communication error: No data received");
                        
                    }
                }
            };
            
            request.send(params);
        </script>
        <br />
        <a href="../index.php">Main Page</a>
    </body>
</html>

When I try to setup breakpoints in php on the urlpost.php

the line "if (filter_has_var(INPUT_POST, 'url')) {" returns false. What am i doing on the main page causing the javascript variable "params" not being posted on the PHP/Web Server?

Share this post


Link to post
Share on other sites

You have to send the parameters with the send() function

request.open("POST", "urlpost.php", true);
request.send(params);

 

Share this post


Link to post
Share on other sites

Do you really have to support IE6 or is the book you're using just really old? I've not seen that structure in forever; honestly I think that exact code is one of the main reasons jQuery blew up as big as it did as quickly as it did.

Share this post


Link to post
Share on other sites
14 hours ago, SheenLim08 said:

request.setRequestHeader("Content-type", "application/x-www-form-ur-lencoded");

Your mime type is incorrect, there is an extra dash.

request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

 

Share this post


Link to post
Share on other sites
9 hours ago, Zane said:

You have to send the parameters with the send() function


request.open("POST", "urlpost.php", true);
request.send(params);

 

I did that at the end of the <script> tag

Share this post


Link to post
Share on other sites
8 hours ago, kicken said:

Your mime type is incorrect, there is an extra dash.


request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

 

I corrected the wrong part but it still the same.

Share this post


Link to post
Share on other sites
9 hours ago, maxxd said:

Do you really have to support IE6 or is the book you're using just really old? I've not seen that structure in forever; honestly I think that exact code is one of the main reasons jQuery blew up as big as it did as quickly as it did.

I'm a novice about anything web apps so I just follow the book and research what it does as I go. the book I am following is "Learning PHP, MySQL Javascript 5th edition" in the latest version of its series i believe.

Share this post


Link to post
Share on other sites
9 hours ago, maxxd said:

I think that exact code is one of the main reasons jQuery blew up as big as it did as quickly as it did.

+1. I can't understand why anyone would not use jQuery for AJAX requests.

As you are just fetching data to display on the page you should be using GET method and not POST.

Change to $_GET and test your  "urlpost.php" page on its own in your browser, passing the "url=www.facebook.com" in the query string. Any errors should the become evident.

Share this post


Link to post
Share on other sites
6 hours ago, SheenLim08 said:

I did that at the end of the <script> tag

Ah, I completely missed that.  I do agree with everyone else though.. Why are you not using a framework for this?  With jQuery, you can do a POST request as easy as this:

jQuery.post('urlpost.php', { 'url':'facebook.com' });

Not only that, but you can add a callback function to do stuff with the data returned.

jQuery,.post('urlpost.php', { 'url':'facebook.com' }, function(data){ console.log(data); });

Why go about it in the most antiquated way?

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.