VUE基于ueditor直接上传图片到oss服务器(前后端分离不涉及任何后端代码)

因为公司需要用到百度的富文本编辑器,并且要用到上传图片的功能。但是因为官方的例子是前后端不分离的,上传功图片到oss需要后端配置一堆东西。在网上看到很多demo也是需要配置后端代码了,基本没看到符合自己的需求,我的需求很简单,不碰任何的后端代码,把上传图片的功能独立出来直接上传oss并返回图片的url。经过对源码的一顿骚操作之后终于改好了,咔咔咔。。。。

废话不多说先上效果图


1.jpg

下面说下具体步骤

1.到[email protected]:LiveJie/vue-ueditor.git 下载ueditor

2.在项目中引入下载的ueditor根据项目不同在适当的地方引入vue2的话应该是在static引入 我现在的版本应该是vue3 static在public下面

2.jpg

3.在index.html引入ueditor主要文件(本人试过在组件里面request但是会一直卡死...)

3.jpg

4.配置ueditor.config.js文件 (需要配置一个oss的地址,还有一个是带在header的token名字)因为公司目前只需要上传单张图片的支持 所以只做了上传单张图片的处理

4.jpg

5.现在准备编写组件 新建一个Ueditor.vue文件写入以下内容







6.引用组件



                    
                    

你可能感兴趣的:(VUE基于ueditor直接上传图片到oss服务器(前后端分离不涉及任何后端代码))