ionic3 http failure response for (unknown url): 0 unknown error

1、背景

    版本：3.20.0

    本地开发环境使用代理连接后台

    ionic.config.json中的配置

{
  "name": "app-video-ai",
  "app_id": "",
  "type": "ionic-angular",
  "integrations": {
    "cordova": {}
  },
  "proxies": [
    {
      "path": "/upms",
      "proxyUrl": "http://192.168.1.80:8082/upms"
    },
    {
      "path": "/api",
      "proxyUrl": "http://192.168.1.80:8889/api"
    }
  ]
}

    表现：使用pc端和后台调试没有问题，但是生成app，通过真机访问后台一直报错

    http failure response for (unknown url): 0 unknown error

2、报错原因

    在pc端可以通过代理和后台进行调试，但是手机端是没法使用代理的，只能通过直连的形式连接后台服务器。

3、解决思路

    在封装的http服务中处理，真机环境下直连服务器

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { HttpHeaders } from '@angular/common/http';
/*
  Generated class for the HttpSerProvider provider.

  See https://angular.io/guide/dependency-injection for more info on providers
  and Angular DI.
*/
@Injectable()
export class HttpSerProvider {

  constructor(public http: HttpClient) {
    console.log('Hello HttpSerProvider Provider');
  }
  upmsUrl = 'http://192.168.1.80:8082';
  apiUrl = 'http://192.168.1.80:8889';
  public post(url: string, params: any = null, successCallback, errorCallback): any {
    // 此处使用的post模式为非严格模式，如果要使用严格模式，请把参数放在第二个位置 覆盖null
    // 正式发布不能使用代理，此处要做个处理
    url = this.getUrl(url);
    return this.http.post(url, null, {
      params: params,
      headers: this.getHeaders(), // 添加token信息
    }).subscribe((res: any) => {
      this.responseSuccess(res, function (msg) {
        if (successCallback) {
          successCallback(res, msg);
        }
      });
    }, err => {
      if (errorCallback) {
        errorCallback(err);
      }
    });
  }

  /**
   * 处理正式发布环境导致的路径问题，请求出错
   * @param url
   * @returns {any}
   */
  getUrl(url) {
    // TODO 开发环境这段可以先注释掉
    let realUrl;
    if (url.startsWith('upms')) {
      realUrl = this.upmsUrl + '/' + url;
    } else if(url.startsWith('/upms')) {
      realUrl = this.upmsUrl + url;
    } else if(url.startsWith('api')) {
      realUrl = this.apiUrl + '/' + url;
    } else {
      realUrl = this.apiUrl + url
    }
    url = realUrl;
    return url;
  }
  // get数据
  public get(url: string, params?: any): any {
    const token = this.getToken();
    url = this.getUrl(url);
    return this.http.get(url, {
      headers: this.getHeaders(), // 添加token信息
      params: params
    });
  }
  // 删除相关请求
  public delete(url: string, params?: any): any {
    url = this.getUrl(url);
    return this.http.delete(url, {
      headers: this.getHeaders(), // 添加token信息
      params: params
    });
  }

  /**
   * 头部信息获取，主要用于处理token
   */
  private getHeaders() {
    const token = this.getToken();
    const headers = {'Access-Control-Allow-Origin': '*','Access-Control-Allow-Methods': 'GET,POST,OPTIONS,DELETE,PUT'};
    if (token) {
      headers['token'] = token;
    }
    return new HttpHeaders(headers);
  }
  /**
   * 处理响应的事件
   * @param res
   * @param {Function} error
   */
  private responseSuccess(res: any, callback) {
    if (res.code !== '0') { // 失败
      if (res.msg) {
        callback({code: res.code, msg: res.msg});
      } else {
        const data = res.data;
        let errorMsg = '操作失败！';
        data.map(i => {
          errorMsg = i.errorMsg + '\n';
        });
        callback({code: res.code, msg: errorMsg});
      }
    } else {
      callback(res);
    }
  }

  /**
   * 处理请求失败事件
   * @param url
   * @param err
   */
  private requestFailed(url: string, err) {
    let msg = '请求发生异常';
    const status = err.status;
    if (status === 0) {
      msg = '请求失败，请求响应出错';
    } else if (status === 404) {
      msg = '请求失败，未找到请求地址';
    } else if (status === 500) {
      msg = '请求失败，服务器出错，请稍后再试';
    } else {
      msg = '未知错误，请检查网络';
    }
    return msg;

  }

  /**
   * 使用本地缓存的方式来获取token信息
   */
  getToken() {
    return window.localStorage.getItem('app-video-ai-token');
  }

  /**
   * 将token信息保存到本地缓存中 用缓存的形式实现token验证
   * @param token
   */
  setToken(token) {
    // 目前只解析token字段，缓存先只存该字段
    //  + token.name + token.email + token.avatar + token.id + token.time
    // JSON.stringify(token)
    window.localStorage.setItem('app-video-ai-token',
      token.token);
  }

  /**
   * 清理token
   */
  clearToken() {
    window.localStorage.setItem('app-video-ai-token', null);
  }
  // 监听初次加载事件入口
  load() {
    if (this.getToken()) {
    //  验证token信息，验证通过继续处于登录状态
    } else {
      // 正常去登录页面

    }
  }
}