Rectangle 27 73

You need to maybe add a HEADER in your called script, here is what I had to do in PHP:

header('Access-Control-Allow-Origin: *');

How is this done on a normal html file (no php)?

@HerberthAmaral I tried adding this inside <head></head>, but it doesn't work for me. I am trying it in iOS Safari and Chrome, but in the console, I get the origin null is not allowed by Access-Control-Allow-Origin error.

It doesn't work in the head of the html file for security reasons. It has to be a header. stackoverflow.com/questions/7015782/

javascript - XmlHttpRequest error: Origin null is not allowed by Acces...

javascript jquery xmlhttprequest cors jsonp
Rectangle 27 73

You need to maybe add a HEADER in your called script, here is what I had to do in PHP:

header('Access-Control-Allow-Origin: *');

How is this done on a normal html file (no php)?

@HerberthAmaral I tried adding this inside <head></head>, but it doesn't work for me. I am trying it in iOS Safari and Chrome, but in the console, I get the origin null is not allowed by Access-Control-Allow-Origin error.

It doesn't work in the head of the html file for security reasons. It has to be a header. stackoverflow.com/questions/7015782/

javascript - XmlHttpRequest error: Origin null is not allowed by Acces...

javascript jquery xmlhttprequest cors jsonp
Rectangle 27 73

You need to maybe add a HEADER in your called script, here is what I had to do in PHP:

header('Access-Control-Allow-Origin: *');

How is this done on a normal html file (no php)?

@HerberthAmaral I tried adding this inside <head></head>, but it doesn't work for me. I am trying it in iOS Safari and Chrome, but in the console, I get the origin null is not allowed by Access-Control-Allow-Origin error.

It doesn't work in the head of the html file for security reasons. It has to be a header. stackoverflow.com/questions/7015782/

javascript - XmlHttpRequest error: Origin null is not allowed by Acces...

javascript jquery xmlhttprequest cors jsonp
Rectangle 27 73

You need to maybe add a HEADER in your called script, here is what I had to do in PHP:

header('Access-Control-Allow-Origin: *');

How is this done on a normal html file (no php)?

@HerberthAmaral I tried adding this inside <head></head>, but it doesn't work for me. I am trying it in iOS Safari and Chrome, but in the console, I get the origin null is not allowed by Access-Control-Allow-Origin error.

It doesn't work in the head of the html file for security reasons. It has to be a header. stackoverflow.com/questions/7015782/

javascript - XmlHttpRequest error: Origin null is not allowed by Acces...

javascript jquery xmlhttprequest cors jsonp
Rectangle 27 73

You need to maybe add a HEADER in your called script, here is what I had to do in PHP:

You need to maybe add a HEADER in your called script, here is what I had to do in PHP:

header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Origin: *');

How is this done on a normal html file (no php)?

How is this done on a normal html file (no php)?

@HerberthAmaral I tried adding this inside <head></head>, but it doesn't work for me. I am trying it in iOS Safari and Chrome, but in the console, I get the origin null is not allowed by Access-Control-Allow-Origin error.

@HerberthAmaral I tried adding this inside <head></head>, but it doesn't work for me. I am trying it in iOS Safari and Chrome, but in the console, I get the origin null is not allowed by Access-Control-Allow-Origin error.

It doesn't work in the head of the html file for security reasons. It has to be a header. stackoverflow.com/questions/7015782/…

It doesn't work in the head of the html file for security reasons. It has to be a header. stackoverflow.com/questions/7015782/

javascript - XmlHttpRequest error: Origin null is not allowed by Acces...

javascript jquery xmlhttprequest cors jsonp
Rectangle 27 73

You need to maybe add a HEADER in your called script, here is what I had to do in PHP:

header('Access-Control-Allow-Origin: *');

How is this done on a normal html file (no php)?

@HerberthAmaral I tried adding this inside <head></head>, but it doesn't work for me. I am trying it in iOS Safari and Chrome, but in the console, I get the origin null is not allowed by Access-Control-Allow-Origin error.

