wangeditor在移動端的web應用

廢話不多說，直接上代碼

前端（前端多說一句，在初始使用階段，不知道是怎么回事，復制在看雲上的文檔的配置參數時，一直有錯誤，后台獲取不到$_file,整整一上午，下午上網搜了一下別人的上傳圖片代碼才好用，不知道是不是官方弄錯了，咱也不敢說，咱也不敢問的）

<div id="editor"></div>
<script>
        var E = window.wangEditor
        var editor = new E('#editor')
        editor.customConfig.menus = [
            'head',  // 標題
            'bold',  // 粗體
            // 'foreColor',  // 文字顏色
            // 'fontSize',  // 字號
            // 'fontName',  // 字體
            // 'italic',  // 斜體
            // 'underline',  // 下划線
            // 'strikeThrough',  // 刪除線

            // 'backColor',  // 背景顏色
            'link',  // 插入鏈接
            'list',  // 列表
            'justify',  // 對齊方式
            'quote',  // 引用
            'emoticon',  // 表情
            'image',  // 插入圖片
            'table',  // 表格
            'video',  // 插入視頻
            // 'code',  // 插入代碼
            'undo',  // 撤銷
            'redo'  // 重復
        ]
        //過濾粘貼過來的文本樣式
        editor.customConfig.pasteFilterStyle = true
        //忽略粘貼內容中的圖片
        editor.customConfig.pasteIgnoreImg = false
        //上傳圖片的配置
        editor.customConfig.uploadFileName = 'myFile'; //設置文件上傳的參數名稱
        editor.customConfig.uploadImgServer = '設置上傳路徑'; //設置上傳文件的服務器路徑
        editor.customConfig.uploadImgMaxSize = 3 * 1024 * 1024; // 將圖片大小限制為 3M
        //自定義上傳圖片事件
        editor.customConfig.uploadImgHooks = {
            before : function(xhr, editor, files) {

            },
            success : function(xhr, editor, result) {
                console.log("上傳成功");
            },
            fail : function(xhr, editor, result) {
                layer.msg("上傳失敗");
            },
            error : function(xhr, editor) {
                console.log("上傳出錯");
            },
            timeout : function(xhr, editor) {
                console.log("上傳超時");
            }
        }
        editor.create()
        E.fullscreen.init('#editor');
    </script>

　　后端代碼，后端是自己寫的，之前一直從網上扒人家的代碼，昨天自己匆匆學習了一下，自己寫了個簡單的代碼去實現，實現邏輯無非創建到指定目錄下（file_exists函數），如果該路徑下沒有該文件夾，就新建一個文件夾，創建文件夾用mkdir，就是linux的創建文件夾命令，move_uploaded_file($tmp,$dest),$tmp是文件上傳的過來的臨時路徑，$dest是設置的保存路徑，並且是系統的絕對路徑，帶文件名。我使用的框架是tp5.1，它是不支持常量的，所以要使用系統常量必須引入think\facade\Env，后期會用到圖片壓縮的功能，所以后期還會學習記錄一下前端和后端的圖片壓縮。

public function up()
    {
        $file = $_FILES;
        if(empty($file)){
            $result["error"] = "1";
            $result['data'] = '';
        }else{
            $tmp = $file['myFile']['tmp_name'];
            $houzhui = substr($file['myFile']['type'],6);
            $foder = date('Ymd',time());
            $fileName = 'XX'.time().'.'.$houzhui;
            $root_path = Env::get('root_path');
            $dest = $root_path.'/public/upload/image/'.$foder.'/'.$fileName;
            if(!file_exists($root_path.'/public/upload/image/'.$foder)){
                mkdir($root_path.'/public/upload/image/'.$foder);
            }
            $result = move_uploaded_file($tmp,$dest);

            if($result){
                return json(['errno'=>0,'data'=>['/ueditor/php/upload/image/'.$foder.'/'.$fileName]]);
            }else{
                return json(['errno'=>2,'data'=>['上傳圖片失敗']]);
            }

        }
    }

　　寫的不好，僅供自己參考使用