【业务功能篇77】微服务-OSS对象存储-上传下载图片

3. 图片管理

文件存储的几种方式

单体架构可以直接把图片存储在服务器中

image.png

但是在分布式环境下面直接存储在WEB服务器中的方式就不可取了，这时我们需要搭建独立的文件存储服务器。

image.png

3.1 开通阿里云服务

针对本系统中的相关的文件，图片，文本等统一的交给云服务器管理。阿里云服务地址：https://www.aliyun.com/activity/daily/award?utm_content=se_1010784590

阿里云OSS简介

阿里云对象存储服务（Object Storage Service，简称OSS），是阿里云对外提供的海量、安全、低成本、高可靠的云存储服务。您可以通过本文档提供的简单的REST接口，在任何时间、任何地点、任何互联网设备上进行上传和下载数据。基于OSS，您可以搭建出各种多媒体分享网站、网盘、个人和企业数据备份等基于大规模数据的服务。

选择对象存储OSS

image.png

第一次打开没有开通，开通即可

image.png

image.png

然后进入了OOS对象存储的主页面

image.png

查看相关的文档：https://help.aliyun.com/document_detail/31947.html

相关术语介绍

image.png

创建Bucket

image.png

创建好的效果

image.png

在阿里云中直接操作文件上传

image.png

image.png

image.png

上传成功，我们拿到地址即可访问：

image.png

image.png

3.2 阿里云API使用

最终我们是需要通过服务代码将图片上传到阿里云OSS服务中，接下来看下代码API如何使用。Java操作的API文档地址：https://help.aliyun.com/document_detail/32008.html?spm=5176.208357.1107607.21.3476390f9Pqw6K

添加相关的依赖

<dependency>
    <groupId>com.aliyun.oss</groupId>
    <artifactId>aliyun-sdk-oss</artifactId>
    <version>3.10.2</version>
</dependency>

image.png

image.png

创建子账户

image.png

设置对应的权限

image.png

通过官方的案例代码测试上传操作

    @Test
    public void testUploadFile() throws FileNotFoundException {
        // yourEndpoint填写Bucket所在地域对应的Endpoint。以华东1（杭州）为例，Endpoint填写为https://oss-cn-hangzhou.aliyuncs.com。
        String endpoint = "oss-cn-guangzhou.aliyuncs.com";
        // 阿里云账号AccessKey拥有所有API的访问权限，风险很高。强烈建议您创建并使用RAM用户进行API访问或日常运维，请登录RAM控制台创建RAM用户。
        String accessKeyId = "LTAI5tBPqoroToQNyrHpYJLR";
        String accessKeySecret = "3GnWaRhcBW3gUDhNSVr23fSrM6A0Q4";

        // 创建OSSClient实例。
        OSS ossClient = new OSSClientBuilder().build(endpoint, accessKeyId, accessKeySecret);

        // 填写本地文件的完整路径。如果未指定本地路径，则默认从示例程序所属项目对应本地路径中上传文件流。
        InputStream inputStream = new FileInputStream("C:\\Users\\dpb\\Downloads\\1111.jpg");
        // 依次填写Bucket名称（例如examplebucket）和Object完整路径（例如exampledir/exampleobject.txt）。Object完整路径中不能包含Bucket名称。
        ossClient.putObject("mashibing-mall", "1111.jpg", inputStream);

        // 关闭OSSClient。
        ossClient.shutdown();
        System.out.println("长传图片成功...");
    }

执行成功

image.png

3.3 AlibabaOSS服务

直接通过阿里云提供的API操作相对的复杂一些，这时我们可以通过SpringCloudAlibaba OSS服务来简化开发，添加对应的依赖

        <dependency>
            <groupId>com.alibaba.cloud</groupId>
            <artifactId>spring-cloud-starter-alicloud-oss</artifactId>
        </dependency>

在属性文件中配置对应的AccessKey,SecurtKey和Endpoint

image.png

然后我们在业务代码中就可以直接从容器中获取OSSClient对象

image.png

image.png

3.4 图片上传的方式

第一种方式：表单提交同步将表单数据和图片都提交到后端服务器中，然后在后端服务器中将图片再上传到阿里云服务中。

image.png

但是这种方式的缺点是要做两次上传操作，还有就是将图片和正常的表单信息一起提交影响正常业务的效率。

第二种方式就是在客户端直接将图片上传到阿里云服务器中，返回访问的url地址，然后将url访问地址传递到后端服务进而保存在数据库中。

