Unable to upload image (React native, Laravel)

Question

I have been trying this for a while but no success

Back-end

public function createInspection(Request $request) {
   $path = Storage::disk('public')->putFile('bin_images', new File($request->file('image')));
   return $path;    
}

Client

data.append("image", {
  uri: this.state.images[0].path,
  type: this.state.images[0].mime,
  size: this.state.images[0].size,
  name: filename
});

this.props.sendInspection(data)

Service (shortend)

const res = await axios.post(url, data, {
    headers: {
      Authorization: `Bearer ${token}`,
      Accept: "application/json",
      "Content-Type": "multipart/form-data"
    }
  });

im not sure if it's something to do with path not being recongnized (ios image path) e.g. path : /private/var/mobile/Containers/Data/Application/B6FEB0FD-F9C8-4088-B15F-99D27A818C76/tmp/react-native-image-crop-picker/7BD81594-30E0-4E00-919C-4F353BBDE46F.jpg

I get this error

message: "The file "" does not exist", exception: "Symfony\Component\HttpFoundation\File\Exception\FileNotFoundException", file: "/Users/ysr/tza-project/vendor/symfony/http-foundation/File/File.php", line: 37, file: "/Users/ysr/tza-project/vendor/symfony/http-foundation/File/MimeType/MimeTypeGuesser.php", line: 116

can you do this php public function createInspection(Request $request) { dd($request->allFiles()); } what does it show to you? — Vladyslav Startsev
– Vladyslav Startsev, Commented Aug 30, 2018 at 23:15
I think you've googled, but still check this issues github.com/laravel/framework/issues/… so on the frontend, check file size - show it to us on the backend, check file size - show it to us on the backend, print phpinfo() (for example in your index.php before everything) and show variables like settings upload_max_filesize and post_max_size — Vladyslav Startsev
– Vladyslav Startsev, Commented Aug 30, 2018 at 23:18

Mohammad Nourinik · Accepted Answer · 2018-08-30 19:19:17Z

1

the problem seems to be with your backend, check the documentation.

you should do something like this:

public function update(Request $request)
{
    $path = $request->file('image')->store('images');

    return $path;
}

and in case you wanna use putFile then may use:

$path = Storage::putFile('images', $request->file('image'));

and if it needs to change the disk then:

$path = Storage::disk('public')->putFile('images', $request->file('image'));

answered Aug 30, 2018 at 19:19

Mohammad Nourinik

1892 silver badges5 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Yasir Over a year ago

I tried all too but still the same error. I even switched to fetch still the same error. Not sure what else to do!

Mohammad Nourinik Over a year ago

Have you got your file in back end? You may determine if a file is present on the request using the hasFile method: if ($request->hasFile('photo')) { dump('some thing') }

Aaqib Khan · Accepted Answer · 2018-08-31 05:53:57Z

0

I don't know react very well but it seems that you are passing only image properties but not image file or image data in bytes.

Try changing your code:

data.append("image", {
  uri: this.state.images[0].path,
  type: this.state.images[0].mime,
  size: this.state.images[0].size,
  name: filename
});

To this code:

data.append("image", {
  file: this.state.images[0],
  uri: this.state.images[0].path,
  type: this.state.images[0].mime,
  size: this.state.images[0].size,
  name: filename
});

or also try changing Content-Type to 'multipart/form-data; boundary=${data._boundary}'

If your image is base64 then you need to do few changes in API as below:

$path = 'bin_images/file_name.jpeg';
$image = str_replace('data:image/png;base64,', '', $request->image);
$image = str_replace(' ', '+', $image);
Storage::put($path, base64_decode($image));

edited Aug 31, 2018 at 5:53

answered Aug 30, 2018 at 19:18

Aaqib Khan

3342 silver badges11 bronze badges

4 Comments

Yasir Over a year ago

is file here the base64 data ?

Aaqib Khan Over a year ago

No. File should be the actual uploaded file (in bytes format, not base64).

Aaqib Khan Over a year ago

If you have base64 than change Content-Type to application/x-www-form-urlencoded

Aaqib Khan Over a year ago

Please have a look into this thread. It might help: stackoverflow.com/questions/39663961/…

Collectives™ on Stack Overflow

Unable to upload image (React native, Laravel)

2 Answers 2

2 Comments

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related