laravel-admin 配置富文本编辑器流程
laravel-admin默认去除富文本编辑器的,官方也给出了配置方法。
我配置的是wangEditor,本来配置完后就能愉快得使用了,可万万没想到还是有坑的。默认是用base64上传的,也就是数据库中保存的是base64!!!果然报错了,显示
Data too long for column 'content'
开始觉得base64也未尝不可,文章插图不会太多,百度了下要求修改mysql的max_allowed_packet。尝试后还是发现没作用。
还是回归富文本编辑器吧,在官网上看到图片上传到服务器和OSS的方法。然后就顺藤摸瓜解决问题,异步方式上传图片,再保存路径到数据库中。
代码如下
//wangEditor.php
public function render()
{
$name = $this->formatName($this->column);
$this->script = <<<EOT
var E = window.wangEditor
var editor = new E('#{$this->id}');
editor.customConfig.zIndex = 0
editor.customConfig.uploadImgServer = '/admin/api/upload'
editor.customConfig.uploadFileName = 'img'
editor.customConfig.onchange = function (html) {
$('input[name=\'$name\']').val(html);
}
editor.create() EOT;
return parent::render();
}
//修改filesystems.php文件,为了方便root为public目录
'local' => [
'driver' => 'local',
'root' => public_path('app'),
],
//VerifyCsrfToken.php中间件 添加
protected $except = [
'/admin/api/*'
];
//api.php 接口方法
public function upload(Request $request){
$path = Storage::disk('local')->putFile('images', $request->file('img'));
$p = '/app/'.$path;
return response()->json(['errno'=>0,'data'=>[$p]]);
}
最后记得把接口加到路由中,完成。
laravel-admin 配置富文本编辑器流程的更多相关文章
- Django配置富文本编辑器kindeditor
一.简介 django是一个容易快速上手的web框架,用它来创建内容驱动型的网站(比如独立博客)十分方便.遗憾的是,django并没有提供官方的富文本编辑器,而后者恰好是内容型网站后台管理中不可或缺的 ...
- Django-xadmin后台配置富文本编辑器(方法一)
1.https://github.com/twz915/DjangoUeditor3下载包,进入包文件夹,找到DjangoUeditor包拷贝到项目下,和xadmin同级目录 2.找到项目的setti ...
- day82:luffy:课程详情页面显示&章节和课时显示&视频播放组件&CKEditor富文本编辑器
目录 1.初始课程详情页面 2.视频播放组件 3.课程详情页面后端接口实现 4.课程详情页面-前端 5.CKEditor富文本编辑器 6.课程章节和课时显示-后端接口 7.课程章节和课时显示-前端 1 ...
- Django之富文本编辑器
1.在虚拟环境中安装包. pip install django-tinymce==2.6.0 2.在配置文件中INSTALLED_APPS注册 3.配置富文本编辑器的宽高 4.配置编辑器url.
- Django xadmin后台添加富文本编辑器UEditor的用法
效果图: 步骤: 1.利用命令:pip install DjangoUeditor,安装DjangoUeditor,但由于DjangoUeditor没有python3版本的,从的Github上把修改好 ...
- 给Django后台富文本编辑器添加上传文件的功能
使用富文本编辑器上传的文件是要放到服务器上的,所以这是一个request.既然是一个request,就需要urls.py进行转发请求views.py进行处理.views.py处理完了返回一个文件所在的 ...
- MVC5富文本编辑器CKEditor配置CKFinder
富文本编辑器CKEditor的使用 *:first-child { margin-top: 0 !important; } body>*:last-child { margin-bottom: ...
- django的admin或者应用中使用KindEditor富文本编辑器
由于django后台管理没有富文本编辑器,看着好丑,展示出来的页面不美观,无法做到所见即所得的编辑方式,所以我们需要引入第三方富文本编辑器. 之前找了好多文档已经博客才把这个功能做出来,有些博客虽然写 ...
- django 开发之给admin 模块添加富文本编辑器
第一步下载kindeditor http://kindeditor.net/demo.php 下载下来后放到静态文件static 下面的js下面 接着在admin 模块文章类下引入这富文本编辑器: ...
随机推荐
- vue2.x源码理解
也不知道哪股风潮,钻研源码竟成了深入理解的标配.我只想说一句,说的很对 准备工作 从GitHub上面下载vue的源码(https://github.com/vuejs/vue) 了解下Flow,Flo ...
- 【Advanced Windows Phone Programming】在windows phone 8中解码mp3 和编码pcm
转眼间不做wp开发,投身于php事业已然一年了,转身看到8.1的发布,俨然一片欣欣向荣的景象,但是开发社区却没比一年前有过多大的提高,这并不是一个好现象,遂在git上开源了之前音频处理库,希望能对社区 ...
- 关于AngularJs中监听事件及脏循环的理解
可能很多刚入行或者刚学习的前端对于AngularJs中的一些事件或者概念感觉不理解或者没有思路,今天让我们一起来剖析一下AngularJs中的一些事件. AngularJs中对于的监听事件会用到一个s ...
- js程序开发-2
<h1>DOM节点操作</h1> createElement() 创建节点:返回一个元素对象; cloneNode() 克隆节点,接受一个参数deep,值为true或false ...
- org.jetbrains.android.uipreview.RenderingException: Failed to load the LayoutLib: com/android/layoutlib/bridge/Bridge : Unsupported major.minor version 52.0
在Android Studio使用的时候,突然发现Preview功能不能用了,报了一个错,错误如下 org.jetbrains.android.uipreview.RenderingException ...
- SSAS GUID 添加 行计数,非重复计数 等 遇到的莫名其妙的问题
在基于某个GUID 进行非重复性计数时 需要对GUID 转换类型,如:CAST(ColumnName as varchar(36)) 可参考:http://stackoverflow.com/ques ...
- 【eclipse插件开发实战】 Eclipse插件开发6——eclipse在线翻译插件Translator开发实例详解
Eclipse插件开发6--eclipse在线翻译插件Translator开发实例详解 在上一篇文章中讲到了一个简单的eclipse插件开发实例,主要是对插件工程的基本创建步骤进行了讲解,这篇文章当中 ...
- 20个Flutter实例视频教程-第10节: 一个不简单的搜索条-1
20个Flutter实例视频教程-第10节: 一个不简单的搜索条-1 视频地址: https://www.bilibili.com/video/av39709290/?p=10 博客地址: https ...
- Linux 获取文件属性
使用stat/lstat获取文件属性 头文件:#include <sys/types.h> #include <sys/stat.h> int stat(const char ...
- 学习RadonDB源码(二)
1. 为我新的一天没有放弃而喝彩 学习是一件很容易放弃的事情,因为就算是不学,我也能在现在的岗位上发光发热.可是人不就是一个热爱折腾的种群吗? 今天没有放弃不代表明天没有放弃,也许放弃的可能性大于坚持 ...