image.png

这种方式的缺点是在客户端需要获取AccessKey和SecuretKey，这样将相关的核心数据暴露在前端不安全。

第三种方式就是客户端向服务器获取阿里云的防伪签名，然后直接将图片通过防伪签名上传到阿里云服务器中。这样既提高了效率又保证了安全。

image.png

3.5 第三方公共服务

清楚了文件上传的方式后，客户端需要从服务器中获取服务防伪签名信息，同时我们后面还有很多其他的第三方服务，比如发送短信等，这时我们可以专门创建一个第三方的服务来处理这些请求。

image.png

修改pom文件中的SpringBoot的版本和SpringCloud的版本使其和其他模块的版本保持一致，然后同步注册中心和配置中心的操作。引入阿里云OSS服务的相关API，并测试即可

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>
    <parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>2.4.12</version>
        <relativePath/> <!-- lookup parent from repository -->
    </parent>
    <groupId>com.msb.mall</groupId>
    <artifactId>mall-third-party</artifactId>
    <version>0.0.1-SNAPSHOT</version>
    <name>mall-third-party</name>
    <description>第三方服务</description>
    <properties>
        <java.version>1.8</java.version>
        <spring-cloud.version>2020.0.1</spring-cloud.version>
    </properties>
    <dependencies>
        <dependency>
            <groupId>com.msb.mall</groupId>
            <artifactId>mall-commons</artifactId>
            <version>0.0.1-SNAPSHOT</version>
            <exclusions>
                <exclusion>
                    <groupId>com.baomidou</groupId>
                    <artifactId>mybatis-plus-boot-starter</artifactId>
                </exclusion>
            </exclusions>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.cloud</groupId>
            <artifactId>spring-cloud-starter-openfeign</artifactId>
        </dependency>

        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-test</artifactId>
            <scope>test</scope>
        </dependency>
        <dependency>
            <groupId>com.alibaba.cloud</groupId>
            <artifactId>spring-cloud-starter-alicloud-oss</artifactId>
            <version>2.1.0.RELEASE</version>
        </dependency>
    </dependencies>
    <dependencyManagement>
        <dependencies>
            <dependency>
                <groupId>org.springframework.cloud</groupId>
                <artifactId>spring-cloud-dependencies</artifactId>
                <version>${spring-cloud.version}</version>
                <type>pom</type>
                <scope>import</scope>
            </dependency>
        </dependencies>
    </dependencyManagement>

    <build>
        <plugins>
            <plugin>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-maven-plugin</artifactId>
            </plugin>
        </plugins>
    </build>

</project>

属性文件：application.yml

# 数据库的连接新
spring:
  cloud:
    nacos:
      discovery:
        server-addr: 192.168.56.100:8848
    alicloud:
      access-key: LTAI5tBPqoroToQNyrHpYJLR
      secret-key: 3GnWaRhcBW3gUDhNSVr23fSrM6A0Q4
      oss:
        endpoint: oss-cn-guangzhou.aliyuncs.com
    application:
      name: mall-third
server:
  port: 8090

bootstrap.property

spring.application.name=mall-third
spring.cloud.nacos.config.server-addr=192.168.56.100:8848

注意在启动类中别忘了放开注册中心

image.png

测试图片上传的代码直接拷贝即可

image.png

image.png

3.6 服务端生成签名

生成签名地址：https://help.aliyun.com/document_detail/31926.htm?spm=a2c4g.11186623.0.0.2688566aJheBNk#concept-en4-sjy-5db

image.png

直接通过案例代码改造即可：https://help.aliyun.com/document_detail/91868.htm?spm=a2c4g.11186623.0.0.49c1344eaX3VCA#concept-ahk-rfz-2fb

@RestController
public class OSSController {

    @Autowired
    private OSS ossClient;

    @Value("${spring.cloud.alicloud.oss.endpoint}")
    private String endpoint;
    @Value("${spring.cloud.alicloud.oss.bucket}")
    private String bucket;
    @Value("${spring.cloud.alicloud.access-key}")
    private String accessId;

    @RequestMapping("/oss/policy")
    public Map<String, String> getOssPolicy(){

        String host = "https://" + bucket + "." + endpoint; // host的格式为 bucketname.endpoint
        // callbackUrl为上传回调服务器的URL，请将下面的IP和Port配置为您自己的真实信息。
        String format = new SimpleDateFormat("yyyy-MM-dd").format(new Date());
        String dir = format+"/"; // 用户上传文件时指定的前缀。

        // 创建OSSClient实例。
        //OSS ossClient = new OSSClientBuilder().build(endpoint, accessId, accessKey);
        Map<String, String> respMap = null;
        try {
            long expireTime = 30;
            long expireEndTime = System.currentTimeMillis() + expireTime * 1000;
            Date expiration = new Date(expireEndTime);
            // PostObject请求最大可支持的文件大小为5 GB，即CONTENT_LENGTH_RANGE为5*1024*1024*1024。
            PolicyConditions policyConds = new PolicyConditions();
            policyConds.addConditionItem(PolicyConditions.COND_CONTENT_LENGTH_RANGE, 0, 1048576000);
            policyConds.addConditionItem(MatchMode.StartWith, PolicyConditions.COND_KEY, dir);

            String postPolicy = ossClient.generatePostPolicy(expiration, policyConds);
            byte[] binaryData = postPolicy.getBytes("utf-8");
            String encodedPolicy = BinaryUtil.toBase64String(binaryData);
            String postSignature = ossClient.calculatePostSignature(postPolicy);

            respMap = new LinkedHashMap<String, String>();
            respMap.put("accessid", accessId);
            respMap.put("policy", encodedPolicy);
            respMap.put("signature", postSignature);
            respMap.put("dir", dir);
            respMap.put("host", host);
            respMap.put("expire", String.valueOf(expireEndTime / 1000));
            // respMap.put("expire", formatISO8601Date(expiration));


        } catch (Exception e) {
            // Assert.fail(e.getMessage());
            System.out.println(e.getMessage());
        } finally {
            ossClient.shutdown();
        }
        return respMap;
    }
}

相关的属性配置

# 数据库的连接新
spring:
  cloud:
    nacos:
      discovery:
        server-addr: 192.168.56.100:8848
    alicloud:
      access-key: LTAI5tBPqoroToQNyrHpYJLR
      secret-key: 3GnWaRhcBW3gUDhNSVr23fSrM6A0Q4
      oss:
        endpoint: oss-cn-guangzhou.aliyuncs.com
        bucket: mashibing-mall
    application:
      name: mall-third
server:
  port: 8090

访问即可：

image.png

客户端获取服务签名的时候肯定是走的网关路由，所以我们还需要在网关中添加Third服务的路由：

image.png

然后通过网关调用获取服务签名

image.png

3.7 品牌图片上传

第一个我们需要借助ElementUI中提供的el-upload组件来实现上传操作，我们预先准备了相关的上传代码

image.png

然后将这三个文件拷贝到项目目录中

image.png

然后在添加修改品牌的窗口中添加上传的组件

image.png

image.png

在操作中，我们发下获取的数据是从response.data中获取的，但是我们在服务端返回的是Map数据，没有data封装，这时我们需要调整后端Thrid服务接口的返回信息通过R对象来返回

image.png

最后OSS上传还会出现跨域问题，参考官方文档配置即可

image.png

出现跨域问题的解决方案

image.png

image.png

image.png

然后在OSS服务端也可以看到我们上传成功的文件

image.png

单独的文件上传我们就搞定了！

4. 添加品牌信息

图片上传处理完成后我们就可以实现品牌数据的添加和修改操作

image.png

提交后的数据在table中显示的是logo的图片地址，我们需要将其显示出来

image.png

image.png

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mfbz.cn/a/86715.html

如若内容造成侵权/违法违规/事实不符，请联系我们进行投诉反馈qq邮箱809451989@qq.com，一经查实，立即删除！

相关文章

Linux系统安全：NAT（SNAT、DNAT）

Linux系统安全：NAT（SNAT、DNAT）

目录 一.NAT 二.SNAT 三.DNAT 一.NAT NAT: network address translation&#xff0c;支持PREROUTING&#xff0c;INPUT&#xff0c;OUTPUT&#xff0c;POSTROUTING四个链 请求报文&#xff1a;修改源/目标IP&#xff0c; 响应报文&#xff1a;修改源/目标IP&#xff0c;根据…
阅读更多...
测试框架pytest教程（11）-pytestAPI

测试框架pytest教程（11）-pytestAPI

常量 pytest.__version__ #输出pytest版本 pytest.version_tuple #输出版本的元组形式 功能 pytest.approx pytest.approx 是一个用于进行数值近似比较的 pytest 断言工具。 在测试中&#xff0c;有时候需要对浮点数或其他具有小数部分的数值进行比较。然而&#xff0c;由于…
阅读更多...
Linux面试笔试题（6）

Linux面试笔试题（6）

91、6块300G的硬盘做raid5&#xff0c;新的设备容量是多大&#xff08;C&#xff09; A 900G B 1800G C 1500G D 300G 6300G−300G 1500G 由于一块硬盘用于奇偶校验&#xff0c;所以设备容量将是1500G. Raid 5是一种磁盘阵列&#xff0c;将数据分散到多个硬盘上以提高性能和可…
阅读更多...
【⑬MySQL | 数据类型(一)】简介 | 整数 | 浮点 | 定点类型

【⑬MySQL | 数据类型(一)】简介 | 整数 | 浮点 | 定点类型

前言 ✨欢迎来到小K的MySQL专栏&#xff0c;本节将为大家带来MySQL数据类型简介 | 整数 | 浮点 | 定点类型的分享✨ 目录 前言0.数据类型简介1 整数类型2 浮点类型3 定点类型4 日期/时间类型总结 0.数据类型简介 数据类型&#xff08;data_type&#xff09;是指系统中所允许的…
阅读更多...
【线性代数-3Blue1Brown】- 2 线性组合、张成的空间与基

【线性代数-3Blue1Brown】- 2 线性组合、张成的空间与基

飞书原文链接&#xff1a;Docs
阅读更多...
LeetCode算法递归类—二叉树中的最大路径和

LeetCode算法递归类—二叉树中的最大路径和

目录 124. 二叉树中的最大路径和 - 力扣&#xff08;LeetCode&#xff09; 题解&#xff1a; 代码&#xff1a; 运行结果&#xff1a; 二叉树中的 路径 被定义为一条节点序列&#xff0c;序列中每对相邻节点之间都存在一条边。同一个节点在一条路径序列中 至多出现一次 。该…
阅读更多...
【图论】拓扑排序

【图论】拓扑排序

一.定义 拓扑排序是一种对有向无环图&#xff08;DAG&#xff09;进行排序的算法&#xff0c;使得图中的每个顶点在排序中都位于其依赖的顶点之后。它通常用于表示一些任务之间的依赖关系&#xff0c;例如在一个项目中&#xff0c;某些任务必须在其他任务之前完成。 拓扑排序的…
阅读更多...
SQL注入之延时注入

SQL注入之延时注入

文章目录 延时注入是什么&#xff1f;延时注入获取数据库版本号 延时注入是什么&#xff1f; 延时注入就是利用sleep()函数通过if语句判断所写的语句真假&#xff0c;如果为真返回我们想要的东西&#xff08;例如&#xff1a;数据库的长度&#xff0c;数据库的名字等&#xff0…
阅读更多...
认识负载均衡||WEBSHELL

认识负载均衡||WEBSHELL

目录 一、负载均衡 1.nginx负载均衡算法 2.nginx反向代理-负载均衡 二、webshell 1.构造不含数字和字母的webshell 2.如何绕过 一、负载均衡 1.nginx负载均衡算法 &#xff08;1&#xff09;轮询&#xff08;默认&#xff09;每个请求按时间顺序逐一分配到不同的后端服务&…
阅读更多...
达梦数据库读写分离集群原理

达梦数据库读写分离集群原理

概述 本文就达梦数据库读写分离原理进行介绍。 达梦读写分离集群特点&#xff1a; 可以配置8个即时备库或8个实时备库&#xff1b;读写操作自动分离、负载均衡&#xff1b;提供数据同步&#xff1b;备库故障自动处理&#xff0c;故障恢复自动数据同步等功能&#xff0c;也支持…
阅读更多...
无涯教程-TensorFlow - Keras

无涯教程-TensorFlow - Keras

Keras易于学习的高级Python库&#xff0c;可在TensorFlow框架上运行&#xff0c;它的重点是理解深度学习技术&#xff0c;如为神经网络创建层&#xff0c;以维护形状和数学细节的概念。框架的创建可以分为以下两种类型- 顺序API功能API 无涯教程将使用Jupyter Notebook执行和…
阅读更多...
会计如何使用ChatGPT提高工作效率

会计如何使用ChatGPT提高工作效率

