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);
    }
}

zotyo / ajax-file-uploader

Maintainers

Details