It doesn't work in the head of the html file for security reasons. It has to be a header. stackoverflow.com/questions/7015782/

javascript - XmlHttpRequest error: Origin null is not allowed by Acces...

javascript jquery xmlhttprequest cors jsonp
Rectangle 27 3

The 'Origin null is not allowed by Access-Control-Allow-Origin.' is happening because you are opening the page locally on your machine and not via a web address. Chrome is checking you are not making cross-domain calls and has decided it can't verify your calls because they are local. This may be a clue as to why the images aren't loading - the relative path you've given may be causing issues. If you save the HTML that shows in jQuery to a new flat HTML file and open it in the same location, do the images show?

Thanks again Liam. I changed my relative path to the complete URL and the images changed in Firefox. So, their was maybe a problem on the local site. Regarding Chrome, it does not work right now locally, but I am confident that it will work when uploading the page.

google chrome - jQuery: HTML is not updated after manipulating jquery google-chrome image src

Rectangle 27 194

Origin null is the local file system, so that suggests that you're loading the HTML page that does the load call via a file:/// URL (e.g., just double-clicking it in a local file browser or similar). Different browsers take different approaches to applying the Same Origin Policy to local files.

Origin null is the local file system, so that suggests that you're loading the HTML page that does the load call via a file:/// URL (e.g., just double-clicking it in a local file browser or similar). Different browsers take different approaches to applying the Same Origin Policy to local files.

My guess is that you're seeing this using Chrome. Chrome's rules for applying the SOP to local files are very tight, it disallows even loading files from the same directory as the document. So does Opera. Some other browsers, such as Firefox, allow limited access to local files. But basically, using ajax with local resources isn't going to work cross-browser.

My guess is that you're seeing this using Chrome. Chrome's rules for applying the SOP to local files are very tight, it disallows even loading files from the same directory as the document. So does Opera. Some other browsers, such as Firefox, allow limited access to local files. But basically, using ajax with local resources isn't going to work cross-browser.

If you're just testing something locally that you'll really be deploying to the web, rather than use local files, install a simple web server and test via http:// URLs instead. That gives you a much more accurate security picture.

If you're just testing something locally that you'll really be deploying to the web, rather than use local files, install a simple web server and test via http:// URLs instead. That gives you a much more accurate security picture.

After I upload it I no longer get Origin null, but I am still getting "not allowed by Access-Control-Allow-Origin."

After I upload it I no longer get Origin null, but I am still getting "not allowed by Access-Control-Allow-Origin."

If the resource you're loading is as you've shown ($('#result').load('weather.xsl');), that shouldn't happen, because the request is clearly to the same origin. If you're trying to load from somewhere else (e.g., $('#result').load('http://somewhere.else/weather.xsl');), then you're running into the SOP again, but in a different way. Ajax requests are restricted to the same origin (see link in answer), or if you're using a CORS-enabled browser and the server supports CORs, the server can choose whether to allow the cross-origin request.

If the resource you're loading is as you've shown ($('#result').load('weather.xsl');), that shouldn't happen, because the request is clearly to the same origin. If you're trying to load from somewhere else (e.g., $('#result').load('http://somewhere.else/weather.xsl');), then you're running into the SOP again, but in a different way. Ajax requests are restricted to the same origin (see link in answer), or if you're using a CORS-enabled browser and the server supports CORs, the server can choose whether to allow the cross-origin request.

I changed the load url. Changing it back to the one in the question makes it load fine. Thanks for the help

I changed the load url. Changing it back to the one in the question makes it load fine. Thanks for the help

What is the simplest, quickest way to set up a simple web server? Would IIS be the simplest way here?

What is the simplest, quickest way to set up a simple web server? Would IIS be the simplest way here?

@CiaranG I ran python -m SimpleHTTPServer from a command line and then went to localhost:8000, worked for me. Python comes preinstalled with Mac OS X; you may need to install if using another OS.

@CiaranG I ran python -m SimpleHTTPServer from a command line and then went to localhost:8000, worked for me. Python comes preinstalled with Mac OS X; you may need to install if using another OS.

