summernote.js图片上传的使用

这是一个常用的富文本编辑器而已，特别注意（本地图片上传后，图片的宽度会固定，建议编辑一下，否则自适应时手机版会变成）

一、js部分

<script src="{{/Public}}/style/js/plugins/summernote/summernote-bs4.js"></script>
<script src="{{/Public}}/style/js/plugins/summernote/summernote-zh-CN.min.js"></script>

    $(document).ready(function () {
        $('.summernote').summernote({
            height: 300, 
            lang: 'zh-CN', //如果开启中文，要导入中文插件
            focus: true,
            callbacks: {
                //图片上传
                onImageUpload: function (files, editor, $editable) {
                    sendFile(files[0], editor, $editable);
                }
            }
        });
    });

    //上传图片
    function sendFile(file, editor, $editable) {
        var formdata = new FormData();
        formdata.append("file", file);
        $.ajax({
            //图片上传出来的url，返回的是图片上传后的路径，http格式
            url: "url",
            type: "post",
            data: formdata,
            cache: false,
            contentType: false,
            processData: false,
            dataType: "json",
            success: function (result) {
                //url:图片路径 filename：图片名称
                $('.summernote').summernote('insertImage', result.img, 'img');
            },
            error: function () {
                alert("上传失败");
            }
        });
    }

二、php后端部分

    /*发布文章图片上传 这个是上传控制器 因为 我把 上传img方法封装了 upimg*/
    private function upload_img()
    {
        if ($_FILES) {
            $result = $this->upimg($_FILES);
        }
        return json_encode([
            'img' => "/" . $result,
            ***
        ]);
    }


    /*上传图片 这里是 上传到 public/news/img 中*/
    private function upimg($files)
    {
        /*截取后缀*/
        $suffix = substr($files['file']['name'], strrpos($files['file']['name'], '.'));
        $arr = array('.jpg', '.png', '.jpeg', '.gif');
        /*判断是否为图片*/
        if (in_array($suffix, $arr)) {
            //生成随机名
            $str = date('dHis') . mt_rand(0, 9) . $suffix;
            //上传文件到img文件
            $path = date('Ym'); // 接收文件目录
            //判断有没有这个文件
            if (!file_exists('upload/' . $path)) {
                mkdir("upload/$path", 0777, true);
            }
            $filename = 'upload/' . $path . '/' . $str;
            //临时文件移动到文件夹内
            move_uploaded_file($files['file']['tmp_name'], $filename);
            return $filename;
        } else {
            return false;
        }
    }