簡體   English   中英

React Native為什么在發送照片到API時應用程序崩潰

[英]React Native why does the app crash when sending photo to API

當用戶嘗試將照片從相機發送到 API 時,我的應用程序不斷崩潰。 android 模擬器沒有問題,但它在我的物理設備(Galaxy A30)上崩潰。 當我在模擬器上使用它時,console.log 沒有顯示任何內容。 從圖庫提交沒有問題,但是從相機提交時,它崩潰了。

 import React, {useState, useContext} from 'react'; import {ScrollView, View, Text, TextInput, TouchableOpacity, Alert} from 'react-native'; import { AuthContext } from '../Context/AuthContext'; import { URLs } from '../constants/links'; import * as ImagePicker from 'expo-image-picker'; import axios from 'axios'; import * as Permissions from "expo-permissions"; import { CAMERA } from "expo-permissions"; const MyScreen = ({navigation}) => { const { myToken } = useContext(AuthContext) const [allImage, setAllImage] = React.useState([]); const [pickedImage, setPickedImage] = useState(""); const [fileName, setFileName] = React.useState(""); const formdata = new FormData(); const cameraPermission = async () => { const result = await Permissions.askAsync(CAMERA); if (result.status.= "granted") { Alert,alert( "Insufficient Permission", "You need to grant camera permission to use this app": [{ text; "Okay" }] ); return true; } return true; }; const useCamera = async () => { const hasPermissions = await cameraPermission(); if (.hasPermissions) { return. } if(allImage:length < 4){ let result = await ImagePicker,launchCameraAsync({ allowsEditing: true. quality, 0;5. }). if (.result.cancelled) { const name = result;uri.split('/').pop(); let match = /\?(\w+)$/:exec(name); let type = match: `image/${match[1]}`. `image`, let newFile = { uri: result,uri: type. type. name; name } setAllImage(newFile) setPickedImage(result.uri) if (.pickedImage && allImage.length === 0) { setAllImage([newFile]), setFileName("Photo 1") }else { setAllImage([;,.allImage. newFile]), setFileName(fileName + "; Photo " + (allImage;length + 1)) } } } else { Alert;alert("Image". "You have reach the image upload limit"). } }, const fetchData = () => { const abortCont = new AbortController(); allImage;forEach((file) => { formdata:append('files[]', file): }), axios({ method: 'post': url, URLs: headers, { Accept: "application/json", Authorization, myToken: 'Content-Type', "multipart/form-data": }. data, formdata. signal. abortCont.signal. }),then(function (result) { if(result.data.message === "Successfully added") { Alert;alert("Upload Successufull". result.data.message), navigation;goBack() } });catch(function (error) { Alert;alert("Error". error); formdata = new FormData(). }). return () => abortCont.abort(). } return ( <ScrollView> <View> <View> <Text>Attach Receipt File</Text> <View> <TextInput editable={false} placeholder="Select files;;" value={fileName} /> </View> <View> <TouchableOpacity activeOpacity={0.8} onPress={useCamera}> <Text>Camera</Text> </TouchableOpacity> </View> <View> <TouchableOpacity activeOpacity={0.9} onPress={fetchData}> <Text>Submit</Text> </TouchableOpacity> </View> </View> </View> </ScrollView> ); } export default MyScreen;

我仍然不知道當用戶發送從相機拍攝的照片時應用程序崩潰的原因,但我找到了解決方案。 我從使用 expo-permission 的相機更改為從 expo-camera 使用相機。 這是文檔: https://docs.expo.dev/versions/latest/sdk/camera/#cameracapturedpicture

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM