1.七牛云注册登录

https://portal.qiniu.com/signup/choice

完成实名认证,传身份证正反面之等,大概一个小时左右就认证成功了

2.新建存储空间



地区可以自己选择

3.代码

在pom.xml添加七牛云依赖

<dependency><groupId>com.qiniu</groupId><artifactId>qiniu-java-sdk</artifactId><version>7.1.1</version>
</dependency>

七牛云图片操作工具类

import cn.hutool.core.util.StrUtil;
import com.qiniu.common.QiniuException;
import com.qiniu.http.Response;
import com.qiniu.storage.BucketManager;
import com.qiniu.storage.UploadManager;
import com.qiniu.util.Auth;
import com.qiniu.util.Base64;
import com.qiniu.util.StringMap;
import com.qiniu.util.UrlSafeBase64;
import okhttp3.OkHttpClient;
import okhttp3.Request;
import okhttp3.RequestBody;import java.io.IOException;public class QiniuCloudUtil {// 设置需要操作的账号的AK和SKprivate static final String ACCESS_KEY = "你的AK";private static final String SECRET_KEY = "你的sk";// 要上传的空间private static final String bucketname = "你的空间名称";// 密钥private static final Auth auth = Auth.create(ACCESS_KEY, SECRET_KEY);private static final String DOMAIN = "你的图片上传路径";private static final String style = "自定义的图片样式";public String getUpToken() {return auth.uploadToken(bucketname, null, 3600, new StringMap().put("insertOnly", 1));}// 普通上传public String upload(String filePath, String fileName) throws IOException {// 创建上传对象UploadManager uploadManager = new UploadManager();try {// 调用put方法上传String token = auth.uploadToken(bucketname);//判断字符串为空的工具类,可用自己的if (StrUtil.isEmpty(token)) {System.out.println("未获取到token,请重试!");return null;}Response res = uploadManager.put(filePath, fileName, token);// 打印返回的信息System.out.println(res.bodyString());if (res.isOK()) {Ret ret = res.jsonToObject(Ret.class);//如果不需要对图片进行样式处理,则使用以下方式即可//return DOMAIN + ret.key;return DOMAIN + ret.key + "?" + style;}} catch (QiniuException e) {Response r = e.response;// 请求失败时打印的异常的信息System.out.println(r.toString());try {// 响应的文本信息System.out.println(r.bodyString());} catch (QiniuException e1) {// ignore}}return null;}//base64方式上传public String put64image(byte[] base64, String key) throws Exception {String file64 = Base64.encodeToString(base64, 0);Integer l = base64.length;String url = "http://upload.qiniu.com/putb64/" + l + "/key/" + UrlSafeBase64.encodeToString(key);//非华东空间需要根据注意事项 1 修改上传域名RequestBody rb = RequestBody.create(null, file64);Request request = new Request.Builder().url(url).addHeader("Content-Type", "application/octet-stream").addHeader("Authorization", "UpToken " + getUpToken()).post(rb).build();//System.out.println(request.headers());OkHttpClient client = new OkHttpClient();okhttp3.Response response = client.newCall(request).execute();System.out.println(response);//如果不需要添加图片样式,使用以下方式//return DOMAIN + key;return DOMAIN + key + "?" + style;}// 普通删除(暂未使用以下方法,未测试)public void delete(String key) throws IOException {// 实例化一个BucketManager对象BucketManager bucketManager = new BucketManager(auth);// 此处的6666是去掉:http://你的图片上传路径/,剩下的key就是图片在七牛云的名称key = key.substring(6666);try {// 调用delete方法移动文件bucketManager.delete(bucketname, key);} catch (QiniuException e) {// 捕获异常信息Response r = e.response;System.out.println(r.toString());}}class Ret {public long fsize;public String key;public String hash;public int width;public int height;}
}

4.获取需要操作的账号的AK和SK

进入个人中心-密钥管理

5.获取要上传的空间

自己设置的空间名

6.获取图片上传URL路径


获取自定义的图片样式
private static final String style = “自定义的图片样式”;
我这里是需要给图片添加水印,所以自定义了图片样式,如果对于上传图片没有格式要求,则可以跳过此步骤。

7.后端代码调用

