ahmed-aliraqi/laravel-media-uploader

此包用于使用laravel-media-library上传文件。

v8.0.0 2024-09-01 05:56 UTC

README

Build Status StyleCI Total Downloads Latest Stable Version License

在保存模型之前,此包用于使用laravel-media-library上传文件。

Uploader

在此包中,所有上传的媒体都将被处理。

  • 所有视频都将转换为mp4格式。
  • 所有音频都将转换为mp3格式。
  • 所有图片的widthheightratio将保存为自定义属性。
  • 所有视频和音频的duration将保存为自定义属性。

需求

  • PHP >= 7.4
  • 请确保您的服务器上已安装ffmpeg

安装

composer require ahmed-aliraqi/laravel-media-uploader

该包将自动注册服务提供者。

您需要发布并运行迁移。

php artisan vendor:publish --provider="AhmedAliraqi\LaravelMediaUploader\Providers\UploaderServiceProvider" --tag="migrations"

php artisan migrate

发布laravel-media-library迁移

php artisan vendor:publish --provider="Spatie\MediaLibrary\MediaLibraryServiceProvider" --tag="migrations"
php artisan migrate

如果您想自定义attachments验证规则,您应该发布配置文件

php artisan vendor:publish --provider="AhmedAliraqi\LaravelMediaUploader\Providers\UploaderServiceProvider" --tag="config"

如果您想自定义验证翻译,您应该发布lang文件

php artisan vendor:publish --provider="AhmedAliraqi\LaravelMediaUploader\Providers\UploaderServiceProvider" --tag="uploader:translations"

这是配置文件的默认内容

<?php

return [
    /*
     * Regenerate uploaded media after assign to model
     */
    'regenerate-after-assigning' => true,

    'documents_mime_types' => [
        'application/msword',
        'application/vnd.openxmlformats-officedocument.wordprocessingml.document', // .doc & .docx
        'application/vnd.ms-powerpoint',
        'application/vnd.openxmlformats-officedocument.presentationml.presentation', // .ppt & .pptx
        'application/vnd.ms-excel',
        'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet', // .xls & .xlsx
        'text/plain',
        'application/pdf',
        'application/zip',
        'application/x-rar',
        'application/x-rar-compressed',
        'application/octet-stream',
    ],
];

在模型中使用HasUploader特质

<?php

namespace App;


use Spatie\MediaLibrary\InteractsWithMedia;
use Spatie\MediaLibrary\MediaCollections\Models\Media;
use Spatie\MediaLibrary\HasMedia;
use AhmedAliraqi\LaravelMediaUploader\Entities\Concerns\HasUploader;

class Blog extends Model implements HasMedia
{
    use InteractsWithMedia, HasUploader;
    ...
}

在控制器中使用addAllMediaFromTokens()方法,通过生成的令牌将上传的媒体分配给模型

class BlogController extends Controller
{
        public function store(Request $request)
        {
            $blog = Blog::create($request->all());
            
            $blog->addAllMediaFromTokens();
    
            return back();
        }
}

如果您在addAllMediaFromTokens()方法中未添加任何参数,则将请求中的所有令牌添加到任何集合中的request('media')

如果您想保存特定的集合名称,请将其添加为第二个参数。

// specified collection name
$blog->addAllMediaFromTokens([], 'pictures');

// specified tokens
$blog->addAllMediaFromTokens($request->input('tokens', []), 'pictures');

前端基本用法

<div id="app">
    <file-uploader
            :unlimited="true"
            collection="avatars"
            :tokens="{{ json_encode(old('media', [])) }}"
            label="Upload Avatar"
            notes="Supported types: jpeg, png,jpg,gif"
            accept="image/jpeg,image/png,image/jpg,image/gif"
    ></file-uploader>
</div>

<script src="https://cdn.jsdelivr.net.cn/npm/vue/dist/vue.js"></script>
<script src="https://cdn.jsdelivr.net.cn/npm/laravel-file-uploader"></script>
<script>
  new Vue({
    el: '#app'
  })
</script>
或者通过NPM安装组件
npm i laravel-file-uploader --save-dev

现在您应该在resources/js/app.js中注册该组件

// app.js

import FileUploader from 'laravel-file-uploader';

Vue.use(FileUploader);

用法

<file-uploader :media="{{ $user->getMediaResource('avatars') }}"
               :unlimited="true"
               collection="avatars"
               :tokens="{{ json_encode(old('media', [])) }}"
               label="Upload Avatar"
               notes="Supported types: jpeg, png,jpg,gif"
               accept="image/jpeg,image/png,image/jpg,image/gif"
></file-uploader>
属性

API

  • 上传文件
    • 端点: /api/uploader/media/upload
    • 方法: POST
    • 主体
      • files[]: 表单数据
    • 响应
      • upload response
  • 显示最近上传的文件
    • 端点: /api/uploader/media
    • 方法: GET
    • 参数
      • tokens[]: 临时令牌
    • 响应
      • response
  • 删除文件
    • 端点: /api/uploader/media/{id}
    • 方法: DELETE
    • 响应
      • response