dileep-ramanatham/laravel-tinymce-simple-imageupload

在Laravel中使用TinyMCE的简单图片上传。

该软件包的官方仓库似乎已消失,因此软件包已被冻结。

1.3.1 2020-05-04 19:17 UTC

This package is auto-updated.

Last update: 2021-05-04 21:43:07 UTC


README

Laravel中TinyMCE的简单图片上传。

为什么制作这个?

因为我使用TinyMCE,而实际上,在编辑内容时直接上传图片到编辑器是非常困难的。目前有许多TinyMCE图片上传器,但它们的函数过于复杂,而我只需要一个核心用例,即选择并上传图片

就是这样,所以我为我的项目创建了这个包以便重用。好吧,如果你愿意,你也可以使用这个包。

此包与Laravel 5.0+兼容。

安装

对于Laravel 5.5+

$ composer require "petehouston/laravel-tinymce-simple-imageupload:~1.3"

对于Laravel 5.5之前的版本

$ composer require "petehouston/laravel-tinymce-simple-imageupload:~1.1"

对于Laravel 5.4及更早版本,您需要在config/app.php中注册服务提供者。

    'providers' => [
        ...

        Petehouston\Tinymce\TinymceServiceProvider::class,

    ]

用法

在包含TinyMCE设置的视图中,您需要包含上传视图,在底部添加此行,

@include('mceImageUpload::upload_form')

别担心,这个表单在您的视图中是隐藏的,没有人会看到它,因为它设置了display: none

下一步是向tinymce对象添加此配置,

    tinymce.init({
        // .. your config here
        relative_urls: false,
        file_browser_callback: function(field_name, url, type, win) {
            // trigger file upload form
            if (type == 'image') $('#formUpload input').click();
        }
    });

就这样,现在您应该能够在编写内容时直接上传图片到编辑器。

如果需要在resources/views目录中自定义,可以发布视图。

$ php artisan vendor:publish --provider=Petehouston\Tinymce\TinymceServiceProvider

尝试示例

该包中有一个设置示例,您可以通过添加一个示例路由在您的项目中尝试它,

Route::get('/tinymce_example', function () {
    return view('mceImageUpload::example');
});

一些注意事项

图片上传处理器

我已经设置了一个控制器Petehouston\Tinymce\TinymceController,它实现了一个用于图片上传的方法。

如您所见,所有上传的图片都将存储在public/img目录中,名称是一个连接的哈希值,

$filename = 'image_'.time().'_'.$image->hashName();

处理图片上传的默认路由是/tinymce/simple-image-upload

自定义上传URL和控制器

如果您不想使用包的预配置,请自定义自己的。

在包含上传表单时,传入处理POST图片上传的URL

@include('mceImageUpload::upload_form', ['upload_url' => 'YOUR_URL_FOR_HANDLING_IMAGE_UPLOAD'])

添加一个处理图片上传的方法,它应该返回与Petehouston\Tinymce\TinymceController中相同的结果。