使用Api的图片上传错误Laravel + Vue

时间:2020-07-29 15:01:05

标签: api vuejs2 postman laravel-7

图像已使用邮递员成功保存,但是当我从vue cli调用api时,它显示状态为500的错误并且图像无法保存.... api.php中没有错误。.我在很多地方搜索了它。但是什么都行不通...有人可以帮助我吗?

Laravel控制器代码

public function store1(Request $request){
        $cover = $request->file('cover_image');
        $extension = $cover->getClientOriginalExtension();
        Storage::disk('public')->put($cover->getFilename().'.'.$extension,  File::get($cover));
    
        $book = new Image();
        $book->title = "Hammad";
        $book->body = "Habsha";
        $book->cover_image = $cover->getFilename().'.'.$extension;
        $book->save();
        return response()->json("success");
    }

Vue组件代码

<template>
  <div class="home">
    <br />
    <br />
    <h1>Home Page</h1>
    <br />
    <br />
    <br />
    <div class="container col-lg-4 offset-lg-4 col-md-3 offset-md-6">
      <form @submit.prevent="Formsubmit">
        <md-field>
          <label>Only images</label>
          <md-file id="single" @change="upload_avatar" accept="image/*" />
        </md-field>
        <md-button class="md-raised md-accent" type="submit">Accent</md-button>
      </form>
    </div>
  </div>
</template>

<script>
import { mapActions } from "vuex";
import axios from "axios";

export default {
  name: "home",
  components: {},
  data: () => ({
    single: null
  }),
  methods: {
    upload_avatar(e) {
      this.single = e.target.files[0];
      console.log(e);
    },
    Formsubmit() {
      let formData = new FormData();
      formData.append("cover_image", this.file);
      axios
        .post("http://127.0.0.1:8000/api/uploadImage", formData)
        .then(response => {
          console.log(response);
        });
    }
  }
};
</script>

0 个答案:

没有答案