Expo React native fetch requests twice

import React,  { useState } from 'react';
import { Text, View, StyleSheet, Image } from 'react-native';
import Constants from 'expo-constants';

// You can import from local files
import AssetExample from './components/AssetExample';

// or any pure javascript modules available in npm
import { Card } from 'react-native-paper';
import * as FileSystem from 'expo-file-system';

export default function App() {



  let data = new FormData();


 

let url="https://uploadfilesserver.eugenevolkov.repl.co/upload"

  

data.append("content",{type:'image/jpeg', uri:'https://snack-code-uploads.s3.us-west-1.amazonaws.com/~asset/201a148e3d40baa81d8ef06e316b5ca2', name:'ball.jpg'} )






function upload(){

fetch(url, {
  method: "post",
   headers: {
         "Content-Type": "multipart/form-data",
    },
  body: data,
})

.then(res => {res.json()

// console.log('res',res)
}
)
  .then(final => {

    console.log(
      "Success")}
     
    )
    
  //    .catch(err => {
  //   console.error("error uploading images: ", err);
  // });

}


upload()

return ( Изображение для загрузки <Image source={require('./ball_1.jpg')}/> ); }

Я новичок в react native. В результате всегда получается две загрузки (два POST-запроса). Запроса OPTIONS не происходит. В папке upload бэкенда (Django) всегда есть 2 файла 'ball.jpg'. Такая же проблема возникает после сборки app.

Попробуйте использовать then() только один раз :

function upload(){
      fetch(url, {
                method: "post",
                headers: {
                        "Content-Type": "multipart/form-data",
                },
                body: data,
      })
      .then(res => {
           res.json()
           console.log("Success")
       })

 }

Для платформы React Native IOS необходимо отправить URL без префикса 'file://'. Это может быть то же самое, что и Expo. Его можно использовать при работе с файлом или картинкой, выбранной с мобильного телефона.

Определение функции как async исправило это.

    async function upload(){
    
           await fetch(url, {
            
                    method: "post",
                    headers: {
                            "Content-Type": "multipart/form-data",
                    },
                    body: data,
                          })
          .then(res => {
               res.json()
               console.log("Success")
    
           })       
     }

upload()
Вернуться на верх