iOS Https GET POST issue return 0

#1

Hello all,

I am new to Ionic. I am facing the problem when calling the API (https), it returns 0. After doing some research, I think it’s related to CORS.

The API requires to send Bearer token authorization in the header, thus, it causes the failure.

The API return success in both android phone and web browser, however, in the iOS device, it return 0, I had tried using ionic v4, ionic-native, HTTP, XMLHttpRequest and so on. All are working well in both android phone and web browser except iOS device. I had whitelisted the IP address, adding these kinds of header

headers.append('Access-Control-Allow-Origin' , '*');
headers.append('Access-Control-Allow-Methods', 'POST, GET, OPTIONS, PUT');
headers.append('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept');
headers.append('withCredentials', 'true');
headers.append('Access-Control-Allow-Credentials', 'true'); 
headers.append('Accept','application/json');
headers.append('Content-Type', 'application/json');

no luck at all. Spending two days on this, no result I can get. Anyone can provide a suggestion?

Thanks.

#2

Hi @dmlkl :wave:

The Access-Control-Allow-* headers are designed to be returned by the server, so sending them from the app doesn’t do anything, as you have experienced yourself.

Check out this new section in the Ionic docs about how does CORS work, and common errors and solutions: https://ionicframework.com/docs/faq/cors

I hope it helps!
Rodrigo

#3

Hello,

Thanks for reply. Yes, I did test the solution provided in the documentation. But still, no one working. Previously, the API won’t work on Android device, after configure the server, changing the CORS then work on Android device. Now only left iOS device keep return 0

#4
  • What is the origin of your app on iOS?
  • What is the value of the Access-Control-Allow-Origin returned from the API?
  • Do they match?
#5

Hello,

How can I check on the iOS device? I am using devapp (didnt have a mac book). On the browser, it worked (iPhone return status 0 and browser return 200), so I not really take note about the Access-Control-Allow-Origin. Can guide me how to check?

Thanks.

#6

Hmm… I have no idea which origin does the DevApp use :sweat_smile:

Anyway, what is the value of the Access-Control-Allow-Origin returned from the API? You can check this value from Postman, curl -v YOUR_API_URL or similar.

Best,
Rodrigo

#7

Hello,

Thanks for your information. In the end, the problem solved. Now I can get the data for both iOS and android device. But, another problem raised, for loop an HTTP request.

  • requestService.GetTelemetryData is the HTTP request.
GetGeneralInfo(){

for (let i = 0; i < deviceData.length; i++) {
conso.log("Loop Start")
            this.requestService.GetTelemetryData(loginAcc['token'], deviceData[i]["id"]["id"]).then((telemetryData) => {

              console.log("After GetTelemetryData()");
              let status = JSON.parse(telemetryData['status']);

              if (status == 401) {
                console.log("Token Expired...")

                this.requestService.RefreshToken(loginAcc['token'], loginAcc['refreshToken']).then(refreshTokenResponse => {

                 //i need to terminated the for loop and recall this method with new token
                  this.GetGeneralInfo();
                });

              }
              else if (status == 200) {
                console.log("Token is valid and data is given....")
                let data = JSON.parse(telemetryData['data']);
              }
            })
          }
}


Somehow the code will continue the for loop without waiting for the HTTP request finish. Like above, let say the device data length is 2, for loop will print “Loop start” twice then only print "After GetTelemetryData()"

Currently

“Loop Start”
“Loop Start”
“After GetTelemetryData()”
“After GetTelemetryData()”

Expectation

“Loop Start”
“After GetTelemetryData()”
“Loop Start”
“After GetTelemetryData()”

Can guide me on this?

#8

I moved the reply to the other thread you created: For loop an HTTP request logical error