PHP在上传图像时从React Native接收空数据吗? [英] PHP receiving null data from React Native while uploading images?
问题描述
这花了我一段时间，因为在应用程序屏幕上，我得到的只是JSON Parse Error: '<'.感谢error_log，我在PHP中发现了以下错误:
This took me a while to figure out because on the app screen all I was getting was JSON Parse Error: '<'. Thanks to the error_log, I found these errors in PHP:
[29-Jun-2018 19:35:34 America/Chicago] PHP Deprecated: Automatically populating $HTTP_RAW_POST_DATA is deprecated and will be removed in a future version. To avoid this warning set 'always_populate_raw_post_data' to '-1' in php.ini and use the php://input stream instead. in Unknown on line 0
[29-Jun-2018 19:35:34 America/Chicago] PHP Warning: explode() expects parameter 2 to be string, array given in React/user-image-upload.php on line 17
[29-Jun-2018 19:35:34 America/Chicago] PHP Warning: end() expects parameter 1 to be array, null given in React/user-image-upload.php on line 18
[29-Jun-2018 19:35:34 America/Chicago] PHP Warning: preg_match() expects parameter 2 to be string, array given in React/user-image-upload.php on line 27
[29-Jun-2018 19:35:34 America/Chicago] PHP Warning: unlink() expects parameter 1 to be a valid path, array given in React/user-image-upload.php on line 30
这是我上传图片的php代码:
And here is my php code for uploading the images:
<?php
// Getting the received JSON into $json variable.
$json = file_get_contents('php://input');
// decoding the received JSON and store into $obj variable.
$obj = json_decode($json,true);
$fileName = $obj["userimgSource"]; // The file name
$fileTmpLoc = $obj["userimgSource"]; // File in the PHP tmp folder
$fileType = $obj["userimgSourceType"]; // The type of file it is
$fileSize = $obj["userimgSourceSize"]; // File size in bytes
$fileErrorMsg = $_FILES["uploaded_file"]["error"]; // 0 for false... and 1 for true
$kaboom = explode(".", $fileName); // Split file name into an array using the dot
$fileExt = end($kaboom); // Now target the last array element to get the file extension
// START PHP Image Upload Error Handling --------------------------------------------------
if (!$fileTmpLoc) { // if file not chosen
echo json_encode("ERROR: Please browse for a file before clicking the upload button.");
exit();
} else if($fileSize > 5242880) { // if file size is larger than 5 Megabytes
echo json_encode("ERROR: Your file was larger than 5 Megabytes in size.");
unlink($fileTmpLoc); // Remove the uploaded file from the PHP temp folder
exit();
} else if (!preg_match("/.(gif|jpg|jpe|jpeg|png)$/i", $fileName) ) {
// This condition is only if you wish to allow uploading of specific file types
echo json_encode("ERROR: Your image was not .gif, .jpg, .jpe, or .png.");
unlink($fileTmpLoc); // Remove the uploaded file from the PHP temp folder
exit();
}
// END PHP Image Upload Error Handling ----------------------------------------------------
// Place it into your "uploads" folder mow using the move_uploaded_file() function
$moveResult = move_uploaded_file($fileTmpLoc, "../profiles/uploads/$fileName");
// Check to make sure the move result is true before continuing
if ($moveResult != true) {
echo json_encode("ERROR: File not uploaded. Try again.");
unlink($fileTmpLoc); // Remove the uploaded file from the PHP temp folder
exit();
}
if ($moveResult == true) {
$db = mysqli_connect("localhost", "root", "password", "photos");
$sql = "INSERT INTO user_images (images,date) VALUES ('$fileName',CURDATE())";
mysqli_query($db, $sql);
echo json_encode("Success: File uploaded.");
}
unlink($fileTmpLoc); // Remove the uploaded file from the PHP temp folder
?>
在向我展示所有我的React本机代码之前，我只想说我不熟悉RN中的图像上传.我在SO上阅读了许多问题，以了解如何做到这一点，并观看了一些youtube视频.我不知道我是否应该使用base64(如果有人可以向我解释那会很好)，据我所知，我只是在提取图像路径，图像大小和图像类型，然后插入该图像我的文件夹和数据库的路径:
Before I show you all my react native code I just want to say that I am unfamiliar when it comes image uploading in RN. I read many questions on SO to find out how to do it and watched some youtube videos. I don't know if I am supposed to use base64 (if anyone can explain that to me that would be great), to my knowledge I am just pulling the image path, the image size, and image type then inserting that image path to my folder and the database:
SelectPhoto = () =>{
ImagePicker.openPicker({
cropping: true,
title: 'Select an image',
isCamera: true,
}).then((imgResponse) => {
console.log(imgResponse);
let imgSource = { uri: imgResponse[0].path.replace(/^.*[\\\/]/, '') };
this.setState({
userimgSource: imgSource,
userimgSourceType: imgResponse[0].mime,
userimgSourceSize: imgResponse[0].size,
});
});
}
UploadPhoto = () =>{
fetch('https://www.example.com/React/user-image-upload.php', {
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
},
body: JSON.stringify({
userimgSource : this.state.userimgSource,
userimgSourceType: this.state.userimgSourceType,
userimgSourceSize: this.state.userimgSourceSize,
})
}).then((response) => response.json())
.then((responseJson) => {
// Showing response message coming from server after inserting records.
Alert.alert(responseJson);
}).catch((error) => {
console.error(error);
});
}
这里是造成混乱的地方.实际上，当我console.log我的userimgSource: imgSource, userimgSourceType: imgResponse[0].mime, userimgSourceSize: imgResponse[0].size,时，我确实获得了正确的数据.我得到的图像路径:IMG_2018629.png，哑剧:image/png和大小:2,097,152.为什么PHP无法从React Native中提供的数据中提取数据?
Here is where the confusion comes in. When I console.log my userimgSource: imgSource, userimgSourceType: imgResponse[0].mime, userimgSourceSize: imgResponse[0].size, I, in fact, do get the correct data. I get the image path: IMG_2018629.png, the mime: image/png, and the size: 2,097,152. Is there a reason why PHP is not able to pick up the data from what was given in React Native?
推荐答案
将标题更改为此
headers: {
'Accept': '*',
'Content-Type': 'multipart/form-data',
}
-
当您上传图像时，其内容类型不能为 'application/json'.
As you are upload image its content-type cannot be 'application/json'.
接受请求标头"字段可用于指定响应可接受的某些媒体类型.因此，加星号将使您的请求接受任何类型的响应.
The Accept request-header field can be used to specify certain media types which are acceptable for the response. So adding star will make your request to accept any type of response.
这篇关于PHP在上传图像时从React Native接收空数据吗?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
