Лучший способ сделать ровно один вызов API в реагирующе-нативном (fetch, axios и т. Д.)? - PullRequest
Новая
       18

Лучший способ сделать ровно один вызов API в реагирующе-нативном (fetch, axios и т. Д.)?

0 голосов
/ 20 февраля 2019

В настоящее время я создаю приложение, которое включает сканер штрих-кода.К сожалению, единственная найденная мной компания, которой, похоже, принадлежит более 90% всех продовольственных штрих-кодов, предоставляет API, начиная с 500 долларов в год.Поэтому я попытался создать обходной путь, который работает, но запускает так много вызовов API, что я блокируюсь сразу после одной попытки.Я вставил console.warn, чтобы видеть, сколько вызовов выполняется каждый раз, когда я вызываю API, и это примерно от 20 до 35 раз.Вот код: 

    async getApiData() {
      let formData = new FormData();
      formData.append('keyValue', 4015000961547);
      formData.append('requestTradeItemType', 'ownership');
      formData.append('keyCode', 'gtin');
      formData.append('someRandomToken', '1');
      const response = await fetch('http://gepir.gs1.org/index.php?option=com_gepir4ui&view=getkeylicensee&format=raw', {
        method: 'post',
        headers: {
          'Content-Type': 'application/x-www-form-urlencoded',
          'Cookie': 'someRandomCookie'
        },
        body: formData
      });
      if (response.status == 200) {
        const responseJson = JSON.parse(response._bodyText);
        const productName = responseJson.gepirParty.partyDataLine.gS1KeyLicensee.partyName;
        this.setState({ productName });
      }
    }

Если вы попробуете это с этим keyValue из 4015000961547, вы получите Henkel AG, если вы хотите проверить (http://gepir.gs1.org/index.php/search-by-gtin). Что я не делаю 'Я не понимаю, почему моя функция запускает так много запросов к API, когда штрих-код считывается, хотя я использую async/ await? Я прочитал, что axios - лучший метод, но в моем случае это не сработало ..Есть ли третий / четвертый способ, который я мог бы попробовать? Очень важно, чтобы, получив данные сканирования, я отправлял только один запрос в API, в противном случае я не могу его протестировать.

Просто чтобы предоставить всю необходимую информацию, это мой код для получения данных штрих-кода после сканирования. Я использую react-native-camera: 

import { RNCamera } from 'react-native-camera';
... some more code ...

export default class Scanner extends Component {
  ... some code ...

   async onBarCodeRead(scanResult) {
    console.warn(scanResult.type);
    if (scanResult.data != null) {
      console.warn(scanResult.data);
      const eanCode = await scanResult.data;
    }
    return;
  }
  ...some code here...

  render() {
    return (
      <View>
        <RNCamera
          ref={ref => {
            this.camera = ref;
          }}
          barcodeFinderVisible={this.state.camera.barcodeFinderVisible}
          defaultTouchToFocus
          mirrorImage={false}
          onBarCodeRead={this.onBarCodeRead.bind(this)}
          onFocusChanged={() => {}}
          onZoomChanged={() => {}}
          type={this.state.camera.type}
        />
        <View>
          <Text>Please scan the barcode.</Text>
        </View>
      </View>
    );
  }
}

Для простоты я удалил все стили и неиспользованные props втег RNCamera.

1 Ответ

0 голосов
/ 20 февраля 2019

Похоже, это особенность - он постоянно сканирует штрих-код.В репо существует тема выпуска , в которой предлагается установить флаг при первом отправлении события, например: 

onBarCodeRead = (...someArgs) => {
  if (!this.isBarcodeRead) {
     this.isBarcodeRead = true;
     // Do your work
  }
}
...