1

I have a JQuery Mobile app. This app needs to hit a remote web service. When I run the app from my local file system, the app loads fine. But then, when I click a button, I try to interact with the web service. When I attempt to hit the web service, I see an error in the console that says:

XMLHttpRequest cannot load https://www.mydomain.com/myService/myAction. Origin null is not allowed by Access-Control-Allow-Origin

I try to hit the service with the following code:

var vm = getParameters();
$.ajax({
  url: https://www.mydomain.com/myService/myAction,
  type: "POST",
  data: JSON.stringify(vm),
  contentType: "application/json",
  success: action_Succeeded,
  error: action_Failed
});

What am I doing wrong? I tried everything in this post without any luck: XmlHttpRequest error: Origin null is not allowed by Access-Control-Allow-Origin.

My app works when I run it via Visual Studio. My hunch is that its running with in a context of a web server at that point. However, I want to deploy this via PhoneGap. Because of that, running within the context of a web server is out of the question. That's why I figured if I ran it via my local file system and everything worked, I should be good. What am I doing wrong?

Thank you so much!

Community
  • 1
  • 1
JavaScript Developer
  • 3,968
  • 11
  • 41
  • 46

1 Answers1

1

Check your config.xml file (if you're using the Phonegap Build service - otherwise check the .plist file for iOS, AndroidManifest.xml for Android..), and add this line:

<access origin="*" />

If this works, then you can try to set a more restrictive access rule like:

<access origin="https://mydomain.com" subdomains="true" />

And on your server side, you'll need to return this http header:

Access-Control-Allow-Origin: *
chrisben
  • 955
  • 8
  • 16
  • Thank you SO much for your response. I'm still a little confused. Without the stuff you mentioned above, the app works in my dev env. When I push it to my testing environment that I use over the web it works. however, when I have the local files attempting to hit the web services hosted in the testing environment, it doesn't work. Can you please explain why? Thank you so much. – JavaScript Developer May 26 '12 at 11:04
  • What are your dev/test environments? is that running your page from or a desktop browser? what do you mean by 'local files'? The above configuration is needed when your page is within the phonegap container (you run it as an app in Android, iOS, ...) – chrisben May 26 '12 at 11:13
  • On the first page of my app, I hit a web service. This worked fine in my DEV env, which runs on the DEV web server Visual Studio launches. I then promoted the entire project to run in our TESTING web server (an IIS 7). The app works fines there. Then, when I tried to hit the service via the phone emulator, it didn't work. Because PhoneGap is loaded as a local file (http://jquerymobile.com/demos/1.1.0/docs/pages/phonegap.html), I decided to just open the index.html file from my local machine in Chrome. I ensured it was pointing at the TEST service url. However, I still get the error mentioned. – JavaScript Developer May 26 '12 at 11:17
  • So it doesn't work for you with your web app running in phonegap (emulator) AND when running in a desktop browser (as a local file), right? Do you get phonegap/local browser to work with your DEV environment of the server? – chrisben May 26 '12 at 11:21
  • You are right, it doesn't work for me in the phonegap emulator. Nor does it work when running in a desktop browser as a local file. I have not tried running phone gap in my DEV env. Correct me if I'm wrong but it seems like it should work when my local file is running in my desktop browser. – JavaScript Developer May 26 '12 at 11:27
  • Ok so the problem is not with the client, it's rather with your server. With your DEV env server you say the local file running on your desktop browser works, but not then TEST/PROD env one, right? -once it's all clearer I might be able to give you some help- – chrisben May 26 '12 at 12:16
  • let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/11774/discussion-between-chrisben-and-javascript-developer) – chrisben May 26 '12 at 12:21