Axios: أكسيوس لا ترسل بيانات النموذج في رد الفعل الأصلي

تم إنشاؤها على ٢٥ يناير ٢٠١٨  ·  46تعليقات  ·  مصدر: axios/axios

لقد حاولت إرسال بيانات نموذج باستخدام Axios ولكن لا يمكنني ذلك ، في أدوات chrome dev لا يظهر أي محتوى في الطلب. تقديم نفس الطلب عبر ساعي البريد استجابة API بشكل طبيعي.
js (newData) => { const data = new FormData(); data.append('name', 'raphael'); data.append('file', { uri: newData.image.path, type: 'image/jpeg', name: 'teste' }); return axios.post(`${constants.development.URL_API}/file`, data, headers: { 'Content-Type': 'multipart/form-data', }, })`

التعليق الأكثر فائدة

لا يزال هذا الخطأ يحدث مع أحدث الأكسيوس ، فلماذا تم إغلاق هذا؟

ال 46 كومينتر

corujoraphael بدافع الفضول ، هل كان هذا الطلب يعمل في وقت سابق؟

corujoraphael لست متأكدًا من أن التعليمات البرمجية الخاصة بك تعمل كما هي. يجب أن يكون التكوين حيث تحدد الرؤوس الخاصة بك كائنًا ، لكنه يفتقد إلى قوس مجعد:

(newData) => {
  const data = new FormData();
  data.append('name', 'raphael');
  data.append('file', {
    uri: newData.image.path,
    type: 'image/jpeg',
    name: 'teste'
  });

  return axios.post(
    `${constants.development.URL_API}/file`,
    data, 
    { 
      headers: {
        'Content-Type': 'multipart/form-data',
      }
    },
  )
}

نظرًا لأن هذه المشكلة لم تتلق ردًا ولا يبدو هذا خطأ في Axios بناءً على المعلومات المتوفرة لدينا ، فأنا أغلق هذه المشكلة.

إذا كنت بحاجة إلى مزيد من المساعدة في تصحيح أخطاء التعليمات البرمجية الخاصة بك ، فيرجى النشر على Stack Overflow أو Gitter أو التعليق مرة أخرى على هذه المشكلة.

شكرا!

emilyemorehouse ، واجهت نفس المشكلة باستخدام React Native FormData

let s = JSON.stringify({ uri: localUri, name: filename, type: type });
let formData = new FormData();
formData.append('ph0t0', s);

axios.post("http://10.0.1.2:8888/uploadphoto", {
        method: "POST",
        headers: {
                'Content-Type': 'multipart/form-data; charset=utf-8; boundary="another cool boundary";'
        },
        body: formData,
}).then((resp) => {
        console.log(resp);
}).catch(err => {
        console.log(err);
});

توقع بعض المفاتيح: توجد أزواج

2018/02/20 18: 25: 31.740 [W] [photo.go: 411] req.MultipartForm: لا شيء
2018/02/20 18: 25: 31.740 [W] [photo.go: 412] req.Form: map []
2018/02/20 18: 25: 31.740 [W] [photo.go: 413] مطلوب .
2018/02/20 18: 25: 31.740 [W] [photo.go: 410] req: & {POST / uploadphoto / الحوار / 57120e8951c643ab42a8c19f / 000000000000000000000001 خريطة HTTP / 1.1 1 1 [Content-Type: [application / json؛ charset = utf-8] User-Agent: [okhttp / 3.6.0] Accept: [application / json، text / normal، / ] Content-Length: [419] Connection: [Keep-Alive] Accept-Encoding: [gzip] ملف تعريف الارتباط: [lang = zh-TW ؛ PVsessionID = db9a21d63b2d0ea47b68fa8755bd87e2]] 0xc420e3cb80419 [] خطأ 10.0.1.2:8888 خريطة [] خريطة []الخريطة [] 10.0.1.3:46904 / uploadphoto / الحوار / 57120e8951c643ab42a8c19f / 0000000000000000000000010xc420e3cb40}
2018/02/20 18: 25: 31.740 [E] [photo.go: 425] [UploadPhotos] خطأ: طلب نوع المحتوى ليس متعدد الأجزاء / بيانات النموذج

معلومات الإصدار
أكسيوس: 0.16.2
المعرض: 25.0.0
رد فعل: 16.2.0
رد فعل أصلي: 0.52.0

لا يزال هذا الخطأ يحدث مع أحدث الأكسيوس ، فلماذا تم إغلاق هذا؟

إذا كان بإمكان شخص ما تقديم مثال قابل للتكرار ، يسعدني فتح هذه النسخة الاحتياطية.

@ Ernie6711 يبدو أن لديك خطأ في التعليمات البرمجية - لا أعتقد أنه يجب عليك تشديد بيانات الملف قبل إلحاقها ببيانات النموذج. أيضًا ، وسيطات axios.post هي axios.post(url[, data[, config]])

فيما يلي مثال بناءً على الكود الخاص بك:

const file ={ uri: localUri, name: filename, type: type};
const formData = new FormData();
formData.append('file', s);

const config = {
        headers: {
                'Content-Type': 'multipart/form-data; charset=utf-8; boundary="another cool boundary";'
        }
};

axios.post("http://10.0.1.2:8888/uploadphoto", formData, config).then((resp) => {
        console.log(resp);
}).catch(err => {
        console.log(err);
});

emilyemorehouse يرجى التحقق من آثار wireshark. يتم تحميل البيانات لكنها لا تستخدم ترميز بيانات النموذج المناسب. يمكن للمثال أعلاه إعادة إنتاج المشكلة. مرة أخرى - يتم إرسال الطلب بنجاح ولكن هل تم ترميزه بشكل سيئ.

POST /myserver HTTP/1.1
Content-Type: multipart/form-data

_parts=USERX%2Cusername&_parts=FILE1%2C%5Bobject%20Object%5D

لدي عميل محلي وخادم مثال لعمليات تحميل الملفات ، وإن كان ذلك خارج بيئة React Native ، يعمل ويتم ترميزه بشكل صحيح. المثال أعلاه ليس قابلاً للتكرار حقًا لأنه يعتمد على المتغيرات وخادم لا يمكنني الوصول إليه.

أعتقد أنه إذا كان هناك شيء غير صحيح في التحميل ، فذلك لأن البيانات الملحقة بكائن بيانات النموذج غير صالحة.

تعمل تحميلات emilyemorehouse File بشكل مثالي في بيئة المتصفح ، لكنها تفشل فقط عند التفاعل الأصلي. كما ذكرت نفسك - كانت اختباراتك خارج بيئة التفاعل الأصلية ، سأبدأ من هناك :)

جرب تحميل ملف بسيط في رد فعل أصلي وتحقق ببساطة من آثار wireshark ، فأنت لا تحتاج حتى إلى خادم يعمل ...

حصلت على نفس الشيء ، أكسيوس لا يتفاعل مع السكان الأصليين

duongtranpyco لقد أزلت

ملاحظة: إذا كنت ترسل JSON بشكل أساسي ، فعدّل الرمز. في حالتي ، يتوقع الخادم عادةً نموذجًا.

const request = async ({url, method = 'GET', params, body, responseType = 'json', headers = {}})=>{
    const escape = (data, encode = encodeURIComponent)=>Object.keys(data||{}).reduce((pairs, key)=>{
        for (let value of [].concat(data[key]))
            pairs.push([`${key}`, `${value}`]);
        return pairs;
    }, []).map(pair=>pair.map(encode).join('=')).join('&');

    if (Object.keys(params||{}).length)
        url += '?'+escape(params);
    if (method=='POST' && typeof body=='object')
    {
        if (body instanceof FormData)
            headers['Content-Type'] = 'multipart/form-data';
        else
        {
            body = escape(body);
            headers['Content-Type'] = 'application/x-www-form-urlencoded';
        }
    }
    let {statusCode, request: req} = await new Promise((resolve, reject)=>{
        let xhr = new XMLHttpRequest();
        xhr.open(method, url, true);
        xhr.withCredentials = true;
        xhr.responseType = {json: 'text'}[responseType]||responseType;
        xhr.onload = ()=>resolve({statusCode: xhr.status, request: xhr});
        xhr.onerror = ()=>reject(new TypeError('Network request failed'));
        xhr.ontimeout = ()=>reject(new TypeError('Network request timed out'));
        for (let key in headers)
            xhr.setRequestHeader(key, headers[key]);
        xhr.send(body||null);
    });
    if (statusCode<200 || statusCode>=400)
        throw new Error(`network request failed with ${statusCode}: ${url}`);
    switch(responseType)
    {
        case 'json':
            return JSON.parse(req.responseText);
        case 'text':
            return req.responseText;
        case 'request':
            return req;
    }
    return req.response;
};

request.get = (url, opt = {})=>request({...opt, url, body: null});
request.post = (url, ...args)=>request({...args[1]||{}, url, method: 'POST', body: args[0]});

مرحبًا ، أواجه نفس المشكلة. هل وجد أي شخص حلا؟

giladno الثانية. نظرًا لأنني أمضي قدمًا في الأجزاء الأخرى ، فأنا أستخدم حلًا بديلًا: اكتب وظيفة معينة باستخدام fetch () عند تحميل الصور.

تمت المحاولة من قبل ولم يؤثر تشنج البيانات أو الوسيطات على النتيجة. تلقى الخادم المكالمة ولكن لم يتم إرسال أي بيانات.

@ Ernie6711 يبدو أن الرؤوس تالفة وهذا هو السبب في أن الخادم غير قادر على قبول بيانات النموذج. لقد نفذت الحل البديل مع fetch () وعمل بدون مشاكل.

لدي بعض المشاكل في رد الفعل الأم.
المشكلة ليست الرؤوس.
في الويب يمكن أن يكون لدينا على سبيل المثال:

let formData = new FormData()
formData.append('key', true // bool value)

ولكن في رد الفعل الأصلي ، يجب أن تكون قيمة المفتاح سلسلة.

formData.append('key', 'true')

لدي نفس المشكلة في رد الفعل الأصلي عندما أنشر على عنوان url ، كما يذكر giladno ، يجب عليك اختبار رد الفعل الأصلي ويمكنك التحقق من الخطأ الذي أبلغ عنه الأشخاصemilyemorehouse. لقد أبلغت عن خطأ منذ 14 يومًا https://github.com/axios/axios/issues/1618 ، ولكن لم يرد أحد ، يرجى وصف في الملف التمهيدي لمكتبتك أنه ليس لديك دعم للمحاور عند التفاعل الأصلي ، بحيث كثير من المطورين لا يضيعون الوقت ..!

جميعكم ، أنا أقدر الاتجاه ولكن "مجرد اختبار تحميل ملف في React Native" ليس بهذه السهولة. لا أعمل غالبًا في React Native وسيستغرق الأمر وقتًا مناسبًا لتدوير مشروع به تحميلات ملفات لاختبارها.

لديّ POST بسيط مع بيانات النموذج التي تعمل في React Native:

    const formData = new FormData();
    formData.append("data", true);

    const config = {
      headers: {
        "Content-Type": "multipart/form-data; charset=utf-8;"
      }
    };

    axios.post(URL, formData, config).then(
      response => {
        console.log({ response });
      },
      error => {
        console.log({ error });
      }
    );

يتم تقييد true عند إرساله إلى الخادم ، وهو أمر مثير للاهتمام.

بعد قولي هذا ، إذا كان بإمكان أي شخص أن يقدم مثالاً يمكنني استخدامه بسهولة ، فسأكون سعيدًا للنظر فيه أكثر.

corujoraphael كيف حللت هذا؟

لقد أضفت نوعًا داخل كائن الصورة مثل "Image.type='image/png" قبل الإلحاق مباشرة وقمت أيضًا بتغيير نوع المحتوى إلى "Content-Type":"multipart/form-data" :

        image.type='image/png'
        formData.append("resource", image);
        return axios
          .post('yourBAckendUrl', formData, {
            headers: {
              Authorization: "yourTokenHere",
              "Content-Type": "multipart/form-data"
            }
          })

أتمنى أن يساعد هذا شخص ما.

لم أتمكن من تشغيل هذا أيضًا ، فأنا أحاول PUT متعدد الأجزاء / بيانات النموذج إلى S3 (فيديو). استخدام خيار الكتابة لم يساعد. لا يبدو أن رأس بيانات النموذج / متعدد الأجزاء موجودًا في طلب PUT:

      const data = new FormData();
      data.append('video', {
          uri: 'file:///<path_to_video_on_iphone.mov',
          type: 'video/quicktime',
          name: 'video.mov',
      });
      response = yield call(() => {
        return api.put(url, data, {
          headers: {
              'Content-Type': 'multipart/form-data',
          },
          transformRequest: [
            (data, headers) => {
                delete headers.common.Authorization;
                return data;
            }
          ]
        });
      });

لهذه الحالة استخدم الجلب: د

var data = new FormData();  
data.append('my_photo', {  
  uri: filePath, // your file path string
  name: 'my_photo.jpg',
  type: 'image/jpg'
}

fetch(path, {  
  headers: {
    'Accept': 'application/json',
    'Content-Type': 'multipart/form-data'
  },
  method: 'POST',
  body: data
});

في إصدار أكسيوس 0.18.0 يواجه نفس المشكلة.
تقوم axios بإزالة الرأس داخليًا Content-Type إذا لم يكن هناك نص على post, put إلخ لسبب ما عند إنشاء FormData يبقى النص فارغًا ..
هذا هو الكود الخاص بي:

const sendFormData = images => {
   // images is an array of base64 images (strings)
    const formData = new FormData();
    images.forEach((img, i) => {
        formData.append('file', img);
        formData.append('name', `${type}-${i + 1}`);
    });

    config.headers = {
        .'Content-Type': 'multipart/form-data'
     };

     return axios.post(`http://someurl.com/api/upload-images`, formData, config)
            .then(response => {
               // handle success
            })
            .catch(err => {
                // handle err
     });
}

