Calling api not working on ios real device Ionic 5

khaled_veto · August 16, 2020, 9:32pm

Hi , i’m using ionic 5 , i my methods are working fine on android and browser while i tried it on ios it didn’t worked , i tried to use capacitor and also http native plugin nothing working i got errors like : {“headers”:{“normalizedNames”:{},“lazyUpdate”:null,“headers”:{}},“status”:0,“statusText”:"Unknown Error"
[error] - ERROR {“line”:4349,“column”:73,“sourceURL”:“capacitor://localhost/main-es2015.js”}

my package.json

{
  "name": "boyot",
  "version": "0.0.1",
  "author": "Ionic Framework",
  "homepage": "https://ionicframework.com/",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "resources": "cordova-res ios && node scripts/resources.js",
    "resource": "capacitor-resources -p ios"
  },
  "private": true,
  "dependencies": {
    "@agm/core": "1.0.0",
    "@agm/drawing": "^1.1.0",
    "@agm/js-marker-clusterer": "^1.1.0",
    "@angular/animations": "^10.0.9",
    "@angular/cdk": "^9.2.4",
    "@angular/common": "~9.1.6",
    "@angular/core": "~9.1.6",
    "@angular/forms": "~9.1.6",
    "@angular/material": "^10.1.3",
    "@angular/platform-browser": "~9.1.6",
    "@angular/platform-browser-dynamic": "~9.1.6",
    "@angular/router": "~9.1.6",
    "@capacitor/core": "2.4.0",
    "@capacitor/ios": "^2.4.0",
    "@ionic-native/call-number": "^5.27.0",
    "@ionic-native/camera": "^5.27.0",
    "@ionic-native/core": "^5.0.7",
    "@ionic-native/geolocation": "^5.27.0",
    "@ionic-native/globalization": "^5.27.0",
    "@ionic-native/http": "^5.28.0",
    "@ionic-native/image-picker": "^5.27.0",
    "@ionic-native/launch-navigator": "^5.27.0",
    "@ionic-native/location-accuracy": "^5.27.0",
    "@ionic-native/network": "^5.27.0",
    "@ionic-native/photo-viewer": "^5.27.0",
    "@ionic-native/social-sharing": "^5.27.0",
    "@ionic-native/splash-screen": "^5.0.0",
    "@ionic-native/status-bar": "^5.0.0",
    "@ionic-native/youtube-video-player": "^5.27.0",
    "@ionic/angular": "^5.0.0",
    "@ionic/storage": "^2.3.0",
    "@ngx-translate/core": "11.0.1",
    "@ngx-translate/http-loader": "4.0.0",
    "@types/hammerjs": "^2.0.36",
    "agm-overlays": "^2.0.0",
    "capacitor-resources": "^2.0.3",
    "cordova-ios": "5.1.1",
    "cordova-plugin-advanced-http": "^3.0.0",
    "cordova-plugin-device": "^2.0.3",
    "cordova-plugin-file": "^6.0.2",
    "cordova-plugin-ionic-keyboard": "^2.2.0",
    "cordova-plugin-ionic-webview": "^5.0.0",
    "cordova-plugin-network-information": "^2.0.2",
    "cordova-plugin-splashscreen": "^5.0.4",
    "cordova-plugin-statusbar": "^2.4.3",
    "cordova-plugin-whitelist": "^1.3.4",
    "hammerjs": "^2.0.8",
    "ionic-pullup": "^4.0.0-beta.6",
    "js-marker-clusterer": "^1.0.0",
    "lodash": "^4.17.15",
    "moment": "^2.27.0",
    "ngx-bootstrap": "^5.6.1",
    "ngx-input-file": "^8.0.1",
    "ngx-progressive-image-loader": "^4.0.0",
    "ngx-tags-input": "^2.0.1",
    "pannellum": "^2.5.6",
    "rxjs": "~6.5.1",
    "tslib": "^1.10.0",
    "zone.js": "~0.10.2"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.901.5",
    "@angular/cli": "~9.1.5",
    "@angular/compiler": "~9.1.6",
    "@angular/compiler-cli": "~9.1.6",
    "@angular/language-service": "~9.1.6",
    "@capacitor/cli": "2.4.0",
    "@ionic/angular-toolkit": "^2.1.1",
    "@types/jasmine": "~3.5.0",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "^12.11.1",
    "codelyzer": "^5.1.2",
    "jasmine-core": "~3.5.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~5.0.0",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage-istanbul-reporter": "~2.1.0",
    "karma-jasmine": "~3.0.1",
    "karma-jasmine-html-reporter": "^1.4.2",
    "protractor": "~5.4.3",
    "ts-node": "~8.3.0",
    "tslint": "~6.1.0",
    "typescript": "~3.8.3"
  },
  "description": "An Ionic project",
  "cordova": {
    "plugins": {
      "cordova-plugin-whitelist": {},
      "cordova-plugin-statusbar": {},
      "cordova-plugin-device": {},
      "cordova-plugin-splashscreen": {},
      "cordova-plugin-ionic-keyboard": {},
      "cordova-plugin-network-information": {},
      "cordova-plugin-advanced-http": {},
      "cordova-plugin-ionic-webview": {}
    },
    "platforms": [
      "ios"
    ]
  }
}

my service.ts

import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Observable, of } from 'rxjs';
import { catchError, tap } from 'rxjs/operators';
import { HTTP } from '@ionic-native/http/ngx';
import { from } from 'rxjs';

