Expo React Native 在后端将图像上传到 Laravel答案

【问题标题】：Expo React Native upload an image to Laravel in backendExpo React Native 在后端将图像上传到 Laravel
【发布时间】：2020-10-25 19:10:33
【问题描述】：

我对编码还很陌生，而且我正处于 React Native 和 Laravel 的学习阶段。我正在做一些练习项目，我需要将我的 React Native 应用程序中的图像上传到 Laravel 服务器，然后我可以从服务器将它保存在云或其他东西上。我可以使用 expo-image-picker 在应用程序上上传和显示图像，但我似乎无法使用 formData 将其发布到服务器。

另外，为什么当我 console.log formData 显示一个空对象？

我加载图片并上传的代码：

pickImage = async () => {
let result = await ImagePicker.launchImageLibraryAsync({
  mediaTypes: ImagePicker.MediaTypeOptions.All,
  allowsEditing: true,
  aspect: [4, 3],
  quality: 1,
});

console.log(result);
if(!result.cancelled)
{
  this.setState({
    image : result.uri
  })
}



// ImagePicker saves the taken photo to disk and returns a local URI to it
  let localUri = result.uri;
  //console.log("localUri:", localUri)
  let filename = localUri.split('/').pop();
  console.log("filename:", filename)

  // extract the filetype
  //let fileType = localUri.substring(localUri.lastIndexOf(".") + 1);
  //console.log(fileType)
  let fileType = localUri.substring(localUri.lastIndexOf(":") + 1,localUri.lastIndexOf(";")).split("/").pop();
  console.log("type:", fileType)

  let formData = new FormData();

  formData.append("photo", {
    uri : localUri,
    name: `photo.${fileType}`,
    type: `image/${fileType}`
  });

  console.log("formdata", formData)

  let options = {
    method: "POST",
    body: formData,
    headers: {
      Accept: "application/json",
      "Content-Type": "multipart/form-data"
    }
  };

  let response = await fetch(`${this.props.url}imagetest`, options)
  result = await response.json()
  console.log(result)

我在 Laravel 中的 api.php 的简单代码是：

Route::post("/imagetest", function (Request $request) {


return ["uploaded" => $request->hasFile("photo")];
});

【问题讨论】：

标签： laravel react-native expo

【解决方案1】：

找到解决方法

send image using Expo

我遇到的问题，我通过在网络上运行代码来测试它，当我在设备上运行它时，我可以看到表单数据以及图像也被上传了

【讨论】：