react-native 上传图片之Network reques
2020-08-08 本文已影响0人
YQSummer
react--native环境:0.63.0
插件 import ImagePicker from 'react-native-image-picker';
Android使用fetch/xhr 请求上传图片一直出现 Network request failed,进行其他正常请求都没问题,查了很多问题找到了解决方案,如下:
在android文件中找到对应的文件,修改
image.png
文件路径:
android/app/src/debug/java/com/xxx/ReactNativeFlipper.java
打开文件,找到第43行,将其注释掉
image.png
(正式环境)当然在打包时您可能还需要做一些其他的改动
找到对应文件
android\app\src\main\java\com\xxxxx\MainApplication.java
打开文件找到onCreate方法,将其中的代码注释掉
initializeFlipper(this, getReactNativeHost().getReactInstanceManager());
image.png
改完android文件后记得重新运行项目哦。
附上上传的图片代码
ImagePicker.launchImageLibrary(options, (response) => { //相册
if (response.didCancel) {
console.log('User cancelled image picker');
} else if (response.error) {
console.log('ImagePicker Error: ', response.error);
} else {
let uri;
if(Platform.OS === 'android'){
uri = response.uri
}else {
uri = response.uri.replace('file://', '')
}
let body = new FormData();
body.append('file', {
uri: uri,
size: response.fileSize,
type: response.type,
name: response.fileName,
filename:response.fileName,
});
body.append('type','1')
const headers = { "content-type": "multipart/form-data", "accept": "application/json",'userId':userId }
return fetch(`${baseUrl}/file/upload`, {
method: 'POST',
headers,
body,
})
.then((response) => response.json())
.then((res) => {}
})
}
})
参考文献:https://github.com/facebook/react-native/issues/28551
https://blog.csdn.net/qq_41457238/article/details/107221449