@ResponseBody@RequestMapping(value="/uploadImg", method=RequestMethod.POST)public ResultInfo uploadImg(@RequestParam MultipartFile image, HttpServletRequest request) {ResultInfo result = new ResultInfo();if (image.isEmpty()) {result.setCode(400);result.setMsg("文件为空,请重新上传");return result;}try {byte[] bytes = image.getBytes();String imageName = UUID.randomUUID().toString();QiniuCloudUtil qiniuUtil = new QiniuCloudUtil();try {//使用base64方式上传到七牛云String url = qiniuUtil.put64image(bytes, imageName);result.setCode(200);result.setMsg("文件上传成功");result.setInfo(url);} catch (Exception e) {e.printStackTrace();}return result;} catch (IOException e) {result.setCode(500);result.setMsg("文件上传发生异常!");return result;}}

8.前端代码调用

VUE代码

uploadImg: async function(id) {  var vm = this;var fileInput = document.getElementById("uniqueId");  var formData = new FormData();formData.append("image", fileInput.files[0]);this.$axios({method: "post",url: '/api/article/uploadImg',data: formData}).then((response) = >{if (response.data.code == 200) {//后端返回的url地址var url = response.data.info;if (url != null && url.length > 0) {   vm.addImgRange = vm.$refs.myQuillEditor.quill.getSelection();var index = vm.addImgRange != null ? vm.addImgRange.index: 0;   vm.$refs.myQuillEditor.quill.insertEmbed(index, 'image', url);  } else {this.$Message.error("图片添加失败!");  }} else {this.$Message.error(response.data.msg);}});
}

七牛云上传图片并返回图片URL相关推荐

  1. Java实现七牛云上传图片、读取图片链接

    Java后端实现七牛云上传图片.读取图片链接 添加依赖 <!--七牛云sdk--><dependency><groupId>com.qiniu</groupI ...

  2. 七牛云 上传图片到七牛云并返回图片URL

    七牛云 上传图片到七牛云并返回图片URL 鸣谢'追逐盛夏流年':https://blog.csdn.net/j1231230/article/details/80061834 在开发项目的时候,经常会 ...

  3. springboot+vue实现七牛云上传图片功能

    1.需求描述 用户发布帖子,需要用到上传图片功能,并进行图片回显. 2.环境 前端:uniapp + uview1.8 后端:springboot 2.5.13 3.具体流程 用户在前端上传图片后,交 ...

  4. 七牛云上传图片和视频

    先说本文主要的重点: 七牛云上传图片(包括从相机获取的和从相册获取的)    七牛云上传视频       8.0手机调起相机        都会进行描述    多图片和多视频上传    获取图片后缀 ...

  5. python对接七牛云上传图片代码,可运行

    python对接七牛云上传图片,可运行 一.准备工作 注册七牛云获取: 1.Access Key(注册认证后自动生成) 2.Secret Key(注册认证后自动生成) 3.空间名称:ihome(创建空 ...

  6. 使用七牛云上传图片时出现Network error during preQuery和运行时出现okhttp的问题

    问题描述 1.使用七牛云上传图片时出现Network error during preQuery,但网络正常 原因分析:排除网络原因,尝试网络配置方向调整 Configuration configur ...

  7. 七牛云上传图片报错处理

    {ResponseInfo:com.qiniu.http.Response@62bd765,status:400, reqId:d4kAAACMt2hWMSEW, xlog:X-Log, xvia:, ...

  8. 上传图片到七牛云并返回图片URL

    在开发项目的时候,经常会用到上传图片的功能,如果把图片全都存放在项目路径下,会导致项目越来越臃肿,因此可以考虑把图片上传交给第三方处理,此处我们采用七牛云进行图片存储. 一.七牛云准备工作 1.七牛云 ...

  9. 二维码生成并上传至七牛云 返回图片URL

    背景:最近一个项目的优惠券模块,需要将优惠券的券号转换成二维码展示出来,并保证能够被扫码枪识别. 接着,简要说明下编码思路,或者说步骤: 引入 qrcode 的Jar依赖 调用API,合理配置相关属性 ...

最新文章

  1. 机器学习特征工程之连续变量离散化:连续变量二值化(Binarizer)
  2. 数据蒋堂 | BI系统的前置计算
  3. iOS上相见恨晚的6个APP
  4. CSS权威指南(第三版)
  5. JVM调优:jdk1.8新生代和老年代的比值是1:2
  6. 设计模式笔记之七 (桥接模式)
  7. 论文浅尝 | 基于神经网络的实体识别和关系抽取联合学习
  8. axios 获取上传进度_PHP获取HTTP body内容的方法总结
  9. 以太坊 智能合约IDE 在线 Solidity IDE
  10. 2345等浏览器主页劫持的解决办法
  11. html协议是一种用于什么的协议,FTP协议是一种用于( )的协议。
  12. 代码写得很牛逼但UI界面却搞得很丑?来,杨工带你!
  13. 动物识别 羊群识别 牛识别 马识别 yolo动物识别 鸟类识别 狗识别 猫狗分类
  14. fr4速度 微带线_微带线和带状线(microstrip and stripline)
  15. HBase的数据模型和存储原理
  16. 糖尿病合并高血压高龄奥密克戎感染重症、危重症患者诊疗建议 v0(手稿)
  17. Gym - 101291I Mismatched Socks(贪心)
  18. 883. 三维形体投影面积
  19. angular中组件changeDetection为ChangeDetectionStrategy.OnPush时的学习
  20. c语言用什么表示逻辑真,c语言中用什么表示逻辑量为真

热门文章

  1. 互联网协议 — TCP — 报文格式
  2. 【计算机与UNIX汇编原理⑫】——汇编考前复习【重要知识点 + 基础题 + 易错题 + 难题解析】
  3. 不可重复读和幻读的区别_论文重复率要多少算是合格的?
  4. 【银河麒麟V10U盘只读解决方案】
  5. 玉柴spn码故障对照表_玉柴电控柴油机故障代码及读码方法2
  6. matlab 运算符
  7. 如何用快慢指针在链表找到中间点
  8. CSS预处理器——Sass、LESS和Stylus区别及联系
  9. X书Scheme跳转到指定页面
  10. 冈萨雷斯《数字图像处理》学习笔记(七)小波变换和多分辨率处理