ueditor 百度富文本编辑器后端配置(上传图片)

简介: ueditor 百度富文本编辑器后端配置(上传图片)

在前端已经写好的情况下进行以下操作

1,在public/assets/addons/ueditor内新建 config.json并加入以下代码

{
    "imageActionName": "uploadimage",
    "imageFieldName": "upfile",
    "imageMaxSize": 2048000,
    "imageAllowFiles": [".png", ".jpg", ".jpeg", ".gif", ".bmp"],
    "imageCompressEnable": true,
    "imageCompressBorder": 1600,
    "imageInsertAlign": "none",
    "imageUrlPrefix": "",
    "imagePathFormat": "/uploads/{yyyy}{mm}{dd}/{time}{rand:6}",
    "videoActionName": "uploadvideo",
    "videoFieldName": "upfile",
    "videoPathFormat": "/uploads/{yyyy}{mm}{dd}/{time}{rand:6}",
    "videoUrlPrefix": "",
    "videoMaxSize": 102400000,
    "videoAllowFiles": [".flv", ".swf", ".mkv", ".avi", ".rm", ".rmvb", ".mpeg", ".mpg", ".ogg", ".ogv", ".mov", ".wmv", ".mp4", ".webm", ".mp3", ".wav", ".mid"],
    "fileActionName": "uploadfile",
    "fileFieldName": "upfile",
    "filePathFormat": "upload/file/{yyyy}{mm}{dd}/{time}{rand:6}",
    "fileMaxSize": 102400000,
    "fileAllowFiles": [
        ".png", ".jpg", ".jpeg", ".gif", ".bmp",
        ".flv", ".swf", ".mkv", ".avi", ".rm", ".rmvb", ".mpeg", ".mpg",
        ".ogg", ".ogv", ".mov", ".wmv", ".mp4", ".webm", ".mp3", ".wav", ".mid",
        ".rar", ".zip", ".tar", ".gz", ".7z", ".bz2", ".cab", ".iso",
        ".doc", ".docx", ".xls", ".xlsx", ".ppt", ".pptx", ".pdf", ".txt", ".md", ".xml", ".crx"
    ]
}

2,写上传图片接口

public function index()
    {
        $action = $this->request->param('action');
        switch($action){
            case 'config':
                $result = file_get_contents(ROOT_PATH.'/public/assets/addons/uetidor/config.json');//第一步时json文件的路径
                break;
            case 'uploadimage':
                $file = $this->request->file('upfile');
                if($file){
                    $info = $file->move(ROOT_PATH . 'public' . DS . 'uploads');
                    $res = $info->getInfo();
                    $res['state'] = 'SUCCESS';
                    $res['url'] = '/uploads/'.$info->getSaveName();
                    $result = json_encode($res);
                }
                break;
            case 'uploadvideo':
                $file = $this->request->file('upfile');
                if($file){
                    $info = $file->move(ROOT_PATH . 'public' . DS . 'uploads');
                    $res = $info->getInfo();
                    $res['state'] = 'SUCCESS';
                    $res['url'] = '/uploads/'.$info->getSaveName();
                    $result = json_encode($res);
                }
                break;
            case 'uploadfile':
                $file = $this->request->file('upfile');
                if($file){
                    $info = $file->move(ROOT_PATH . 'public' . DS . 'uploads' . DS . 'file');
                    $res = $info->getInfo();
                    $res['state'] = 'SUCCESS';
                    $res['url'] = '/uploads/file/'.$info->getSaveName();
                    $result = json_encode($res);
                }
                break;
            default:
                break;
        }
        return $result;
    }

这个时候已经管用了但是上传的图片没有前缀,无法在富文本编辑器内回显,这个时候回到上传接口这一步

在这个地方拼接一下自己的前缀即可回显成功

相关文章
|
20天前
|
开发框架 JavaScript 前端开发
百度富文本编辑器配置(vue3)
百度富文本编辑器配置(vue3)
|
24天前
|
前端开发 小程序 Java
uniapp上传图片 前端以及java后端代码实现
uniapp上传图片 前端以及java后端代码实现
35 0
|
2月前
|
JSON 前端开发 Java
layui上传图片,前端直接拷代码,后端……
layui上传图片,前端直接拷代码,后端……
32 0
|
2月前
|
弹性计算 负载均衡 容灾
slb配置后端服务器组
配置阿里云SLB后端服务器组涉及四个主要步骤:创建服务器组、添加ECS实例、关联监听规则和设定负载均衡策略。这使得流量根据业务需求和服务器特性进行转发,便于应用架构的灵活管理和扩展,支持蓝绿部署、灰度发布,并通过多可用区提升系统可用性和容灾能力。
28 3
|
2月前
|
Java 数据库连接 开发工具
web后端-SpringCloud-Config分布配置
web后端-SpringCloud-Config分布配置
|
3月前
百度搜索:蓝易云【ipmitool配置BMC的ip】
以上操作将配置BMC的IP地址为新的值。请注意,操作BMC需要谨慎,确保你对服务器有足够的权限,并且仔细检查新的IP地址、子网掩码和默认网关,以免导致服务器网络失联。
35 7
|
3月前
|
Ubuntu
百度搜索:蓝易云【Ubuntu开机自启服务systemd.service配置教程】
现在,你的服务将在Ubuntu开机时自动启动,并在之后的启动中持续运行。记得根据你的实际需求修改 `your_service_name.service`文件中的相关信息。
58 2
|
3月前
|
网络安全 数据中心
百度搜索:蓝易云【Proxmox软件防火墙的配置教程】
现在,你已经完成了Proxmox软件防火墙的配置。请确保你的防火墙规则设置正确,以保护你的Proxmox VE环境免受未经授权的访问和网络攻击。
129 5
|
2月前
|
PHP
百度虚拟机 bcloud_nginx_user.conf配置
百度虚拟机 bcloud_nginx_user.conf配置
22 0
|
6天前
|
前端开发 数据可视化 API
前端react 18.2整合ckeditor富文本编辑器——配置插件、自定义toolbar工具栏(二)
前端react 18.2整合ckeditor富文本编辑器——配置插件、自定义toolbar工具栏
15 0
前端react 18.2整合ckeditor富文本编辑器——配置插件、自定义toolbar工具栏(二)

相关实验场景

更多