export class User {
  id: string;
  name: string;
  email: string;
  password: number;
  auth_token: string;
}
@Injectable({
  providedIn: 'root',
})
export class RemoteDataService {
  base_path = 'https://####/public/index.php/';
  dev_path = 'https://####/public_html/public/index.php/';
  httpHeader = {
    headers: new HttpHeaders({ 'Content-Type': 'application/json' }),
  };
  url = 'assets/data/';
  constructor(public http: HttpClient, public nativeHttp: HTTP) {}

  POST(slug: any, user: any): Observable<any> {
    // return from(
    //   this.nativeHttp
    //     .sendRequest(this.dev_path + slug, {
    //       method: 'post',
    //       data: user,
    //       headers: {
    //         'Access-Control-Allow-Origin': '*',
    //         'Content-Type': 'application/json',
    //       },
    //       timeout: 5000,
    //     })
    //     .then(
    //       res => {
    //         console.log('data-->', JSON.parse(res.data));
    //         alert(JSON.stringify(res));
    //         return JSON.parse(res.data);
    //       },
    //       res => console.log('result/' + slug, res)
    //     )
    // );
    return this.http
      .post<User>(this.dev_path + slug, user, this.httpHeader)
      .pipe(catchError(this.handleError<User>('Add user')));
  }

dcarrask · December 23, 2020, 11:16pm

Hey @khaled_veto it happen to me the same.

Did you find the solution? Can you share how to fix it, please?

Thanks!

rapropos · December 23, 2020, 11:37pm

Are you using https endpoints? If not, does the problem persist when doing so?
Are you absolutely positively certain that the server is providing a proper SSL certificate? If you aren’t sure, please post the actual URL you are using (no redaction, or else nobody else can help you check)

dcarrask · December 24, 2020, 11:09am

Hi @rapropos,

Yes, I’m using https for the server. The server is returning rightly the data sometimes. For example, when the app is loaded the first I do is to call the https://API_URL/up… and I get information, it means there is communication with the server and the https is running (for this endpoint and for many more).

But when I call a service from some page the call is supposedly done, but I get the response… and I see the logs of my hosting and seems like nobody called any service.

Conclusion is like the app is caching, I don’t know if I should include some headers for some calls… I don’t understand.

rapropos · December 24, 2020, 5:27pm

Can you provide public access to enough code to reproduce the problem?

khaled_veto · December 25, 2020, 1:37pm

I solved server side

This configuration doesn’t work

Header Set Access-Control-Allow-Headers "*"

I need to set a list of header fields allowed

Header Set Access-Control-Allow-Headers "Content-Type,Access-Control-Allow-Headers,lang"

sshar · May 24, 2021, 4:39am

It did not work, do you have any other solution, please let us know.

rapropos · May 24, 2021, 7:06pm

If you’re going to necromance an old thread like this, here are some things you can do to drastically improve the odds of getting useful assistance:

Explain precisely why you chose this thread. Describe each specific aspect of your situation that you believe is identical to that which OP reported. Provide as much fine detail as you can:

BAD: my app doesn’t run on iOS either
GOOD: I am using HttpClient and also getting inexplicable errors with status code of 0 that only present on device. The code works in a desktop browser.

Take the time to go through all suggestions and information requests that were presented to OP.

For example, answer the previously posted questions about https endpoints and server SSL certs.

Explain in as much detail as possible what happened when you tried things that were presented as solutions by others reporting similar problems.

For example, @khaled_veto reported having to change some server parameters. What happens when you do what they did? If that was impossible for some reason, explain the reason.

You probably see a thread here - specificity, not vague generalities. “It didn’t work”, “any other solutions?”, “me too” do not give anybody much of anything to work with.

Help us help you.

Art_13 · May 30, 2021, 5:45am

Try to add header using http set header method
this.nativeHttp.setHeader(‘Content-Type’,‘application/json’);

Topic		Replies	Views
Http request does not work on ios 15 Ionic Framework	10	7186	July 8, 2021
Issues making https calls in ios Ionic Vue	8	1800	November 13, 2023
Ionic request doesn't work only on IOS Ionic Angular	9	953	October 25, 2024
Ionic 5 Http failure response for (unknown url): 0 Unknown Error in ionic capacitor. when calling api on simulator Ionic Framework	2	5684	June 9, 2022
Unknown error when running Capacitor App on iOS emulator Ionic Angular	0	838	December 11, 2021

Calling api not working on ios real device Ionic 5

Related topics