ue 富文本框WangEditor上传图片到七牛云,富文本框存储图片地址

思路 可以直接通过前端上传到七牛云,网络上的方法没有调试成功.所以我采用的思路是

前端上传图片到=>后端服务器=>七牛云=>返回前端图片地址

1.前端WangEditor控件的配置如下

this.editor.customConfig.uploadImgShowBase64 = false // base 64 存储图片
      this.editor.customConfig.uploadImgServer = this.$http.BASE_URL + '/api/file/webupload/upload?uploadPath=/wangeditor/img' // 配置服务器端地址
      this.editor.customConfig.uploadImgHeaders = {} // 自定义 header
      this.editor.customConfig.uploadFileName = 'file' // 后端接受上传文件的参数名


 customInsert: (insertImg, result, editor) => {
          // 图片上传成功，插入图片的回调  具体根据你返回的数据存储地址作为insertImg的入参
          insertImg(result.url)
        }

2.后端接收到服务器,服务器上传到七牛云,然后删除服务器的图片

/**
	 * 上传文件
	 * @return
	 * @throws IOException
	 * @throws IllegalStateException
	 */
	@RequestMapping("qiNiuYun/upload")
	public AjaxJson qiNiuYun( HttpServletRequest request, HttpServletResponse response,MultipartFile file) throws IllegalStateException, IOException {
		AjaxJson j = new AjaxJson();

		String uploadPath = request.getParameter("uploadPath");
		Calendar cal = Calendar.getInstance();
		int year = cal.get(Calendar.YEAR);
		int month = cal.get(Calendar.MONTH )+1;

		String fileDir = FileKit.getAttachmentDir()+uploadPath+"/"+year+"/"+month+"/";
		// 判断文件是否为空
		if (!file.isEmpty()) {
			String name = file.getOriginalFilename ();
			if(fileProperties.isAvailable (name)) {
				// 文件保存路径
				// 转存文件
				FileUtils.createDirectory (fileDir);
				String filePath = fileDir + name;
				File newFile = FileUtils.getAvailableFile (filePath, 0);
				file.transferTo (newFile);
				String url=QiNiuYunUploadUtil.fileUpload(newFile.getAbsolutePath (), System.currentTimeMillis()+name);
				j.put ("url", url);

				//把服务器上的文件删除
				//new File(filePath).delete();
				newFile.delete();
				return j;
			}else{
				return AjaxJson.error ("请勿上传非法文件!");
			}
		}else {
			return AjaxJson.error ("文件不存在!");
		}
	}

3.以上代码用到的七牛云的工具类1

　　

package com.jeeplus.modules.utils;
 
/**
 * 官方说:有些情况下，七牛返回给上传端的内容不是默认的hash和key形式，
 * 这种情况下，可能出现在自定义returnBody或者自定义了callbackBody的情况下，
 * 前者一般是服务端直传的场景，而后者则是接受上传回调的场景，这两种场景之下，
 * 都涉及到需要将自定义的回复内容解析为Java的类对象，一般建议在交互过程中，
 * 都采用JSON的方式，这样处理起来方法比较一致，而且JSON的方法最通用。
 * 详情:https://developer.qiniu.com/kodo/sdk/1239/java#server-upload
 * ctrl+f 输入关键字搜索:解析自定义回复内容
 */
public class MyPutRet {
 
  public String key;
 
  public String hash;
 
  public String bucket;
 
  public long fsize;
 
  public String getKey() {
    return key;
  }
 
  public void setKey(String key) {
    this.key = key;
  }
 
  public String getHash() {
    return hash;
  }
 
  public void setHash(String hash) {
    this.hash = hash;
  }
 
  public String getBucket() {
    return bucket;
  }
 
  public void setBucket(String bucket) {
    this.bucket = bucket;
  }
 
  public long getFsize() {
    return fsize;
  }
 
  public void setFsize(long fsize) {
    this.fsize = fsize;
  }
}

4.以上代码用到的七牛云的工具类2  换上你的七牛云配置可以直接运行main方法测试

package com.jeeplus.modules.utils;