文章目录 ChatGPT改变了会计行业微软重新定义了PC交互应对ChatGPT带来的冲击给财务人员的建议总结 ✍创作者&#xff1a;全栈弄潮儿 &#x1f3e1; 个人主页&#xff1a; 全栈弄潮儿的个人主页 &#x1f3d9;️ 个人社区&#xff0c;欢迎你的加入&#xff1a;全栈弄潮儿的个人社…
阅读更多...
LInux之例行工作

LInux之例行工作

目录 场景 单一执行例行任务 --- at&#xff08;一次性&#xff09; 安装 命令详解 语法格式 参数及作用 时间格式 案例 at命令执行过程分析 循环执行的例行性任务--crontab&#xff08;周期性&#xff09; crontd服务安装 linux 任务调度的工分类 crontab工作过程…
阅读更多...
js案例：小球碰壁反弹

js案例：小球碰壁反弹

目录 一.效果预览图​编辑 解析 二.完整代码 代码讲解 html部分 js部分 一.效果预览图 解析 这个效果是为了以后&#xff08;过段时间会发的一个小游戏&#xff09;做js小游戏做准备的&#xff0c;基本结构是&#xff0c;定义两个div盒子&#xff0c;小盒子设置成圆球形状…
阅读更多...
代码pytorch-adda-master跑通记录

代码pytorch-adda-master跑通记录

前言 最近在学习迁移学习&#xff0c;ADDA算法&#xff0c;由于嫌自己写麻烦&#xff0c;准备先跑通别人的代码。 代码名称&#xff1a;pytorch-adda-master 博客&#xff1a;https://www.cnblogs.com/BlairGrowing/p/17020378.html github地址&#xff1a;https://github.com…
阅读更多...
关于Springboot项目打包的配置问题

关于Springboot项目打包的配置问题

一、打包方式的不同致使jar包运行性能及docker部署的效率问题 1.1方式一 <build><plugins><plugin><groupId>org.apache.maven.plugins</groupId><artifactId>maven-compiler-plugin</artifactId><configuration><source&…
阅读更多...
Flash 空间大小的选择以及8MB和8M bit单位与转换关系

Flash 空间大小的选择以及8MB和8M bit单位与转换关系

他V hezkz17进数字音频系统研究开发交流答疑群(课题组) log打印 [09:54:27.565] FLASH_SIZE0x800000 这个是 8MB 字节 芯片手册Flash是以字节为单位 注意单位与转换关系 ifeq ($(FLASH_SIZE),0x100000) # 8M bits LOG_DUMP_SECTION_SIZE ? 0x10000 endif 0x1000001MB为 …
阅读更多...
C# 观察者模式

C# 观察者模式

一、概述 观察者模式是一种常用的设计模式&#xff0c;它属于行为型模式。在C#中&#xff0c;观察者模式通过定义一种一对多的依赖关系&#xff0c;使得当一个对象的状态发生变化时&#xff0c;所有依赖于它的对象都会得到通知并自动更新。这种模式可以实现松耦合&#xff0c;…
阅读更多...
精密图纸被窃，知名手表品牌Seiko遭BlackCat勒索软件攻击

精密图纸被窃，知名手表品牌Seiko遭BlackCat勒索软件攻击

据BleepingComputer消息&#xff0c;日本著名手表制造商Seiko在7月末遭到了网络攻击&#xff0c;8月21日&#xff0c;BlackCat&#xff08;又名ALPHV&#xff09;勒索软件组织在其网站上宣布对这起攻击事件负责。 8 月 10 日&#xff0c;Seiko发布了一份数据泄露通知&#xff0…
阅读更多...
机器学习---常见的距离公式（欧氏距离、曼哈顿距离、标准化欧式距离、余弦距离、杰卡德距离、马氏距离、切比雪夫距离、闵可夫斯基距离、K-L散度）

机器学习---常见的距离公式（欧氏距离、曼哈顿距离、标准化欧式距离、余弦距离、杰卡德距离、马氏距离、切比雪夫距离、闵可夫斯基距离、K-L散度）

1. 欧氏距离 欧几里得度量&#xff08;euclidean metric&#xff09;&#xff08;也称欧氏距离&#xff09;是一个通常采用的距离定义&#xff0c;指在m维空 间中两个点之间的真实距离&#xff0c;或者向量的自然长度&#xff08;即该点到原点的距离&#xff09;。在二维和三维…
阅读更多...
最新文章

Copyright @ 2022~2023

友情链接： 我的编程经验分享 一条长河网 尧图网站开发 尧图建网站