Axios (в React-native), не вызывающий сервер в localhost

Я создаю очень легкое приложение api и native-native. Сервер работает хорошо (тестируется с помощью PostMan), но приложение не вызывает сервер. Он блокирует, когда axios должен отправить запрос на отправку (см. Ниже).

Я в отчаянии:-( Потерять слишком много времени в нем. Пожалуйста, если вы можете мне помочь...

Вот мой код LogIn. Он отправляет создателя действия (работает с redux) с указанием электронной почты и пароля:

...
const LogIn = React.createClass({
  submitLogin() {
    // log in the server
    if (this.props.email !== '' && this.props.psw !== '') {
      if (this.props.valid === true) {
        this.props.dispatch(logIn(this.props.email, this.props.psw));
      } else {
        this.props.dispatch(errorTyping());
      }
    }
  },
...

электронная почта и пароль извлекаются и отправляются создателю действия:

import axios from 'axios';
import { SIGNIN_URL, SIGNUP_URL } from '../api';
// import { addAlert } from './alerts';
exports.logIn = (email, password) => {
  return function (dispatch) {    
    console.log(email);
    console.log(password);
    console.log(SIGNIN_URL);
    return axios.post(SIGNIN_URL, { email, password })
    .then(
      (response) => {
        console.log(response);
        const { token, userId } = response.data;
        dispatch(authUser(userId));
      }
    )
    .catch(
      (error) => {
        console.log('Could not log in');
      }
    );
  };
};
const authUser = (userId) => {
 return {
 type: 'AUTH_USER',
 userId
 };
};
...

Три консоли console.log() перед аксиомами показывают данные правильно. SIGNIN_URL точно так же я использую в почтальоне.... но аксиомы не звонят.

Просто, чтобы дать все карты, это мой магазин:

import thunk from 'redux-thunk';
import { createStore, compose, applyMiddleware } from 'redux';
import { AsyncStorage } from 'react-native';
import { persistStore, autoRehydrate } from 'redux-persist';
import reducer from '../reducer';
const defaultState = {};
exports.configureStore = (initialState = defaultState) => {
 const store = createStore(reducer, initialState, compose(
 applyMiddleware(thunk),
 autoRehydrate()
 ));
 persistStore(store, { storage: AsyncStorage });
 return store;
};

В отладчике нет сообщения об ошибке (но тот, который указан при вызове axios ( "Не удалось войти в систему" )

Я на окнах 10, с:

"axios": "^0.15.3",
"react": "15.4.2",
"react-native": "0.38.0",
"redux": "^3.6.0"

Вызов завершается неудачно даже при подготовке простого вызова GET, и сервер должен вернуть простое сообщение (проверено с почтовым ящиком и браузером):

exports.test = () => {
  return function () {
    return axios.get('https://localhost:3000/v1/test')
    .then(
      (response) => {
        console.log(response);
      }
    )
    .catch(
      (error) => {
        console.log('error');
      }
    );
  };
};

Наконец, я также попытался изменить вызов, добавив заголовок как следующий, потому что api закодирован для принятия json:

const head = {
  headers: { 'Content-Type': 'application/json' }
};

exports.test = () => {
  return function () {
    return axios.get('https://api.github.com/users/massimopibiri', head)
    .then(
      (response) => {
        console.log(response);
      }
    )
    .catch(
      (error) => {
        console.log('error');
      }
    );
  };
};

но даже это не сработало. надеюсь кто-то может мне помочь. Других подобных проблем не было.

Ответ 1

Решение поступило из другого источника, но я отправляю его здесь, чтобы помочь другим, которые ищут ту же проблему. В основном я использовал Android AVD (эмулятор) для создания приложения. Но эмулятор на самом деле является другой машиной, и почему он не может вызвать localhost.

Чтобы решить проблему, мне пришлось отправить запрос следующим образом:

https://10.0.2.2:3000/v1/test

вместо:

https://localhost:3000/v1/test

Ответ 2

если вы используете mac, это решение сработало для меня. Я использую React Native с Android Simulator ADV. Nexus Api 27

            axios.get('http://192.168.1.21:8686/api/v1/test')
            .then(response => console.log(response))
            .catch(err => console.log(err));

где ip 192.168.1.21 - из system preferences > Network > Advanced > TCP/IP > IPv4 Address

Я также тестировал axios.get('http://10.0.2.2:8686/bec/api/v1/test') где 10.0.2.2 является 10.0.2.2 с виртуальной машины на компьютер, но не работал.

Ответ 3

Ваш эмулятор - это отдельное устройство, которое не работает на том же IP-адресе (localhost или 127.0.0.1), что и ваш веб-браузер, почтальон или ваш сервер.

Чтобы сделать запрос к вашему серверу с вашего эмулятора, вам нужно получить доступ к вашему серверу через IP-адрес вашего компьютера: В Windows получите ваш IP-адрес, запустив ipconfig в командной строке.

В терминале Unix (Linux, Mac OS) запустите ifconfig, чтобы получить ваш IP-адрес

Вместо http://localhost: port вы должны использовать http://your_ip_address: port

Я не тестировал его на Linux, Mac OS, но он отлично работал на Windows!

Ответ 4

Я нашел другое решение для axios.get, не работающего в ответной исходной проблеме:

Проблема: - Объект не отображается и ошибка: необработанное обещание. Ошибка сети. - Используйте команду ниже:

=>>> npm install -g --save axios

вместо npm установите --save axios, т.е. используйте -g.

А также проверьте, есть ли у вашего эмулятора интернет-соединение.

Если ваш эмулятор не подключен к Интернету и отображается ошибка, такая как: DNS-зонд закончил неудачную конфигурацию, затем STOP ANDROID STUDIO Emulator и запустите эти две команды в терминале

1. >> C:\Users\Admin\AppData\Local\Android\sdk\emulator\emulator.exe -list-avds​

Мой выход:

  • Pixel_XL_API_27

После этого шага вы получите имя avds.

пример: - Pixel_XL_API_27

Теперь запустите команду: -

2. >> C:\Users\Admin\AppData\Local\Android\sdk\emulator\emulator.exe -avd Pixel_XL_API_27 -dns-server 8.8.8.8​

Ответ 5

Другим решением является создание размещенной сети на локальном компьютере с этими командами из admin cmd:

netsh wlan set hostednetwork mode=allow ssid=wifi_name key=wifi_password
netsh wlan start hostednetwork

Подключите ваше устройство к точке доступа компьютера, затем запустите компьютер ip, запустив:

ipconfig

Теперь получите адрес IPV4 и поместите его в URL-адрес приложения/выборки,

axios.get('https://192.168.137.1:3000/api')
.then(
  (response) => {
    console.log(response);
  }
)
.catch(
  (error) => {
    console.log('error');
  }
);

}; };

и теперь он должен работать!

Ответ 6

Попробуйте отключить брандмауэр, у меня это сработало