php - Laravel 5.5 多图上传

Question

我尝试使用 dropzoneJS 为我的产品上传多个图像，到目前为止，我可以将图像保存在数据库中，也可以保存在图像文件夹中，但是我在获取产品 ID 以将每个图像与产品相关联时遇到问题。

这是我所拥有的：

数据库

1. 产品（包括信息在内的我的产品将保存在哪里）
2. 图片（我的图片包括产品 ID 将保存提供的屏幕截图）

楷模

产品：

public function images()
  {
    return $this->morphMany(Image::class, 'imageable');
  }

图片：

class Image extends Model
{
  protected $fillable = ['name'];


  public function imageable()
  {
      return $this->morphTo();
  }

  public function product()
  {
  return $this->belongsTo(Product::class);
  }
}

图像架构

public function up()
    {
        Schema::create('images', function (Blueprint $table) {
            $table->increments('id');
            $table->integer('imageable_id')->nullable();
            $table->string('imageable_type')->nullable();
            $table->string('name');
            $table->timestamps();
        });
    }

图像控制器

class ImageController extends Controller
{
  public function dropzone()
  {
    return view('dropzone-view');
  }

  public function dropzoneStore(Request $request)
  {
    // works
    $file = $request->file('file');
    $filename = 'product' . '-' . time() . '.' . $file->getClientOriginalExtension();
    $filePath = public_path('images/');
    $request->file('file')->move($filePath, $filename);

    return Image::create([
      'name' => $filename,
      'imageable_id' => $request->input('imageable_id'),
    ])->id;

  }

}

产品创建（刀片）

// Form
{!! Form::open([ 'route' => [ 'dropzone.store' ], 'files' => true, 'enctype' => 'multipart/form-data', 'class' => 'dropzone mt-20', 'id' => 'my-awesome-dropzone' ]) !!}
 <div class="fallback">
   <input name="file" type="file" multiple />
 </div>
 <input type="hidden" name="imageIds[]" value="">
{{Form::close()}}

// Javascript
<script type="text/javascript">
Dropzone.autoDiscover = false;
var myDropzone = new Dropzone("form#my-awesome-dropzone", {
  headers: {
    "X-CSRF-TOKEN": $("meta[name='csrf-token']").attr("content")
  },
  acceptedFiles: ".jpeg,.jpg,.png,.gif",
  dictDefaultMessage: "Drag an image here to upload, or click to select one",
  maxFiles: 15, // Maximum Number of Files
  maxFilesize: 8, // MB
  addRemoveLinks: true,
});

myDropzone.on("success", function (response) {console.log(response.xhr.response); });

</script>

任何想法？

Answer 1

我通常做的是，

1. 上传图片后，返回新创建的图片的 ID（你已经在 ImageController 中这样做了）
2. 在您的产品页面上，在 dropzone 'success' 回调中，您可以读取图像 ID 并将其添加到隐藏数组输入字段
3. 在您的控制器中，您必须创建新产品，然后在保存后，您可以将图像附加到正确的产品上，因为现在您已经有了图像的 id + 产品实例。

Answer 2

控制器代码：

class ImageController extends Controller
{
  public function dropzone($id)
  {
$product = Product::find($id);
return view('dropzone-view')
      ->withProduct($porduct);
}
  public function dropzoneStore(Request $request)
  {
// works
$file = $request->file('file');
$filename = 'product' . '-' . time() . '.' . $file->getClientOriginalExtension();
$filePath = public_path('images/');
$request->file('file')->move($filePath, $filename);

return Image::create([
  'name' => $filename,
  'imageable_id' => $request->input('imageable_id'),
])->id;
  }
}

刀片视图代码：

{!! Form::open([ 'route' => [ 'dropzone.store' ], 'files' => true, 'enctype' => 'multipart/form-data', 'class' => 'dropzone mt-20', 'id' => 'my-awesome-dropzone' ]) !!}
 <div class="fallback">
  <input name="imageable_id" type="hidden" value="{{$product->id}}" />
<input name="file" type="file" multiple />
 </div>
{{Form::close()}}

试试这个，希望这能让你继续前进。这是使这件事发挥作用的众多方法之一。

Answer 3

这是一个态关系，这就是你如何获得态关系

$post = App\Post::find(1);

foreach ($post->comments as $comment) {
    //
}

在这里阅读多态关系