jquery - Origin null is not allowed by Access-Control-Allow-Origin - S...

jquery html
Rectangle 27 194

Origin null is the local file system, so that suggests that you're loading the HTML page that does the load call via a file:/// URL (e.g., just double-clicking it in a local file browser or similar). Different browsers take different approaches to applying the Same Origin Policy to local files.

My guess is that you're seeing this using Chrome. Chrome's rules for applying the SOP to local files are very tight, it disallows even loading files from the same directory as the document. So does Opera. Some other browsers, such as Firefox, allow limited access to local files. But basically, using ajax with local resources isn't going to work cross-browser.

If you're just testing something locally that you'll really be deploying to the web, rather than use local files, install a simple web server and test via http:// URLs instead. That gives you a much more accurate security picture.

After I upload it I no longer get Origin null, but I am still getting "not allowed by Access-Control-Allow-Origin."

If the resource you're loading is as you've shown ($('#result').load('weather.xsl');), that shouldn't happen, because the request is clearly to the same origin. If you're trying to load from somewhere else (e.g., $('#result').load('http://somewhere.else/weather.xsl');), then you're running into the SOP again, but in a different way. Ajax requests are restricted to the same origin (see link in answer), or if you're using a CORS-enabled browser and the server supports CORs, the server can choose whether to allow the cross-origin request.

I changed the load url. Changing it back to the one in the question makes it load fine. Thanks for the help

What is the simplest, quickest way to set up a simple web server? Would IIS be the simplest way here?

@CiaranG I ran python -m SimpleHTTPServer from a command line and then went to localhost:8000, worked for me. Python comes preinstalled with Mac OS X; you may need to install if using another OS.

jquery - Origin null is not allowed by Access-Control-Allow-Origin - S...

jquery html
Rectangle 27 193

Origin null is the local file system, so that suggests that you're loading the HTML page that does the load call via a file:/// URL (e.g., just double-clicking it in a local file browser or similar). Different browsers take different approaches to applying the Same Origin Policy to local files.

My guess is that you're seeing this using Chrome. Chrome's rules for applying the SOP to local files are very tight, it disallows even loading files from the same directory as the document. So does Opera. Some other browsers, such as Firefox, allow limited access to local files. But basically, using ajax with local resources isn't going to work cross-browser.

If you're just testing something locally that you'll really be deploying to the web, rather than use local files, install a simple web server and test via http:// URLs instead. That gives you a much more accurate security picture.

After I upload it I no longer get Origin null, but I am still getting "not allowed by Access-Control-Allow-Origin."

If the resource you're loading is as you've shown ($('#result').load('weather.xsl');), that shouldn't happen, because the request is clearly to the same origin. If you're trying to load from somewhere else (e.g., $('#result').load('http://somewhere.else/weather.xsl');), then you're running into the SOP again, but in a different way. Ajax requests are restricted to the same origin (see link in answer), or if you're using a CORS-enabled browser and the server supports CORs, the server can choose whether to allow the cross-origin request.

I changed the load url. Changing it back to the one in the question makes it load fine. Thanks for the help

What is the simplest, quickest way to set up a simple web server? Would IIS be the simplest way here?

@CiaranG I ran python -m SimpleHTTPServer from a command line and then went to localhost:8000, worked for me. Python comes preinstalled with Mac OS X; you may need to install if using another OS.

jquery - Origin null is not allowed by Access-Control-Allow-Origin - S...

jquery html
Rectangle 27 395

For the record, as far as I can tell, you had two problems:

The first was solved in a roundabout way by Darin's suggestion to use $.getJSON. It does a little magic to change the request type from its default of "json" to "jsonp" if it sees the substring callback=? in the URL.

That solved the second by no longer trying to perform a CORS request from a file:// URL.

To clarify for other people, here are the simple troubleshooting instructions:

$.get
dataType
jsonp
  • You're using $.getJSON and included callback=? in the URL.
