0

I am developing a mobile app using Ionic framework. I use $http (POST with custom header) and When I try

ionic serve

in browser(chrome, firefox, ...), i am getting

Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. The response had HTTP status code 405.

error. If I enable CORS plugin in chrome and try the same, i am getting

Response for preflight has invalid HTTP status code 405

error.

But everything works when I install it in my mobile(Android/IOS) using

ionic run android

or

ionic run ios

What is making my browser to restrict $http and why my mobile allows it.? Is Webview different from browser?

for info: - I am using (default) cordova plugins - console, device, splashscreen, statusbar, whitelist, keyboard

please help me here. Without proper understanding, I can not simply build mobile app. Thanks in advance.

EDIT 1

I am using REST API which handles custom Header requests. I am not allowed to modify the API code as of now, because it is running fine for native android app for a long time. The issue is when I am using Ionic and to my surprise it works in my Samsung Tab and IPad (when I run without livereload mode).

All I wanted to know is, what is causing my Browser to restrict and my Mobile device to work?

Isn't WebView in mobile device have the security policy like in Browsers?

Cœur
  • 37,241
  • 25
  • 195
  • 267
Naveen Kumar V
  • 2,559
  • 2
  • 29
  • 43
  • 1
    Have you seen this http://stackoverflow.com/questions/33660712/angularjs-post-fails-response-for-preflight-has-invalid-http-status-code-404 – Marko Oct 25 '16 at 02:17

2 Answers2

1

Why my mobile app works fine but not in browser?

I am using cordova-plugin-whitelist in my Ionic project. It implements a whitelist policy for navigating the application webview. check source

To make browser work, define proxy in my ionic.config.json. But this is just a work around. For production we should make the server to allow it explicitly to whitelist the API call. check source

Naveen Kumar V
  • 2,559
  • 2
  • 29
  • 43
-1

@Naveen - Ionic wrote a blog paper about the differences between browser and in-app handling of http origin header: http://blog.ionicframework.com/handling-cors-issues-in-ionic

Mathieu Naon
  • 1
  • 1
  • 2