java开发:分享一下百度ueditor和七牛的图片集成上传

          作网站时,若是上传的图片量很大,如今很多人会选用七牛图片服务器。那么,今天就来讲说如何把网站的图片上传与七牛的sdk集成的问题。html

          jsp页面,实现图片上传的方式也不少,今天就来讲下百度的编辑器:ueditorweb

          首先要到官网去下载它,后面我也会附上源代码,须要的朋友能够下载。服务器

          咱们新建一个项目:qndemo,而后将ueditor放到webroot目录下,截图以下:jsp

         

另外,咱们还要引入jar包:编辑器

 

 前台页面,咱们须要引用相关js,默认配置下,会加载出编辑效果,以下图:网站

       这时候,咱们上传的图片会保存在本地的服务器。下面,咱们开始集成七牛。htm

      要上传到七牛的空间,首先要有开发者帐户和空间,登陆到七牛官网,按提示操做,便可获取帐户,空间,key和密钥信息。token

      集成中会用到的界面,截图以下:图片

     

 

上传到七牛后,能够选择一个空间后,点开内容管理,查看上传结果:开发

项目中,加入七牛的sdk,简化后,以下截图:

须要修改config类的配置:

修改uptoken类配置:

下面,咱们重点说下ueditor的配置:ueditor.config.js

要集成七牛上传,ueditor的jsp文件处理类要作些修改:

另外,image.html要生成token,路径:

接下来,咱们就能够打开页面看看效果了:

确认后,查看html,效果以下:

点击开始上传按钮后确认,查看html,效果以下:

选择一个图片,点击确认后,查看html,效果以下:

选择一张图片后点击确认按钮,查看html,效果以下:

最后,附上一张整图,效果以下:

      源码上传到百度云网盘,感兴趣的朋友能够下载:

  地址:http://pan.baidu.com/s/1qWsfZrQ

     提取密码:9mgr

相关文章
相关标签/搜索