Ionic 3 Ответ со статусом: 0 для URL: null

У меня есть приложение Ionic 3. Недавно я добавил платформу iOS.

Когда я запускаю его на iOS (эмулятор и устройство), все запросы к серверу с заголовками завершаются ошибкой "Ответ со статусом: 0 для URL: null". На Android эти запросы работают нормально.

Если я делаю запросы без заголовков, я получаю ожидаемый ответ от сервера.

Я знаю, что проблема связана с WKWebView и CORS. На сервере правильно настроен CORS. Я делаю запросы с помощью модуля @angular/http.

Давайте посмотрим код.

Это мой провайдер для выполнения запросов к серверу:

import { Injectable } from '@angular/core';
import { Content } from 'ionic-angular';
import { Http, Headers, RequestOptions, URLSearchParams } from '@angular/http';
import { HTTP } from '@ionic-native/http';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/map';
import { Globalization } from '@ionic-native/globalization';

import { Globals } from '../providers/globals';

...

/// Here we have one example Request (it's inside a method)

/// Here I create the URL for the request
let url = this.server_url + this.server_functions.doSearch;

/// Now I create the Headers for the Request
let headers = new Headers();
/// As You can see, I have tried to pass diferent headers to server
    // headers.append("Access-Control-Allow-Origin","*");
    // headers.append("Origin", "https://localhost:8080");
    // headers.append("Access-Control-Allow-Methods","POST, GET, OPTIONS, PUT");
    // headers.append("Accept","application/json");
    // headers.append("Content-Type","application/json; charset=utf-8");

/// If the user is logged in I have to send this headers to server
if ( !this.globals.guestMode ) {
    headers.append("TokenAuth", this.globals.getLogRegData()["TokenAuth"]);
    headers.append("IdAuth", this.globals.getLogRegData()["IdAuth"]);
}

/// And here we start the GET Request
this.http.get( url, { headers: headers } ).map(res => res.json()).subscribe(
    data => {
        // console.log( JSON.stringify(data) );
        callback( data );
    },
    err => {
        console.log("ELOL: "+err);
    }
);

С другой стороны, я решил попробовать модуль @ionic-native/http (как вы можете видеть в импорте), чтобы избежать проблем с WKWebView и CORS, но когда я делаю запрос с ним, я получаю эту ошибку:

WARN: Native: tried calling HTTP.get, but the HTTP plugin is not installed.
WARN: Install the HTTP plugin: 'ionic cordova plugin add cordova-plugin-advanced-http'

Вот как я делаю запрос с родным плагином:

this.httpnative.get(url, {}, {})
    .then(data => {

        console.log(data.status);
        console.log(data.data); // data received by server
        console.log(data.headers);

    })
    .catch(error => {

        console.log(error.status);
        console.log(error.error); // error message as string
        console.log(error.headers);

    });

Это фрагмент моего app.module.ts:

import { HttpModule } from '@angular/http';
import { HTTP } from '@ionic-native/http';
...
@NgModule({
...
 imports: [
...
    HttpModule,
    HTTP,
...

  ],
})

Я надеюсь, что кто-то может пролить на это свет, потому что я так потерялся на путях Ionic.

Благодарю вас.


person testerino    schedule 08.03.2018    source источник


Ответы (2)


Чтобы избежать проблем с CORS, особенно в iOS, вы должны использовать плагин @ionic-native/http, который на самом деле является расширенным HTTP-плагином для вызова API.

Выполните следующие шаги, чтобы использовать этот плагин

Шаг 1. Добавьте нативный плагин Http.

$ ionic cordova plugin add cordova-plugin-advanced-http
$ npm install --save @ionic-native/http

Ссылка для установки: HTTP

Шаг 2. Импортируйте собственный подключаемый модуль HTTP в свой файл, где вы хотите вызвать API.

import { HTTP, HTTPResponse } from '@ionic-native/http';

Шаг 3. Как использовать этот плагин для вызова API?

constructor(public httpPlugin: HTTP) {

  }

//Set header like this
this.httpPlugin.setHeader("content-type", "application/json");

//Call API 
this.httpPlugin.get(this.url, {}, {}).then((response) => {
    //Got your server response
}).catch(error => {
    //Got error 
});

Надеюсь, что это поможет вам.

person CodeChanger    schedule 08.03.2018
comment
Ага, это я пробовал. Как я уже сказал, я установил плагин Cordova и собственный модуль http. Но когда код запроса выполняется, я получаю сообщение об ошибке WARN: Native: пытался вызвать HTTP.get, но плагин HTTP не установлен. ПРЕДУПРЕЖДЕНИЕ: установите плагин HTTP: «плагин ionic cordova add cordova-plugin-advanced-http» - person testerino; 08.03.2018
comment
Вы правильно установили этот плагин, как я упоминаю в своем ответе? - person CodeChanger; 08.03.2018
comment
Я думаю, что он не установлен должным образом, поэтому попробуйте один раз удалить его и добавить снова. - person CodeChanger; 08.03.2018
comment
Теперь это сработало! Но это была 3-я попытка... Сейчас попробую делать запросы с нативным http и надеюсь получится, ты :) - person testerino; 08.03.2018

У меня такая же проблема в Android, остальные API не работают в эмуляторе или устройстве Android и выдают ошибку: Ответ с 0 для URL: null. и, наконец, я получил решение о том, что существует проблема с версией Android для платформы Cordova, если есть версия Android для Cordova 6.3, то она работает правильно, но если есть версия Android для Cordova 7.0 или 7.1.1, то она не работает для меня.

Итак, я думаю, что в ios вы должны проверить версию своей платформы ios, а затем попробовать еще раз. Вы можете проверить версию iOS или Android с помощью команды cli. ионная информация

Также проверьте, установлены ли у вас все плагины Cordova. Если кого-то не хватает то установите вручную и проверьте еще раз. Вы можете проверить свои плагины Cordova с помощью команды cli. плагин кордовы -ls

Я думаю, что это полезно для вас.

Спасибо

person hetuka kodekar    schedule 14.08.2018
comment
мне нужно собрать приложение с Android версии 7.1.1. что мне теперь делать посоветуйте.... - person Venka Tesh user5397700; 09.12.2018