zotyo / ajax-file-uploader
Upload your files separately then just attach the uploaded file's id to your form
Requires
- ramsey/uuid: ^3.0
This package is not auto-updated.
Last update: 2017-10-17 10:09:54 UTC
README
This package is offering you a more convenient way to manage file uploads.
It provides the following:
- an endpoint for uploading files
- a user friendly Vue-component for replacing the regular
- helper trait for your Eloquent models to easily create accessors/mutators
- a validation-rule for validating files of your models/entities
By default the package is configured to upload images but you can use for any mime type.
Installation
Add the following line to you composer.json
"zotyo/ajax-file-uploader": "dev-master"
After downloading the package, add PackageServiceProvider to the providers array of your config/app.php
Zotyo\AjaxFileUploader\PackageServiceProvider::class
Finally you should publish config of the package with some examples.
php artisan vendor:publish --provider="Zotyo\AjaxFileUploader\PackageServiceProvider"
Usage
Several components come with the package to reduce the effort of implementing a proper file-upload.
Note: It's really recommended to submit your entities via javascript instead of native html form submit. However it is not mandatory.
File-input
You can publish a file-input.vue component into your /resources/assets/js/components folder. Modify the component so it would fit into your design.
<div class="form-group"> <label for="avatar">Avatar</label> <file-input id="avatar" v-model="user.avatar"></file-input> </div>
Endpoint(Route+Controller)
The package provides an Http endpoint for uploading files. You can disable the endpoint int the configuration file. If you would like to define your custom endpoint, you can still reuse UploadControllerTrait.
Method | URI | Name | Action
POST | upload | | Zotyo\AjaxFileUploader\Http\UploadController@upload
Validation
Don't forget to validate files when submitting your entities. The package provides the verify-file-by-token validation rule to avoid hijacking of files.
<?php namespace App\Http\Requests; use Illuminate\Foundation\Http\FormRequest; class UserFormRequest extends FormRequest { public function rules() { return [ 'avatar' => 'required|verify-file-by-token' ]; } }
Eloquent
The HasFile trait provides methods so you can easily create accessors/mutators in you model. In the following example, our User model avatar is an file.
<?php namespace App; use Illuminate\Foundation\Auth\User as Authenticatable; use Zotyo\AjaxFileUploader\HasFile; class User extends Authenticatable { use HasFile; protected $fillable = ['avatar']; protected $appends = ['avatar']; public function getAvatarAttribute() { return $this->getFile('avatar'); } public function setAvatarAttribute($value) { $this->setFile('avatar', $value); } }