Laravel 项目中结合第三方编辑器的方法

 

 

　　第三方的js 插件使用肯定先要进行引入，然后按照文档规划目录将 js css font .... 要依赖的文件导入到文件夹

　　然后根据 文档进行生成一个 demo 

 

 

　　在文本编辑器中取出来时候很可能要将标签和内容原样输出:

　　　　　　{!!  str_limit($post->content, 1200, '... ...') !!}

　　

　　图片上传的功能:

　　　　　　wangEditor API 实现

　　　　　　https://www.kancloud.cn/wangfupeng/wangeditor3/332599

 

　　　

给个路由:

//uploadImg 
Route::post('/article/upload_img/uploadImg','ArticleController@uploadImg');

 

 

Editor Js use:

　　

var editor = new wangEditor('content');

editor.config.uploadImgUrl = '/article/upload_img/uploadImg';

// 设置 headers（举例）
editor.config.uploadHeaders = {
    'X-CSRF-TOKEN' : $('meta[name="csrf-token"]').attr('content')
};    // 在 CSRF 章节--    laravel 手册 中
　　　　　　手册地址:     http://d.laravel-china.org/docs/5.4/csrf#csrf-x-csrf-token

editor.create();



页面要进行带token 的传递验证因此要添加一个 token  

<meta name="csrf-token"  content="{{csrf_token()}}"  >   //  在所有页面的头上都应该添加一个 meta 标签 进行提交时候的 token 验证

 

<meta name="csrf-token"  content="{{csrf_token()}}"  >   //  在所有页面的头上都应该添加一个 meta 标签 进行提交时候的 token 验证

　　CSRF--    laravel 手册 中

 

 进行上传图片将 磁盘进行连接  也就是默认访问的资源存在   public/   通过创建链接将 stroge/public  和 public / 连接起来 使图片上传直接到   stroge / public

　　　先修改 config/ filesystem.php 将 default=>'locale' 改成 public

　　　执行:   php artisan link:stroge

　　　手册和文档:　http://d.laravel-china.org/docs/5.4/filesystem#公开磁盘

　　

进行图片上传的方法

　　// editor.config.uploadImgUrl = '/article/upload_img/uploadImg';
   //UploadImg
    public function uploadImg(Request $upload)
    {
        $path = $upload->file('wangEditorH5File')->storePublicly(md5(time()));
        return asset('storage/'.$path);
    }


　　file()
　　storePublicly()

　　文件上传的文档:
　　　　　　http://d.laravel-china.org/docs/5.4/filesystem#文件上传

　　asset('');  获取这个路径的http链接 return 出来处理结果存到 数据库中