http://
file://
  • Make sure the browser actually supports CORS. (Opera and Internet Explorer are late to the party)

So what is the solution to this?

Some browsers like chrome allow CORS if started with the parameter --allow-file-access-from-files

callback=?
jsonp=?

@crunkchitis: I'm not sure why callback=? isn't working for you, given that the current jQuery docs still say it should but, if I'm reading them correctly, they also say that anything_else=? will also work.

javascript - XmlHttpRequest error: Origin null is not allowed by Acces...

javascript jquery xmlhttprequest cors jsonp
Rectangle 27 395

For the record, as far as I can tell, you had two problems:

For the record, as far as I can tell, you had two problems:

The first was solved in a roundabout way by Darin's suggestion to use $.getJSON. It does a little magic to change the request type from its default of "json" to "jsonp" if it sees the substring callback=? in the URL.

The first was solved in a roundabout way by Darin's suggestion to use $.getJSON. It does a little magic to change the request type from its default of "json" to "jsonp" if it sees the substring callback=? in the URL.

That solved the second by no longer trying to perform a CORS request from a file:// URL.

That solved the second by no longer trying to perform a CORS request from a file:// URL.

To clarify for other people, here are the simple troubleshooting instructions:

To clarify for other people, here are the simple troubleshooting instructions:

$.get
$.get
dataType
dataType
jsonp
jsonp
  • You're using $.getJSON and included callback=? in the URL.
  • You're using $.getJSON and included callback=? in the URL.
http://
http://
file://
file://
  • Make sure the browser actually supports CORS. (Opera and Internet Explorer are late to the party)
  • Make sure the browser actually supports CORS. (Opera and Internet Explorer are late to the party)

So what is the solution to this?

So what is the solution to this?

Some browsers like chrome allow CORS if started with the parameter --allow-file-access-from-files

Some browsers like chrome allow CORS if started with the parameter --allow-file-access-from-files

callback=?
callback=?
jsonp=?
jsonp=?

@crunkchitis: I'm not sure why callback=? isn't working for you, given that the current jQuery docs still say it should but, if I'm reading them correctly, they also say that anything_else=? will also work.

@crunkchitis: I'm not sure why callback=? isn't working for you, given that the current jQuery docs still say it should but, if I'm reading them correctly, they also say that anything_else=? will also work.

javascript - XmlHttpRequest error: Origin null is not allowed by Acces...

javascript jquery xmlhttprequest cors jsonp
Rectangle 27 395

For the record, as far as I can tell, you had two problems:

The first was solved in a roundabout way by Darin's suggestion to use $.getJSON. It does a little magic to change the request type from its default of "json" to "jsonp" if it sees the substring callback=? in the URL.

That solved the second by no longer trying to perform a CORS request from a file:// URL.

To clarify for other people, here are the simple troubleshooting instructions:

$.get
dataType
jsonp
  • You're using $.getJSON and included callback=? in the URL.
http://
file://
  • Make sure the browser actually supports CORS. (Opera and Internet Explorer are late to the party)

So what is the solution to this?

Some browsers like chrome allow CORS if started with the parameter --allow-file-access-from-files

callback=?
jsonp=?

@crunkchitis: I'm not sure why callback=? isn't working for you, given that the current jQuery docs still say it should but, if I'm reading them correctly, they also say that anything_else=? will also work.

javascript - XmlHttpRequest error: Origin null is not allowed by Acces...

javascript jquery xmlhttprequest cors jsonp
Rectangle 27 395

For the record, as far as I can tell, you had two problems:

The first was solved in a roundabout way by Darin's suggestion to use $.getJSON. It does a little magic to change the request type from its default of "json" to "jsonp" if it sees the substring callback=? in the URL.

That solved the second by no longer trying to perform a CORS request from a file:// URL.

To clarify for other people, here are the simple troubleshooting instructions:

$.get
dataType
jsonp
  • You're using $.getJSON and included callback=? in the URL.
http://
file://
  • Make sure the browser actually supports CORS. (Opera and Internet Explorer are late to the party)

