Question

我在堆栈上的一些帖子中读到了有关此内容的信息，但我仍然没有看到与我相同的情况。我无法在手机设备上上传图像。我看不到为什么没有控制台可以看到错误。我将向您显示代码，以便有经验的人可以看到错误。

用于上传图片的Laravel代码：

public function uploadImage($car, $images)
{
    $fileName = Carbon::now()->timestamp . $images->getClientOriginalName();
    $path = $images->move(public_path('public/images'), $fileName);
    if (!$path) {
        return response()->json(['message' => 'An error has accured'], 500);
    }
    $carImage = new CarImages ([
        'path' => 'public/images/' . $fileName
    ]);

    $car->images()->save($carImage);
    return $carImage;
}

带有图像的商店表单的Laravel代码：

public function store(CarRequest $request)
{
    $file = null;
    if ($request->has('picture')) {
        $file = $request->file('picture');
    }
    $user = auth()->user();
    if ($user) {
        $car = Car::create([
            'car_type' => $request->input('car_type'),
            'mark' => $request->input('mark'),
            'model' => $request->input('model'),
            'user_id' => $user->id
        ]);
    }
    if (!$car) {
        return response()->json(['message' => 'Oooops, something went wrong'], 500);
    }
    if ($file) {
        $carImage = $this->uploadImage($car, $file);
    }
    Mail::to($user->email)->send(new NotifyNewCarUpload($user, $car));
    return response()->json([
        'message' => 'Your car has been successfully added',
        'car' => $car,
        'user' => $user
    ], 201);
}

在CarRequest中，我上传的汽车有：

  'car_type' => 'required',
  'mark' => 'required',
  'model' => 'required',
  'picture' => 'required|image'

在Vue.js插入汽车中，我有：

 <form enctype="multipart/form-data" accept-charset="utf-8" 
 @submit.prevent="submit">
 ...
 ...
        <div class="col-3 insert-vehicle-right">
           <div :class="{ 'error': errors.has('file') }" v-if="!imgSrc" class="image-upload-holder"></div>
            <img :class="{ 'error': errors.has('file') }" v-if="imgSrc" class="uploaded-image" :src="imgSrc" alt="uploaded image"/>
              <div class="upload-btn-wrapper">
                <button class="btn action-btn">Upload Photo</button>
                <input name="file"
                       v-validate="'required'"
                       type="file"
                       @change="onFileChange"/>
              </div>
            </div>
          </div>
          <div class="row">
            <div class="col-12">
              <button type="submit" class="btn action-btn save-btn">Save</button>
            </div>
 </form>

用于上传和预览图像代码的Vue.js javascript代码：

  onFileChange(event) {
    this.picture = event.target.files[0];
    const file = event.target.files[0];
    this.imgSrc = URL.createObjectURL(this.picture);
  },

我有formData代码用于发布该代码：

 ...
 ...
formdata.append('picture', this.picture);

它不适用于手机。有人知道原因吗？我所有的图片都存储在laravela文件夹public / public / images中，并且可以在Web浏览器（destop和便携式设备）上正常工作。我也有用于存储路径图像的表。仅适用于电话设备。帮助吗？

Answer 1

Okey问题出在php.ini配置文件和max_size_upload文件中。我只设置了超过2mb的图像文件，并且工作完美。 @感谢Rasa

无法仅在移动设备Laravel + Vue上上传图像

1 个答案: