Android Axios POST请求提供了一个;网络错误“;在React Native中将图像添加到FormData结构时
我目前正在为Android构建一个简单的应用程序React Native 0.62.2。我在尝试将图像上传到API(用Android Axios POST请求提供了一个;网络错误“;在React Native中将图像添加到FormData结构时,android,node.js,react-native,xmlhttprequest,axios,Android,Node.js,React Native,Xmlhttprequest,Axios,我目前正在为Android构建一个简单的应用程序React Native 0.62.2。我在尝试将图像上传到API(用node.js/express编写)时遇到了一些问题,比如axios0.19.2(甚至是fetchAPI)。POST请求的格式如下: // UserService.js export const postNewUser = async (newUser) => { try { const photo = { uri: newU
node.js
/express
编写)时遇到了一些问题,比如axios0.19.2
(甚至是fetch
API)。POST
请求的格式如下:
// UserService.js
export const postNewUser = async (newUser) => {
try {
const photo = {
uri: newUser.avatar.uri,
type: 'image/jpg',
name: newUser.avatar.fileName,
};
const formData = new FormData();
Object.keys(newUser).forEach(key => formData.append(key, newUser[key]));
formData.append('avatar', photo);
const response = await api.post('/users', formData);
return response.data;
} catch (err) {
console.log('TRACE error posting user: ', err);
return;
}
}
这里,属性newUser.avatar.uri
通过图像选择器库设置,即@react native image picker 1.6.1
。每当我将photo
变量添加到FormData
中时,它都会给我一个NetworkError
。使用来自web的一些随机图像手动设置URI会导致相同的错误。将其从浏览器中删除,它会打印出某种堆栈跟踪,如下所示:
TRACE error posting user: Error: Network Error
at createError (C:\Users\Dell\Documents\Projetos\SmartestVet\node_modules\axios\lib\core\createError.js:16)
at EventTarget.handleError (C:\Users\Dell\Documents\Projetos\SmartestVet\node_modules\axios\lib\adapters\xhr.js:83)
at EventTarget.dispatchEvent (C:\Users\Dell\Documents\Projetos\SmartestVet\node_modules\event-target-shim\dist\event-target-shim.js:818)
at EventTarget.setReadyState (C:\Users\Dell\Documents\Projetos\SmartestVet\node_modules\react-native\Libraries\Network\XMLHttpRequest.js:575)
at EventTarget.__didCompleteResponse (C:\Users\Dell\Documents\Projetos\SmartestVet\node_modules\react-native\Libraries\Network\XMLHttpRequest.js:389)
at C:\Users\Dell\Documents\Projetos\SmartestVet\node_modules\react-native\Libraries\Network\XMLHttpRequest.js:502
at RCTDeviceEventEmitter.emit (C:\Users\Dell\Documents\Projetos\SmartestVet\node_modules\react-native\Libraries\vendor\emitter\EventEmitter.js:189)
at MessageQueue.__callFunction (C:\Users\Dell\Documents\Projetos\SmartestVet\node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:425)
at C:\Users\Dell\Documents\Projetos\SmartestVet\node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:112
at MessageQueue.__guard (C:\Users\Dell\Documents\Projetos\SmartestVet\node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:373)
例如,如果我注释掉行formData.append('avatar',photo)代码>它工作正常,即我的API相应地接收请求。所以我认为这可能不是一个与CORS相关的问题。此外,其他请求,例如GET,甚至其他帖子都可以正常工作
我知道在SO和GitHub中还有很多其他相关的帖子,其中一些与同一个问题有关。但我找到的解决方案都不适合我
如果有人想查看我的API中的路由是如何实现的,请随时联系我,我将在这里提供代码
提前感谢您对我的任何帮助 我也遇到了同样的问题,使用formData,但没有文件上传,效果很好。我做了很多研究,我发现在react native repo中仍然有一个活跃的。建议的解决方案是使用一个名为的库,但我无法在我的项目中实现它。如果你能让它工作,请分享你的工作。我也有同样的问题,使用formData,但没有文件上传,它工作得很好。我做了很多研究,我发现在react native repo中仍然有一个活跃的。建议的解决方案是使用一个名为的库,但我无法在我的项目中实现它。如果你能让它工作,请分享你的工作。你可能想检查android studio内部的Logcat。可能有一个更有用的stracktrace。您可能想检查android studio内部的Logcat。可能有更有用的stracktrace。