Origin is Null in ajax/php request

Question

I'm trying to create a jquery auto compelete. when I test to see if I'm connecting to the php file via ajax, I get the following error. what is going on?

error: XMLHttpRequest cannot load file:///C:/Users/Asus/Desktop/UI_lab/lab4/getflights.php?flight=n. Received an invalid response. Origin 'null' is therefore not allowed access.

update: ok I have all the necessary files on my school server and connected to it via vpn and I'm getting this error telling me that the variable is not defined! the error: ReferenceError: $ is not defined Lab44.html:19

here is my code:

<!DOCTYPE html>
<html>
    <head>
        <title>TODO supply a title</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width">
        <script src="js/jquery-1.11.1.min.js"></script>
        <script src = "js/jquery-ui-1.10.4.min.js"></script>
        <link rel="stylesheet" type="text/css" href="css/ui-lightness/jquery-ui-1.10.4.min.css" />  
        <style type=text/css>
            #form1 {
                background-color:  #ff9900;
                width: 200px;
                border:  #000 double medium;
                padding: 10px;
            }
        </style>
        <script type="text/javascript" language="javascript">
            $(document).ready(function() {
              $("#flight").keyup(function () {
               var flight = $("#flight").val();
                  $.ajax({

                   url: "getflights.php",
                   data: "flight=" + flight,
                   success: function(msg) {
                    alert(msg);
                    }

                                     });


              });
            //TODO1: Use autocomplete for input#flight
            //With AJAX get the list of flights (getflights.php)
            //Fill the list with the list of flights in n response (Make a javascript array of those)
            //See: autocomplete and options 'source' (Use type Function: in function you get the list with AJAX)

            //TODO2: For inputs date1 and date2 use Datepicker
            //2 months seen and other month's days are shown
            //For date2 set the the date of selected date1 (From and To dates)

            //TODO3: Set event handler for submit button
            //Use slide and puff animations
            //Dialog is modal
            //Get the flight and dates from Form
            //Add one button 'close'
                  });


         </script>
    </head>
    <body>
        <form id="form1">
        <h2> Flight Reservation </h1>
        <h3>Enter :</h3>
        <input id="flight" />
        <h3>Click to select a dates:</h3>
        <h5> From </h5>
        <input id=date1 />
        <h5>  To </h5>
        <input id=date2 />
        <div id="dialog" title="Window title">
            <p>   </p>
        </div>
        <input type="button" name="submit" value="Submit" id="submitbutton" />
        <input type="reset" name="reset" value="Clear" id="resetbutton" />
        </form>
</body>
</html>

possible duplicate of [XMLHttpRequest Origin null is not allowed Access-Control-Allow-Origin for file:/// to file:/// (Serverless)](http://stackoverflow.com/questions/4208530/xmlhttprequest-origin-null-is-not-allowed-access-control-allow-origin-for-file) — Brian Dillingham, Sep 25 '14 at 16:04
@user2864059: For security purposes, you generally can not use AJAX on your local system using `file:///` URLs. The easiest way to simulate AJAX is to run a local HTTP server. If you can't do that, I'd suggest you use a free service like Nitrous.IO to set up a simple test site. — Conspicuous Compiler, Sep 25 '14 at 16:09

score -1 · Answer 1 · answered Sep 25 '14 at 16:08

-1

You appear to be trying to use PHP without an actual webserver running (i.e. you are accessing the website using the file:// protocol). In order to use PHP, you need a webserver (such as apache) that will run PHP which will in turn preprocess your .php files when the browser requests them. To make it easier to install and set up PHP with a webserver, you might want to try XAMPP for example.

In addition, even if your file didn't require PHP, Chrome won't allow you to use AJAX for file:// files.

In short, to do web development using AJAX and PHP, you need to get yourself a webserver running.

answered Sep 25 '14 at 16:08

fstanis

5,234
1
23
42

1

Please don't add replies to duplicate questions. – Conspicuous Compiler Sep 25 '14 at 16:09
The answers given in the question that was linked as a duplicate (running chrome with a command line argument that allows `file://` requests) would *not* solve OP's problem (or rather, they would simply lead to a different problem) - he would still need a webserver because he is trying to request a .php file. – fstanis Sep 25 '14 at 16:11
Check out [the currently second-highest rated answer on that question](http://stackoverflow.com/a/4276931/106769) which addresses this. Cheers! – Conspicuous Compiler Sep 25 '14 at 16:14
ok I have all the necessary files on my school server and connected to it via vpn and I'm getting this error telling me that the variable is not defined! the error: ReferenceError: $ is not defined Lab44.html:19 – user2864059 Sep 25 '14 at 16:15
@user2864059 that means jQuery is not defined (not loaded), stackoverflow isn't here so you don't have to debug your own code. Search the error messages! :) – Brian Dillingham Sep 25 '14 at 16:27

Origin is Null in ajax/php request

1 Answers1