Блог

Главная - Вопросы по программированию - React Native, использующий RapidAPI внутри исходного кода

React Native, использующий RapidAPI внутри исходного кода

#javascript #reactjs #react-native #api #security

#javascript #reactjs #react-native #API #Безопасность

Вопрос:

Раньше у меня был этот код для извлечения файла JSON, содержащего личные данные, в моем исходном коде React Naive:

 async componentDidMount() {
try {
    const response = await fetch('mydomain.org/personaldata.json');
    const responseJson = await response.json();
    this.setState({
        isLoading: false,
        dataSource: responseJson,
    });
}
catch (error) {
    console.error(error);
}
}

Затем я решил использовать RapidAPI, чтобы сделать его более безопасным, но я не мог понять, как его использовать, и он выдает мне белую страницу без данных:
Это мой модифицированный код:

 async componentDidMount() {
try {
    const response = await fetch('coin-flip1.p.rapidapi.com/headstails', {
        "method": "GET",
        "headers": {
          "x-rapidapi-host": "mydomain.org",
          "x-rapidapi-key": 'lkweruytv43578tv3urhgciuyv2b738465873465c87xnb746'
        }
      });
    const responseJson = await response.json();
    this.setState({
        isLoading: false,
        dataSource: responseJson,

    });
}
catch (error) {
    console.error(error);
}
}

Это код RapidAPI из их документации:

 const fetchData = () => {
startFlip()
setLoading(true);
fetch('https://coin-flip1.p.rapidapi.com/headstails', {
"method": "GET",
"headers": {
  "x-rapidapi-host": "coin-flip1.p.rapidapi.org",
  "x-rapidapi-key": 'apikey'
}
})
.then((response) => response.json())
.then((json) => setData(json.outcome))
.catch(() => Alert.alert('Something went wrong..', 'There was an error fetching coin flip.'))
.finally(() => {
  setLoading(false)
  resetFlip()
});
};

Комментарии:

1. Проверьте этот блог, это может вам помочь. rapidapi.com/blog/create-react-native-app

2. @BelginAndroid Я думал, что RapidAPI может выполнять мой собственный запрос API и работать как прокси для моего собственного сервера, но я обнаружил, что у него совершенно другой механизм. Спасибо

3. к вашему сведению, вы можете извлечь свой ключ api

Ответ №1:

Я предполагаю, что вы используете API для переворачивания монет в RapidAPI. У меня все работает нормально, если я использую axios.

Попробуйте использовать этот фрагмент кода

 var axios = require("axios").default;

var options = {
  method: 'GET',
  url: 'https://coin-flip1.p.rapidapi.com/headstails',
  headers: {
    'x-rapidapi-key': '12345',
    'x-rapidapi-host': 'coin-flip1.p.rapidapi.com'
  }
};

axios.request(options).then(function (response) {
    console.log(response.data.outcome);
}).catch(function (error) {
    console.error(error);
});