最近寫專案中需要用到LayUI富文字編輯器，其他地方都挺好，唯獨上傳圖片時，要不就是上傳完成後回顯404，要不就是訪問時404（訪問時我是新開啟的一個頁面），返回路徑一直有問題，之後把返回的路徑改成絕對路徑就可以。

效果圖如下：

先新增上傳圖片介面，layui會自動傳遞引數，後臺直接寫對應的上傳方法就行了。

var layedit = layui.layedit;
layedit.set({    //設定圖片介面
      uploadImage: {
        url: 'layUITextarea/upload', //介面url
        type: 'post'
      }
});
 

後臺上傳完成後需要返回四個引數，layui自定義接收顯示（不返回圖片無法顯示）

layui前臺接收返回的資料格式為： （後臺一定要按照格式資料返回，否則會報錯）

{
   "code": 0,   //0表示成功，其他表示失敗
   "msg": "",   //提示資訊，//一般上傳失敗後返回
   "data": {
     "src": "圖片路徑",
     "title": "圖片名稱"  //可選
   }
}

轉載：https://blog.csdn.net/qq_40205116/article/details/89433791

------------------------------------------------------------自己專案----------------------------------------------------------

前臺程式碼：

後臺介面程式碼：

 //富文字圖片
    public function form_img()
    {
       
        $file = request()->file('file');

        //dump($file);die;
        // 移動到框架應用根目錄/public/uploads/ 目錄下
        $info = $file->move('../public/upload/admin/article/fuwenben/');
        if($info){
            // 成功上傳後 獲取上傳資訊
            // 輸出 jpg
            //$path =  $info->getExtension();
            $info_img  = '/upload/admin/article/fuwenben/'.str_replace('\\','/',$info->getSaveName());
            return json(array('code'=>0,'msg'=>'上傳成功','data'=>['src'=>$info_img,'title'=>'富文字圖片']));

        }else{
            // 上傳失敗獲取錯誤資訊
            echo $file->getError();
        }
    }