So what is the solution to this?

Some browsers like chrome allow CORS if started with the parameter --allow-file-access-from-files

callback=?
jsonp=?

@crunkchitis: I'm not sure why callback=? isn't working for you, given that the current jQuery docs still say it should but, if I'm reading them correctly, they also say that anything_else=? will also work.

javascript - XmlHttpRequest error: Origin null is not allowed by Acces...

javascript jquery xmlhttprequest cors jsonp
Rectangle 27 395

For the record, as far as I can tell, you had two problems:

The first was solved in a roundabout way by Darin's suggestion to use $.getJSON. It does a little magic to change the request type from its default of "json" to "jsonp" if it sees the substring callback=? in the URL.

That solved the second by no longer trying to perform a CORS request from a file:// URL.

To clarify for other people, here are the simple troubleshooting instructions:

$.get
dataType
jsonp
  • You're using $.getJSON and included callback=? in the URL.
http://
file://
  • Make sure the browser actually supports CORS. (Opera and Internet Explorer are late to the party)

So what is the solution to this?

Some browsers like chrome allow CORS if started with the parameter --allow-file-access-from-files

callback=?
jsonp=?

@crunkchitis: I'm not sure why callback=? isn't working for you, given that the current jQuery docs still say it should but, if I'm reading them correctly, they also say that anything_else=? will also work.

javascript - XmlHttpRequest error: Origin null is not allowed by Acces...

javascript jquery xmlhttprequest cors jsonp
Rectangle 27 4

Origin null is not allowed by Access-Control-Allow-Origin means that you are trying to perform Ajax on a local file. This is forbidden for security reasons. Even if this was not the case, your PHP wouldn't run because PHP is supported by web servers, not web browsers.

You have a web server installed. You have to request your pages through the server, rather than accessing them directly from your file system.

http://localhost/

You will need to move your files so that they are under the server's DocumentRoot (or reconfigure the server so that it can access them from their present location).

file:///C:/Users/Canvas/Documents/Important/Learning/Jquery/TuT97-98/GetHTTPRequest.php
'PHP/reverse.php'
localhost
file://

If you were using an HTTP URI then you wouldn't get a complaint mentioning origin null because your origin wouldn't be null

Origin will be set to null on a 302 as a security measure specifically in HTTP URIs. If you request resource A and that redirects you to Resource B then the browser sets the Origin to null to prevent leaking info about the original request e.g. there could be sensitive data in the url when requesting Resource A.

javascript - Chrome Origin null is not allowed by Access-Control-Allow...

javascript php jquery google-chrome
Rectangle 27 201

Chrome and Safari has a restriction on using ajax with local resources. That's why it's throwing an error like

Chrome and Safari has a restriction on using ajax with local resources. That's why it's throwing an error like

Solution: Use firefox or upload your data to a temporary server. If you still want to use Chrome, start it with the below option;

Solution: Use firefox or upload your data to a temporary server. If you still want to use Chrome, start it with the below option;

--allow-file-access-from-files
--allow-file-access-from-files

More info how to add the above parameter to your Chrome: Right click the Chrome icon on your task bar, right click the Google Chrome on the pop-up window and click properties and add the above parameter inside the Target textbox under Shortcut tab. It will like as below;

More info how to add the above parameter to your Chrome: Right click the Chrome icon on your task bar, right click the Google Chrome on the pop-up window and click properties and add the above parameter inside the Target textbox under Shortcut tab. It will like as below;

C:\Users\XXX_USER\AppData\Local\Google\Chrome\Application\chrome.exe --allow-file-access-from-files
C:\Users\XXX_USER\AppData\Local\Google\Chrome\Application\chrome.exe --allow-file-access-from-files

+1 for giving a simpler solution than "run a web server"

+1 for giving a simpler solution than "run a web server"

In Mac OS X, you can start Chrome with this option by opening a terminal, and typing in: /Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --allow-file-access-from-files & Note the final & is just so you can continue using the Terminal and is not required. NOTE: If you close the terminal, it will close the Chrome window.

