Допустил ли я ошибку при отправке запроса?

Question

Ulug @kirkland

Fron-end Developer

Допустил ли я ошибку при отправке запроса?

Всем доброго времени суток! У меня тут вопрос по моему кода. Вообщем есть запрос который я отправляю на сервер при этом он работает нормально при условии что в заголовке прописан Content-Type application/json и я отправляю данные с помощью JSON.stringify. Но как только я меняю тел запроса на FormData у меня начинаются проблемы. Меняю из за того что мне нужно добавить фотографии в запрос.
1) При async/await fetch api мой catch ловит ошибку Network request failed
2) При использовании xhr вместе с FormData запрос отправляется но возвращается ответ от сервера что все необходимые поля должны быть заполнены (они заполнены).

Ps При отправке через Postman все работает

Pss Отвечу на все возникшие у вас вопросы по моему вопросу.

makeCall = async () => {
    this.setState({
      loadingVisible: true,
    });
    let token = await AsyncStorage.getItem('@token');
    // let {images} = this.state;
    console.log(token);
    let calling = new FormData();

    calling.append('services', this.state.services);
    calling.append('employe_group_code', this.state.employe_group_code);
    calling.append('addantial_comment', this.state.addantial_comment);
    calling.append('address', this.state.address);
    calling.append('coor_lat', this.state.coor_lat);
    calling.append('coor_long', this.state.coor_long);

    if (this.state.images_param.length != 0) {
      let fileExt = this.state.images_param[0].name.split('.')
      console.log(fileExt);

      for (let index = 0; index < this.state.images_param.length; index++) {

        console.log(this.state.images_param[index]);

        calling.append('images[]', {
          uri: Platform.OS === "android" ? this.state.images_param[index].uri : this.state.images_param[index].uri.replace("file://", ""),
          name: `photo.${fileExt[1]}`,
          type: `image/jpeg`
        })
      }
    }
    console.log(calling);

    try {
      let res = await fetch(DOMAIN, {
        method: 'POST',
        headers: {
          // Accept: 'application/json',
          Authorization: 'Bearer ' + token,
          'Content-Type': 'multipart/form-data', 
        },
        body: calling,
      });
      console.log(res);

      let res_json = await res.json();
      if (res_json.errors) {
        await updateToken();
        token = await AsyncStorage.getItem('@token');
        console.log(token);
        res = await fetch(DOMAIN, {
          method: 'POST',
          headers: {
            Authorization: 'Bearer ' + token,
            'Content-Type': 'multipart/form-data',
          },
          body: calling,
        });
        res_json = await res.json();
        console.log(res_json);
        this.setState({
          modalVisible: false,
        });
        this.props.navigation.navigate('DIRECTION', {
          coor_lat: this.state.coor_lat,
          coor_long: this.state.coor_long,
          item_id: res_json.call.id,
        });
      } else {
        this.setState({
          loadingVisible: false,
        });
        this.props.navigation.navigate('DIRECTION', {
          coor_lat: this.state.coor_lat,
          coor_long: this.state.coor_long,
          item_id: res_json.call.id,
        });
      }
    } catch (error) {
      console.warn(error);
      console.warn(JSON.stringify(error));
      this.setState({
        loadingVisible: false,
      });
    }
  };