IOS Build CORS Issue

Ionic Framework ionic-v3
1

Hi There,
i am building ios and android app on ionic2 .RC2
Your system information:

Cordova CLI: 6.4.0
Ionic Framework Version: 2.0.0-rc.2
Ionic CLI Version: 2.1.4
Ionic App Lib Version: 2.1.2
Ionic App Scripts Version: 0.0.39
ios-deploy version: 1.9.0
ios-sim version: 5.0.10
OS: Mac OS X Sierra
Node Version: v7.0.0
Xcode version: Xcode 8.1 Build version 8B62

however i have an issue with ios api request, it’s sends the origin=null value this causes a CORS issue
Failed to load resource: the server responded with a status of 405 (Method Not Allowed)
Failed to load resource: Preflight response is not successful
XMLHttpRequest cannot load ‘API URL’. Preflight response is not successful

i dont have access on backend api’s however the android build it sends the origin=file:// which in this case i dont have any issue. i will post the config.xml settings and request header for both device below

IOS REQUEST
OPTIONS http://10.10.1.152/DesktopModules/FYAuthentication/API/UserHandler/Login HTTP/1.1
Host: 10.10.1.152
Origin: null
Access-Control-Request-Method: POST
Connection: keep-alive
Access-Control-Request-Headers: content-type, origin, loginattempt
Connection: keep-alive
Accept: /
User-Agent: Mozilla/5.0 (iPhone; CPU iPhone OS 10_0_1 like Mac OS X) AppleWebKit/602.1.50 (KHTML, like Gecko) Mobile/14A403
Accept-Language: en-us
Accept-Encoding: gzip, deflate
Content-Length: 0

ANDROID REQUEST
POST http://10.10.1.152/DesktopModules/FYAuthentication/API/UserHandler/Login HTTP/1.1
Host: 10.10.1.152
Connection: keep-alive
Content-Length: 76
Origin: file://
loginattempt: 1
User-Agent: Mozilla/5.0 (Linux; Android 5.0; SM-G900P Build/LRX21T; wv) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/54.0.2840.85 Mobile Safari/537.36
content-type: application/json
Accept: /
Accept-Encoding: gzip, deflate
Accept-Language: en-US
X-Requested-With: com.di.testapp

{
“username”: “”,
“password”: “”,
“culture”: “en”
}

CONFIG.XML

  <access origin="*" />
    <allow-intent href="http://*/*" />
    <allow-intent href="https://*/*" />
    <allow-intent href="tel:*" />
    <allow-intent href="sms:*" />
    <allow-intent href="mailto:*" />
    <allow-intent href="geo:*" />
    <allow-navigation href="http://*/*" />
    <allow-navigation href="tel:*" />
    <allow-navigation href="mailto:*" />
    <allow-navigation href="http://10.10.1.152" />
    <allow-navigation href="https://test.ctpe.net" />
    <allow-navigation href="https://ctpe.net" />

INDEX.HTML
<meta http-equiv="Content-Security-Policy" content="default-src * 'unsafe-eval' 'unsafe-inline'; img-src 'self' data:;">

Your help is much appreciated

2

Do you use WkWebView?

3 
<feature name="CDVWKWebViewEngine">
    <param name="ios-package" value="CDVWKWebViewEngine"/>
  </feature>

<plugin name="cordova-plugin-wkwebview-engine" spec="https://github.com/driftyco/cordova-plugin-wkwebview-engine.git"/>

this is what listed in conf

4

Well then seems you use WkWebView, therefore welcome to the club “I’ve got problem with CORS and WKWebView” (and that is the reason why it works on Android and not on iPhone)

Not your plugin, but the WkWebView Ionic plugin have got a relevant issue about that:

You could try to remove WKWebView and it most probably gonna work.
Otherwise, in the issue listed above, some guys found work around to solve the problem.

If you find something I would love to hear about it, I never till today found a way :frowning:

1 Like
5

Till now nothing, i tried to override the origin header but ofc this is not allowed, WE would like to hear from Ionic support team about this issue and plugin !

6

Have a look at the issue in GitHub, the Ionic team gave some answers

7

nothing useful i had to remove the plugin as you said eventually :frowning:

8

I think there is one solution interesting in the post, the one provided by @Bouzmine
He achieved to solve CORS and WkWebView. I didn’t had time yet to try.

9

I was running with the same issue - But i found a workaround for this problem here - And It’s works !!! :sunglasses:
change default view

2 Likes
10

Finally! I solved the issue using WkWebView on IOS Simulator. You should add the following lines to config.xml in your project;

<platform name="ios">
        <access origin="http://localhost:8080" />
        <allow-navigation href="http://localhost:8080/*" />
</platform>
11

really is it working? let me check.

12

No. It is not working…

1 Like
13

No. It is not working…

14

it is not working. better use ionic native http plugin