رد الإصدار الأصلي 0.55.3
رمز المثال هذا لا يعمل. نص الطلب فارغ وتمت إزالة رأس Content-Type

لدي نفس المشاكل وجسدي عندما أتحقق من التصحيح هو سلسلة

screen shot 2018-10-26 at 11 12 10 am

وهنا الكود الخاص بي

        const formData = new FormData();
        formData.append('photo', {
          uri: response.uri.replace('file://', ''),
          mineType: 'image/jpeg',
          fileType: 'image/jpg',
          type: 'image/jpg',
          name: 'test.jpg'
        });

        console.log('form data', formData);

         Axios({
           method: 'post',
           url: 'https://dev-host.luxstay.net/api/rooms/10740/photos',
           data: formData,
           headers: {
             Authorization: token,
             'Content-Type': 'multipart/form-data'
           }
         });

تحديث: حدث خطأ لأن التطبيق كان في وضع التصحيح. عندما أقوم بإيقاف تشغيل وضع التصحيح ، فقد نجح

أكسيوس لديه رمز في محول xhr الخاص به
if (utils.isFormData(requestData)) { delete requestHeaders['Content-Type']; // Let the browser set it }
أعتقد أنه في رد الفعل الأصلي يحذف رأس نوع المحتوى إذا كنت ترسل بيانات نموذج متعددة الأجزاء حتى إذا قمت بتعيينها في الكود.
لكنني لست متأكدًا مما إذا كان التعليق على السطر سيؤدي إلى حل مشكلتك في رد الفعل الأصلي.

في إصدار أكسيوس 0.18.0 يواجه نفس المشكلة.
تقوم axios بإزالة الرأس داخليًا Content-Type إذا لم يكن هناك نص في post, put إلخ لسبب ما عند إنشاء FormData يبقى النص فارغًا ..
هذا هو الكود الخاص بي:

const sendFormData = images => {
   // images is an array of base64 images (strings)
    const formData = new FormData();
    images.forEach((img, i) => {
        formData.append('file', img);
        formData.append('name', `${type}-${i + 1}`);
    });

    config.headers = {
        .'Content-Type': 'multipart/form-data'
     };

     return axios.post(`http://someurl.com/api/upload-images`, formData, config)
            .then(response => {
               // handle success
            })
            .catch(err => {
                // handle err
     });
}

رد فعل النسخة الأصلية 0.55.3
رمز المثال هذا لا يعمل. نص الطلب فارغ وتمت إزالة رأس Content-Type

screen shot 2018-10-26 at 11 12 10 am

إذن كيف يجب أن تبدو؟ لدي كائن كذلك.

tkserver يبدو الأمر عندما يكون لديك كائن ثم تقوم بـString () عليه.

const a = {
  name: 'dasdasd'
}
console.log(a.toString());

tkserver يبدو الأمر عندما يكون لديك كائن ثم تقوم بـString () عليه.

const a = {
  name: 'dasdasd'
}
console.log(a.toString());

ربما لم أكن واضحًا. هل يجب أن تظهر حمولة الطلب [كائن كائن] عند عرض الرؤوس؟

tkserver إذا كان مصحح الأخطاء لديك به فحص الشبكة ممكّنًا ، فسيقوم بإلغاء FormData الخاص بالتفاعل الأصلي وسيؤدي إلى تمرير كائن FormData الفارغ الذي سيبدو مثل [كائن كائن] في فحص الشبكة.
حاول تقديم طلب بإيقاف تشغيل فحص الشبكة ، آمل أن يساعدك هذا.

شكرًا Aman725 و minhphung210 وجميعهم. عندما أستخدم الرمز على جهاز حقيقي ، فإن التحميل يعمل بشكل صحيح. يبدو أن هذا مرتبط بمحاكاة iOS.

كانت لدي هذه المشكلة ، لكنها تم حلها الآن.

والسبب في ذلك هو أنني كنت أقوم بتصحيح أخطاء طلبات الشبكة. كان لدي هذا السطر من الشفرة في نقطة دخول تطبيقي:

GLOBAL.XMLHttpRequest = GLOBAL.originalXMLHttpRequest || GLOBAL.XMLHttpRequest;

لقد علقت عليه وهو يعمل الآن.

// IMPORTANT: this will cause FormData requests to fail.
// GLOBAL.XMLHttpRequest = GLOBAL.originalXMLHttpRequest || GLOBAL.XMLHttpRequest;

لقد وجدت هذا للتو: https://stackoverflow.com/a/47630754/387912 ، هل يساعد؟

XMLHttpRequest

هل يمكن أن تخبرني كيف أنشأت الطلب بحيث يتم تحميله بشكل صحيح باعتباره متعدد الأطراف؟ أستمر في تلقي خطأ في الشبكة:

Error: Network Error
    at createError (blob:http://localhost:8081/0754d453-361d-48d1-aaa5-9ff1ad808293:168963:17)
    at XMLHttpRequest.handleError (blob:http://localhost:8081/0754d453-361d-48d1-aaa5-9ff1ad808293:168871:16)
    at XMLHttpRequest.dispatchEvent (blob:http://localhost:8081/0754d453-361d-48d1-aaa5-9ff1ad808293:28708:27)
    at XMLHttpRequest.setReadyState (blob:http://localhost:8081/0754d453-361d-48d1-aaa5-9ff1ad808293:28461:20)
    at XMLHttpRequest.__didCompleteResponse (blob:http://localhost:8081/0754d453-361d-48d1-aaa5-9ff1ad808293:28288:16)
    at blob:http://localhost:8081/0754d453-361d-48d1-aaa5-9ff1ad808293:28398:47
    at RCTDeviceEventEmitter.emit (blob:http://localhost:8081/0754d453-361d-48d1-aaa5-9ff1ad808293:3291:37)
    at MessageQueue.__callFunction (blob:http://localhost:8081/0754d453-361d-48d1-aaa5-9ff1ad808293:2588:44)
    at blob:http://localhost:8081/0754d453-361d-48d1-aaa5-9ff1ad808293:2345:17
    at MessageQueue.__guard (blob:http://localhost:8081/0754d453-361d-48d1-aaa5-9ff1ad808293:2542:13)

تحديث: تمكن من جعله يعمل الآن. تستخدم حاليا:

formData.append('picture', {
          uri: data.uri,
          name: fname,
          type: 'image/' + ext

        });

إذا كان الناس لا يزالون يواجهون هذه المشكلة ، ولديك
GLOBAL.XMLHttpRequest = GLOBAL.originalXMLHttpRequest || GLOBAL.XMLHttpRequest;
مقتطف لتصحيح أخطاء طلبات الشبكة ، حاول إضافة
GLOBAL.FormData = GLOBAL.originalFormData || GLOBAL.FormData
عملت معي.

لقد أضفت نوعًا داخل كائن الصورة مثل "Image.type='image/png" قبل الإلحاق مباشرة وقمت أيضًا بتغيير نوع المحتوى إلى "Content-Type":"multipart/form-data" :

        image.type='image/png'
        formData.append("resource", image);
        return axios
          .post('yourBAckendUrl', formData, {
            headers: {
              Authorization: "yourTokenHere",
              "Content-Type": "multipart/form-data"
            }
          })

أتمنى أن يساعد هذا شخص ما.

شكرا لمساعدتك! تمكنت من تحميل صورتي باستخدام iOS Simunator ولكن ليس باستخدام Android.

بعد أن قمت بتعيين نوع الصورة على "image / jpeg" توقفت عن وجود خطأ في الشبكة.

const formData = new FormData();
formData.append('file', {
  uri: pictureUri,
  type: 'image/jpeg',
  name: 'profile-picture'
})

لقد أضفت نوعًا داخل كائن الصورة مثل "Image.type='image/png" قبل الإلحاق مباشرة وقمت أيضًا بتغيير نوع المحتوى إلى "Content-Type":"multipart/form-data" :

        image.type='image/png'
        formData.append("resource", image);
        return axios
          .post('yourBAckendUrl', formData, {
            headers: {
              Authorization: "yourTokenHere",
              "Content-Type": "multipart/form-data"
            }
          })

أتمنى أن يساعد هذا شخص ما.

شكرا لمساعدتك! تمكنت من تحميل صورتي باستخدام iOS Simunator ولكن ليس باستخدام Android.

بعد أن قمت بتعيين نوع الصورة على "image / jpeg" توقفت عن وجود خطأ في الشبكة.

const formData = new FormData();
formData.append('file', {
  uri: pictureUri,
  type: 'image/jpeg',
  name: 'profile-picture'
})

بالنسبة لأي شخص قد يكون هذا مفيدًا ، إذا كنت لا تعرف نوع المحتوى الذي سيتم إرساله ، فاستخدم multipart/form-data . يبدو من الواضح قراءة هذا الآن ، لكن الأمر استغرق مني ساعة جيدة لتشغيل أي وسائط.

    data.append("image", {
      name: "some_name", // also, won't work without this. A name is required
      height: image.height,
      width: image.width,
      type: "multipart/form-data", // <-- this part here
      uri:
        Platform.OS === "android" ? image.uri : image.uri.replace("file:/", "")
    });

مرحبًا ، أحاول رفع ملف Axios في Vue.Js. يمكن لأي شخص مراجعة وشرح القضية؟

في Html
<input type="file" id="file" ref="file" multiple @change="assignFiles"/>

في Js

`تعيين الملفات (هـ) {

      let uploadedFiles = this.$refs.file.files;
      for( var i = 0; i < uploadedFiles.length; i++ ) { 
        this.form.AttachmentDocs.push(uploadedFiles[i]);           
      }
      console.log(this.form.AttachmentDocs);
 },`

لذلك ، أثناء تشغيل المنشور ، أقوم بإلحاق بيانات النموذج.

`متابعة حفظ (هـ) {

      e.preventDefault();
      this.$v.$touch();
      if(this.$v.$invalid) {
        return;
      }
    this.showLoading(this.loaderId,true);
      this.postDatas.append('form',JSON.stringify(this.form));
      for( var i = 0; i < this.form.AttachmentDocs.length; i++ ){ 
        let attachment = this.form.AttachmentDocs[i];
        this.postDatas.append('files['+i+']',attachment,attachment.name);           
      }

} `

لذلك في المنشور ، راجعت رأس نافذة وحدة التحكم ، وهناك عرضها

الملفات [0]: (ثنائي)
الملفات [1]: (ثنائي)
الملفات [2]: (ثنائي)
الملفات [3]: (ثنائي)

في جانب الخادم الخاص بي لا يمكنني الحصول على الملفات.

قد يكون له علاقة به

this.postDatas.append('files['+i+']',attachment,attachment.name);  

جرب files['+' + i + '+']

لدي نفس المشكلة مع جلب API. كان req.body فارغًا في node js. باستخدام "صريح هائلة" حل المشكلة. https://www.npmjs.com/package/express-formidable

قد يكون له علاقة به

this.postDatas.append('files['+i+']',attachment,attachment.name);  

جرب files['+' + i + '+']

يشير Sry + إلى التسلسل ، أما wat فهو استخدام السلسلة "+". ستكون النتيجة ملفات [+0+]

لدي نفس المشكلة مع جلب API. كان req.body فارغًا في node js. باستخدام "صريح هائلة" حل المشكلة. https://www.npmjs.com/package/express-formidable

هل قمت بتضمين app.use(express.json({ extended: false })); ؟

قد يكون له علاقة به

this.postDatas.append('files['+i+']',attachment,attachment.name);  

جرب files['+' + i + '+']

يشير Sry + إلى التسلسل ، أما wat فهو استخدام السلسلة "+". ستكون النتيجة ملفات [+0+]

سينتج عن شفرتك الحالية دائمًا files[+i+] في حلقة for الخاصة بك. لن يكون أبدًا files[+0+], files[+1+], files[+2+], etc .

أيضًا ، files[+0+] لن يكون موجودًا أبدًا. لست متأكدا مما تحاول القيام به. تحتاج files[0], files[1], files[2]... ؟ إذا كنت تحاول إنشاء كائن ، فيمكنك الحصول على files['+0+'] ، لكن ، مرة أخرى ، لست متأكدًا مما تحاول تحقيقه.

لدي نفس المشكلة مع جلب API. كان req.body فارغًا في node js. باستخدام "صريح هائلة" حل المشكلة. https://www.npmjs.com/package/express-formidable

هل قمت بتضمين app.use(express.json({ extended: false })); ؟
لا. ومع ذلك ، لدي مشكلة واحدة هائلة. الصورة التي تم تحميلها ستذهب إلى الحقول المطلوبة. لا شيء في طلب الملفات. لا يدري لماذا يحدث هذا.

duongtranpyco لقد أزلت

ملاحظة: إذا كنت ترسل JSON بشكل أساسي ، فعدّل الرمز. في حالتي ، يتوقع الخادم عادةً نموذجًا.

const request = async ({url, method = 'GET', params, body, responseType = 'json', headers = {}})=>{
    const escape = (data, encode = encodeURIComponent)=>Object.keys(data||{}).reduce((pairs, key)=>{
        for (let value of [].concat(data[key]))
            pairs.push([`${key}`, `${value}`]);
        return pairs;
    }, []).map(pair=>pair.map(encode).join('=')).join('&');

    if (Object.keys(params||{}).length)
        url += '?'+escape(params);
    if (method=='POST' && typeof body=='object')
    {
        if (body instanceof FormData)
            headers['Content-Type'] = 'multipart/form-data';
        else
        {
            body = escape(body);
            headers['Content-Type'] = 'application/x-www-form-urlencoded';
        }
    }
    let {statusCode, request: req} = await new Promise((resolve, reject)=>{
        let xhr = new XMLHttpRequest();
        xhr.open(method, url, true);
        xhr.withCredentials = true;
        xhr.responseType = {json: 'text'}[responseType]||responseType;
        xhr.onload = ()=>resolve({statusCode: xhr.status, request: xhr});
        xhr.onerror = ()=>reject(new TypeError('Network request failed'));
        xhr.ontimeout = ()=>reject(new TypeError('Network request timed out'));
        for (let key in headers)
            xhr.setRequestHeader(key, headers[key]);
        xhr.send(body||null);
    });
    if (statusCode<200 || statusCode>=400)
        throw new Error(`network request failed with ${statusCode}: ${url}`);
    switch(responseType)
    {
        case 'json':
            return JSON.parse(req.responseText);
        case 'text':
            return req.responseText;
        case 'request':
            return req;
    }
    return req.response;
};

request.get = (url, opt = {})=>request({...opt, url, body: null});
request.post = (url, ...args)=>request({...args[1]||{}, url, method: 'POST', body: args[0]});

أنا أستخدم هذا الرمز في مشروعي. أحاول فهم هذا الرمز. سؤال واحد ، هل هذا الخط ضروري ،
لـ (دع قيمة [] .concat (البيانات [مفتاح]))؟ يمكن كتابتها ببساطة ،
pairs.push ([ ${key} ، ${data[key]} ])؛

إذا كان الناس لا يزالون يواجهون هذه المشكلة ، ولديك
GLOBAL.XMLHttpRequest = GLOBAL.originalXMLHttpRequest || GLOBAL.XMLHttpRequest;
مقتطف لتصحيح أخطاء طلبات الشبكة ، حاول إضافة
GLOBAL.FormData = GLOBAL.originalFormData || GLOBAL.FormData
عملت معي.

اين هى؟

كما أتيحت لي المشكلة. إنه ناتج عن مسار الملف في android.
مسار const = utils.isAndroid ()؟
وهو يعمل بشكل جيد مع التنفيذ على النحو التالي

    const formData = new FormData();
    const path = utils.isAndroid() ? `file://${filePath}` : filePath;
    formData.append('Voice', {
      uri: path,
      name: 'test',
      type: 'audio/wav',
    });

    formData.append('Content-Type', 'audio/wav');
     const headers =  {
        'Content-Type': 'multipart/form-data',
      };
    return this._sendRequest(url, 'POST', formData, headers);
 data.append('file', {
    uri: newData.image.path,
    type: 'image/jpeg',
    name: 'teste'

استخدم الاسم مثل: name:'teste.jpeg' وسيعمل. تحتاج إلى إعطاء تنسيق للملف وإلا فلن يعمل.
أصلحته من خلال الاسم: "example.jpeg"

بعد عدة أيام من محاولة تحميل الفيديو باستخدام أكسيوس ، استسلمت للتو. يعد RNFetchBlob خيارًا أفضل لتحميل الملفات من Android على وجه الخصوص. هذا القسم سهل التنفيذ

rn-fetch-blob

هل كانت هذه الصفحة مفيدة؟
0 / 5 - 0 التقييمات