1

我是 React Native 的新手,我在玩组件和 http ajax 请求,在 iOs 模拟器上一切都很好,直到我想在 Android 模拟器上进行测试。

这是我的 Http 类:

import 'url-search-params-polyfill';
import axios from 'axios';
import { AsyncStorage } from 'react-native';
import Rx from 'rxjs/Rx';

let _HttpServiceInstance = null;

class HttpService {

  constructor(envStr) {
    console.log('DEFAULT', axios.defaults);
    if(!_HttpServiceInstance){
      this.__proto__.ghtnk = null;
      axios.defaults.baseURL = this.getBaseUrlApi()[envStr || 'DEV'];
      axios.interceptors.response.use(
        (resp) => {
          let ghresp = resp.data || resp;
          ghresp.status = resp.data ? resp.data.status : resp.status;
          return ghresp;
        },
        (err) => {
          if( err.status === 401 ){
              this.removeToken();
              // go to login
          }
          return Promise.reject(err);
        }
      )
      _HttpServiceInstance = this;
    }
    return _HttpServiceInstance;
  }

  getBaseUrlApi = () => {
    return {
      DEV : 'https://dev-api.domainname.com/',
      TEST: 'https://test-api.domainname.com/',
      QA  : 'https://qa-api.domainname.com/',
      LIVE: 'https://api.domainname.com/',
    };
  }

  switchBaseUrlApi(envStr) {
    axios.defaults.baseURL = this.getBaseUrlApi()[envStr];
  }

  getToken = (callback) => {
      let promise = AsyncStorage.getItem('ghtkn');
      if( callback ){
        promise.then(callback, () => { console.log('getToken: ', err) });
      }
      else return promise;
  };

  setToken = (token) => {
    return AsyncStorage.setItem('ghtkn', token);
  };

  removeToken = () => {
    AsyncStorage.removeItem('ghtkn');
  };

  setAuthHeaders = (callback, noNeedToken) => {
    if ( noNeedToken ) {
      callback(); return;
    }
    this.getToken(
      (token) => {
        if (token) {
          axios.defaults.headers.common['Authorization'] = 'Bearer ' + token;
          callback();
        }
        else{ console.log('NO TOKEN PRESENT'); }
      },
      (err) => { console.log('GET TOKEN: ', err); },
    );
  };

  // GET
  get = (url) => {
    let subject = new Rx.Subject();
    this.setAuthHeaders((token) => {
      axios.get(url).then(
        (data) => { subject.next(data); },
        (err) => { console.log('GET: ', err); }
      );
    });
    return subject;
  };

  // POST
  post = (url, payload, noNeedToken) => {
    let subject = new Rx.Subject();
    this.setAuthHeaders(() => {
      axios.post( url, this.setParams(payload)).then(
        (resp) => { subject.next(resp); },
        (err) => {
          console.log('POST ERROR');
          console.log(err.request, Object.keys(err) );
          subject.error(err);
        }
      );
    }, noNeedToken);
    return subject;
  };

  // PUT
  put = (url, payload) => {
    let subject = new Rx.Subject();
    this.setAuthHeaders((token) => {
      axios.put( url, this.setParams(payload)).then(
        (resp) => { subject.next(resp); },
        (err) => { console.log('PUT: ', err); }
      );
    });
    return subject;
  };

  // LOGIN
  login = (user, pw) => {
    return this.post('user/authentication', {username: user, password: pw}, true)
               .do((resp) => { this.setToken(resp.token); })
  };

  setParams = (jsonParams) => {
    let params = new URLSearchParams();
    for(param in jsonParams){
      if( jsonParams.hasOwnProperty(param) ){
        params.append(param, jsonParams[param]);
      }
    }
    return params;
  };

}

export { HttpService };

这是我从发布请求中得到的错误,使用我使用axios.post创建的login()函数

在此处输入图像描述

有谁知道我做错了什么?可能是因为在 Android 模拟器上我应该将它连接到 WiFi 吗?(我不知道怎么做)

笔记:

  • 我正在使用最新版本的 Axios ^0.16.2
  • 我的 AndroidManifest.xml 包含:

    使用权限 android:name="android.permission.INTERNET" 使用权限 android:name="android.permission.ACCESS_NETWORK_STATE" 使用权限 android:name="android.permission.SYSTEM_ALERT_WINDOW"

  • 这些 API 在 VPN 下,因为我写的一切都适用于 iOs 模拟器,但不适用于 Android 模拟器。

4

0 回答 0