import cn.hutool.core.lang.UUID;
import com.jeeplus.common.json.AjaxJson;
import com.qiniu.cdn.CdnManager;
import com.qiniu.common.QiniuException;
import com.qiniu.common.Zone;
import com.qiniu.http.Response;
import com.qiniu.storage.BucketManager;
import com.qiniu.storage.Configuration;
import com.qiniu.storage.UploadManager;
import com.qiniu.storage.model.DefaultPutRet;
import com.qiniu.storage.persistent.FileRecorder;
import com.qiniu.util.Auth;
import com.qiniu.util.StringMap;

import java.io.UnsupportedEncodingException;
import java.net.URLEncoder;
import java.nio.file.Paths;

public class QiNiuYunUploadUtil {

  // 设置需要操作的账号的AK,https://developer.qiniu.com/kodo/sdk/1239/java#upload-token
  private static final String ACCESS_KEY = "111111111c87dH";

  // 设置需要操作的账号的SK,https://developer.qiniu.com/kodo/sdk/1239/java#upload-token
  private static final String SECRET_KEY = "45458nbnGQ4645ifEWD6545";

  // 要上传的空间,https://developer.qiniu.com/kodo/sdk/1239/java#upload-token
  private static final String BUCKET = "545gfgdf";

  // 域名domainOfBucket
  private static final String DOMAIN_OF_BUCKET = "http://www.zyjs9.com";

  // 华东是Zone.zone0(),华北是Zone.zone1(),华南是Zone.zone2(),北美是Zone.zoneNa0(), https://developer.qiniu.com/kodo/manual/1671/region-endpoint
  private static final Zone ZONE = Zone.zone1();   // todo


  public static Auth getAuth() {
    return Auth.create(ACCESS_KEY, SECRET_KEY);
  }

  /**
   * 获取上传凭证,https://developer.qiniu.com/kodo/sdk/1239/java#upload-flow
   */

  public static String getUploadCredential() {
    return getAuth().uploadToken(BUCKET);
  }
  public static String getUpToken(String bucketName, String key) {
            //insertOnly 如果希望只能上传指定key的文件，并且不允许修改，那么可以将下面的 insertOnly 属性值设为 1
             return Auth.create(ACCESS_KEY, SECRET_KEY).uploadToken(bucketName, key, 3600, new StringMap().put("insertOnly", 0));
       }

  /**
   * 构造一个带指定 Region 对象的配置类
   */
  public static UploadManager buildUploadManager() {
    return new UploadManager(new Configuration(ZONE));
  }


  /**
   * 文件上传
   *
   * @param filePath 需要上传的文件本地路径
   * @param fileNameKey   需要自定义保存在七牛云的文件名字,即上传文件后保存在七牛云服务器中的文件名(默认不指定的情况下，以文件内容的hash值作为文件名)
   */
  public static String fileUpload(String filePath, String fileNameKey) {

    try {
      String upToken = getUpToken(BUCKET, fileNameKey);
      Response response = buildUploadManager().put(filePath, fileNameKey, upToken);

      MyPutRet myPutRet = response.jsonToObject(MyPutRet.class);
//      DefaultPutRet putRet = new Gson().fromJson(response.bodyString(), DefaultPutRet.class);  // 解析上传成功的结果
      return buildPublicFileUrl(myPutRet.getKey());  // 返回的图片url
    } catch (Exception ex) {
      ex.printStackTrace();
    }
    return null;
  }

  /**
   * 根据文件名和域名返回图片的url,然后访问url直接就可以看到图片了
   *
   * @param fileNameKey 需要自定义保存在七牛云的文件名字,即上传文件后保存在七牛云服务器中的文件名(默认不指定的情况下，以文件内容的hash值作为文件名)
   */
  public static String buildPublicFileUrl(String fileNameKey) {

    try {

      String encodedFileName = URLEncoder.encode(fileNameKey, "utf-8");
      return String.format("%s/%s", DOMAIN_OF_BUCKET, encodedFileName);

    } catch (UnsupportedEncodingException e) {
      e.printStackTrace();
    }
    return null;
  }


  /**
   * 私有空间返回文件URL
   *
   * @param fileNameKey     需要自定义保存在七牛云的文件名字,即上传文件后保存在七牛云服务器中的文件名(默认不指定的情况下，以文件内容的hash值作为文件名)
   * @param expireInSeconds 过期时间,私有空间文件的访问链接超时时间，单位（秒）
   */
  public static String buildPrivateFileUrl(String fileNameKey, long expireInSeconds) {

    try {

      return getAuth().privateDownloadUrl(buildPublicFileUrl(fileNameKey), expireInSeconds);

    } catch (Exception e) {
      e.printStackTrace();
    }
    return null;
  }