In Mac OS X, you can start Chrome with this option by opening a terminal, and typing in: /Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --allow-file-access-from-files & Note the final & is just so you can continue using the Terminal and is not required. NOTE: If you close the terminal, it will close the Chrome window.

I liked the proposition but it did't worked for me.

I liked the proposition but it did't worked for me.

I wonder how many +1s you missed because people have to restart all instances of Chrome, and probably close this window. Came back to give you your due.

Did all that and closed and opened. still no go (Chrome 27.0.1453.116 m on XP)

I'm not being able to add this parameter under Windows 8..., anybody who knows how to do it?...

Did all that and closed and opened. still no go (Chrome 27.0.1453.116 m on XP)

jquery - Origin null is not allowed by Access-Control-Allow-Origin - S...

jquery html
Rectangle 27 201

Chrome and Safari has a restriction on using ajax with local resources. That's why it's throwing an error like

Solution: Use firefox or upload your data to a temporary server. If you still want to use Chrome, start it with the below option;

--allow-file-access-from-files

More info how to add the above parameter to your Chrome: Right click the Chrome icon on your task bar, right click the Google Chrome on the pop-up window and click properties and add the above parameter inside the Target textbox under Shortcut tab. It will like as below;

C:\Users\XXX_USER\AppData\Local\Google\Chrome\Application\chrome.exe --allow-file-access-from-files

+1 for giving a simpler solution than "run a web server"

In Mac OS X, you can start Chrome with this option by opening a terminal, and typing in: /Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --allow-file-access-from-files & Note the final & is just so you can continue using the Terminal and is not required. NOTE: If you close the terminal, it will close the Chrome window.

I liked the proposition but it did't worked for me.

Did all that and closed and opened. still no go (Chrome 27.0.1453.116 m on XP)

I'm not being able to add this parameter under Windows 8..., anybody who knows how to do it?...

jquery - Origin null is not allowed by Access-Control-Allow-Origin - S...

jquery html
Rectangle 27 201

Chrome and Safari has a restriction on using ajax with local resources. That's why it's throwing an error like

Solution: Use firefox or upload your data to a temporary server. If you still want to use Chrome, start it with the below option;

--allow-file-access-from-files

More info how to add the above parameter to your Chrome: Right click the Chrome icon on your task bar, right click the Google Chrome on the pop-up window and click properties and add the above parameter inside the Target textbox under Shortcut tab. It will like as below;

C:\Users\XXX_USER\AppData\Local\Google\Chrome\Application\chrome.exe --allow-file-access-from-files

+1 for giving a simpler solution than "run a web server"

In Mac OS X, you can start Chrome with this option by opening a terminal, and typing in: /Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --allow-file-access-from-files & Note the final & is just so you can continue using the Terminal and is not required. NOTE: If you close the terminal, it will close the Chrome window.

I liked the proposition but it did't worked for me.

Did all that and closed and opened. still no go (Chrome 27.0.1453.116 m on XP)

I'm not being able to add this parameter under Windows 8..., anybody who knows how to do it?...

jquery - Origin null is not allowed by Access-Control-Allow-Origin - S...

jquery html
Rectangle 27 89

You can start it with the option "--allow-file-access-from-files" to tell it you disagree.

Thanks to the ascendant master Nick Craver for this info when I asked essentially the same question some time ago.

Hmm. I try what you say but still get the same error. Maybe I am starting Chrome wrong?

make sure you've closed every instance of chrome that's running, otherwise it won't pick up the change. so just make sure there is no chrome.exe in process list

I was able to open chrome with that flag using the command "/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --allow-file-access-from-files". I'm on OSX 10.7.4 (lion). See superuser.com/questions/157484/

Thanks to chrismarx, this is something that should be pointed out if you are neck deep in dev work. It's simple, but that can really screw up you day if you forget about it.

javascript - "Origin null is not allowed by Access-Control-Allow-Origi...

javascript google-chrome xmlhttprequest cross-domain