Handle remote CGI script's response in AJAX

Question

I'm trying to handle the response of a CGI script (located on a remote machine) in a PHP generated HTML page on an apache server that I'm working on.

A little background first. The user upon accessing the webpage is asked to login using username and password (htaccess). Upon login, the username and the site-code of the user in the organization is determined. For example let:

username: user
sitecode: IN88

I'm handling the CGI call in an HTML form as follows:

<form method="POST"
action="http://path/scriptName.cgi?userid=user&siteid=IN88&type=desktop">
    <input type="submit" value="Create Account"></input>
    <div id="result"></div>
    </form>

And handling the response as follows (The script return simple text as output saying SUCCESS, if account is created, or SKIPPED, if the users account already exists):

<script>
$(function() {
        $('form').submit(function(event) {
                event.preventDefault();

        $.ajax({
                url: 'http://path/script.cgi?userid=user&siteid=IN88&type=desktop',
                type: 'POST',
                dataType: 'text',
                beforeSend: function() {
                        $('#result').html("Sending Request to Server ...");
                },
                success: function (response) {
                        console.log('Success response: ' + response);
                        var text = "Account Registration Status: " + response;
                        $('#result').html(text);
                },
                error: function(response){
                        console.log('Error response: ' + response);
                        $('#result').html("Account Registration Status: " + response);
                }
        });
});
});
</script>

The error that I'm getting is:

XMLHttpRequest cannot load http://path/script.cgi?userid=user&siteid=IN88&type=desktop. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'myMachineName' is therefore not allowed access.

Now from the error, it is clear to me that there is some access issue and the server machine where the CGI script is located is not giving access to HTTP requests from the originating machine. I tried adding the following header information in the AJAX request:

'Access-Control-Allow-Origin': '*'

But this didn't work either. Any help would be greatly appreciated.

Thanks.

Answer 1

Your URL is incorrect. http://path/script is going to try and hit a server named path. Since your ajax code was loaded from your server (e.g. example.com), you're effectively trying to do a cross-domain request. The browser won't even bother trying to initiate an http request, it'll get rejected immediately without ever hitting the network.

For simple AJAX requests, your url can literally be just url: '/path/script?....', and the browser will fill in the http://example.com automatically, exactly as if you had <img src="kittens.jpg"> in your html.

That or you add in the name of your server, so it's url: 'http://example.com/path/etc...'