  /**
   * 字节数组上传文件,然后返回文件的url,然后可以直接在公网上访问url看到文件了
   *
   * @param fileNameKey 需要自定义保存在七牛云的文件名字,即上传文件后保存在七牛云服务器中的文件名(默认不指定的情况下，以文件内容的hash值作为文件名)
   */
  public static String charArrayUpload(String fileNameKey, byte[] uploadBytes) {

    try {

      Response response = buildUploadManager().put(uploadBytes, fileNameKey, getUploadCredential());

//      DefaultPutRet putRet = new Gson().fromJson(response.bodyString(), DefaultPutRet.class);  // 解析上传成功的结果

      MyPutRet myPutRet = response.jsonToObject(MyPutRet.class);

      return buildPublicFileUrl(myPutRet.getKey());  // 返回的文件url

    } catch (Exception ex) {
      ex.printStackTrace();
    }
    return null;
  }


  /**
   * 断点续传
   *
   * @param fileNameKey   需要自定义保存在七牛云的文件名字,即上传文件后保存在七牛云服务器中的文件名(默认不指定的情况下，以文件内容的hash值作为文件名)
   * @param localFilePath 文件路径, 如果是Windows情况下，格式是 D:\\qiniu\\test.png
   */
  public static String breakPointUpload(String localFilePath, String fileNameKey) {

    try {

      // 如果是Windows情况下，格式是 D:\\qiniu\\test.png
      String localTempDir = Paths.get(System.getenv("java.io.tmpdir"), BUCKET).toString();

      // 设置断点续传文件进度保存目录
      FileRecorder fileRecorder = new FileRecorder(localTempDir);

      // 构造一个带指定Zone对象的配置类
      Configuration cfg = new Configuration(ZONE);
      UploadManager uploadManager = new UploadManager(cfg, fileRecorder);

      Response response = uploadManager.put(localFilePath, fileNameKey, getUploadCredential());
      // 解析上传成功的结果
//      DefaultPutRet putRet = new Gson().fromJson(response.bodyString(), DefaultPutRet.class);

      MyPutRet myPutRet = response.jsonToObject(MyPutRet.class);

      return buildPublicFileUrl(myPutRet.getKey());  // 返回的文件url

    } catch (Exception ex2) {
      ex2.printStackTrace();
    }
    return null;
  }

  /**
   * 删除文件
   * @param url  文件的名字
   * @return
   * @throws Exception
   */
  public static String delete(String url) throws Exception{
    Configuration cfg = new Configuration(Zone.zone1());
    String key = url;
    Auth auth = Auth.create(ACCESS_KEY, SECRET_KEY);
    BucketManager bucketManager = new BucketManager(auth, cfg);
    try {
      Response delete = bucketManager.delete(BUCKET, key);
      String s = delete.toString();
      return s;

    } catch (QiniuException ex) {
//如果遇到异常，说明删除失败
      System.err.println(ex.code());
      System.err.println(ex.response.toString());
      return null;

    }}
  /**
   * 刷新
   * @param url  文件的全路径
   * @throws QiniuException
   */
  public static void refresh(String url) throws QiniuException{
    String [] urls = {url};
    Auth auth = Auth.create(ACCESS_KEY, SECRET_KEY);
    CdnManager c = new CdnManager(auth);
    c.refreshUrls(urls);
  }


  // 测试
  public static void main(String[] args) {
    // 上传图片
    String defaultPutRet = fileUpload ("D:\\111.jpg","12345656");

    System.out.println("====="+ System.currentTimeMillis());

   /*String fileNameKey = defaultPutRet.key; // key是文件名

    String s = buildPublicFileUrl(fileNameKey);  // 返回的图片网址
    System.out.println("ssss****" + s);*/

    //String url = fileUpload("D:\\1.png", "1");

    //System.out.println(url);

  }
  //删除
  public AjaxJson de(String url){
    String[] split = url.split("/");
    String name =split[1];
    try {
      Object delete = QiNiuYunUploadUtil.delete(url);
      QiNiuYunUploadUtil.refresh(url);
      return AjaxJson.success("成功").put("data",delete);
    } catch (Exception e) {
      e.printStackTrace();
      return AjaxJson.error("失败");
    }
  }
}