溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

VUE +UEditor如何實現單圖片跨域上傳功能

發布時間:2021-07-09 14:52:09 來源:億速云 閱讀:161 作者:小新 欄目:web開發

這篇文章主要為大家展示了“VUE +UEditor如何實現單圖片跨域上傳功能”,內容簡而易懂,條理清晰,希望能夠幫助大家解決疑惑,下面讓小編帶領大家一起研究并學習一下“VUE +UEditor如何實現單圖片跨域上傳功能”這篇文章吧。

前端:VUE

后端:WAMP + ThinkPHP5.0

前端

http://localhost:8888

1、去官網下載UEditor到vue中,打開ueditor.config.js配置服務器路徑(本地域名可以去hosts文件中添加),下面是我的配置

VUE +UEditor如何實現單圖片跨域上傳功能 

2、打開ueditor.all.js查找<input id= 在后面添加標識以便后端判斷是否是單圖片上傳:

VUE +UEditor如何實現單圖片跨域上傳功能 

3、創建一個頁面展示JSON數據。我直接用路由參數接收返回的結果后再拼接,整個JSON接收不到,所以只好拆開了,沒有顯示所有的JSON,只獲取state和url。暫時不懂不訪問接口用什么方式接收后端數據,如果有好的解決方式歡迎提出。

VUE +UEditor如何實現單圖片跨域上傳功能 

后端

http://localhost.server.com

1、把UEditor的PHP版本下載下來,里面的PHP文件夾下的文件復制到項目中,在Controller中的輸出結果中添加判斷,單圖片不直接返回結果

VUE +UEditor如何實現單圖片跨域上傳功能 

2、Config.json修改訪問路徑和保存路徑

VUE +UEditor如何實現單圖片跨域上傳功能 

這樣就基本完成了,看看效果 單圖

VUE +UEditor如何實現單圖片跨域上傳功能

VUE +UEditor如何實現單圖片跨域上傳功能

以上是“VUE +UEditor如何實現單圖片跨域上傳功能”這篇文章的所有內容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內容對大家有所幫助,如果還想學習更多知識,歡迎關注億速云行業資訊頻道!

向AI問一下細節

免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。

vue
AI

亚洲午夜精品一区二区_中文无码日韩欧免_久久香蕉精品视频_欧美主播一区二区三区美女