springboot上传图片到阿里云OSS并实现浏览器预览

最新推荐文章于 2024-05-20 16:40:42 发布

吹灭读书灯一身都是月

最新推荐文章于 2024-05-20 16:40:42 发布

阅读量3.5k

点赞数 5

本文链接：https://blog.csdn.net/qq_45737419/article/details/115482762

版权

spring boot 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

首先，要好好地阅读官方文档：

在这里插入图片描述

关于价格：对于我们个人开发者使用的话，基本不要什么钱的很便宜：
比如：标准型单价：数据存储（本地冗余存储） 0.12元/GB/月

一些概念

①：对象（Object）是OSS存储数据的基本单元，也被称为OSS的文件。

Object包含以下信息：

Key：对象的名称，可用于查询对象。
Data：您存储的数据，可由任意长度的字节组成。
Object Meta：对象元信息，是一组键值对，表示了对象的一些属性，例如最后修改时间、大小等信息。您也可以在元信息中存储一些自定义的信息

Object生命周期：

Object分为标准、低频访问、归档和冷归档四种存储类型。

② 自己创建一个bucket：

要注意的是Bucket名称是唯一的；
地域可以选择和自己ECS服务器同一个地域的更好

在控制台找到EndPoint：

③配置的文件元(Object Meta)信息到底是什么意思？【首页 > 对象存储 OSS > SDK 示例 > Java > 管理文件 > 管理文件元信息】

https://help.aliyun.com/document_detail/84840.html?spm=5176.11065259.1996646101.searchclickresult.1b5748d9mz9QDg

使用Java上传本地图片到阿里云OSS

首先，导入jar包：

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

上传和下载的代码阿里云文档在

简单上传-阿里云OSS文档

简单上传是指通过PutObject方法上传单个文件（Object）。简单上传包括流式上传和文件上传，流式上传使用InputStream作为OSS文件的数据源，文件上传使用本地文件作为OSS文件的数据源。

上传本地图片到服务器

import com.aliyun.oss.OSS;
import com.aliyun.oss.OSSClientBuilder;
import com.aliyun.oss.internal.OSSHeaders;
import com.aliyun.oss.model.CannedAccessControlList;
import com.aliyun.oss.model.ObjectMetadata;
import com.aliyun.oss.model.PutObjectRequest;
import com.aliyun.oss.model.StorageClass;

import java.io.File;

/**
 * 自己写一个工具类
 */
public class OSSUtil {

    // Endpoint以杭州为例，其它Region请按实际情况填写。
    private static final String endpoint = "https://oss-cn-hangzhou.aliyuncs.com";
    // 阿里云主账号AccessKey拥有所有API的访问权限，风险很高。强烈建议您创建并使用RAM账号进行API访问或日常运维，请登录RAM控制台创建RAM账号。
    private static final String accessKeyId = "";
    private static final String accessKeySecret = "";
    private static final String bucketName = "自己的Bucket名字";

	/**找到本机桌面的文件名，上传到OSS
	 * @param fileName 本地的文件名
	 */
    public static String addFile(String fileName) {
        OSS ossClient = new OSSClientBuilder().build(endpoint, accessKeyId, accessKeySecret);

        // 创建PutObjectRequest对象。
        // 填写Bucket名称、Object完整路径和本地文件的完整路径。Object完整路径中不能包含Bucket名称。
        // 如果未指定本地路径，则默认从示例程序所属项目对应本地路径中上传文件。
        PutObjectRequest putObjectRequest = new PutObjectRequest(bucketName, fileName,
                new File("C:\\Users\\Lenovo\\Desktop\\" + fileName));

//         如果需要上传时设置存储类型和访问权限，请参考以下示例代码。inline：在浏览器显示打开文件（显示内容）
        //attachment：弹出文件下载保存框（下载文件）
        ObjectMetadata metadata = new ObjectMetadata();
        metadata.setHeader(OSSHeaders.OSS_STORAGE_CLASS, StorageClass.Standard.toString());
        metadata.setObjectAcl(CannedAccessControlList.PublicRead);
        putObjectRequest.setMetadata(metadata);
        try {
            ossClient.putObject(putObjectRequest);
        } catch (Exception e) {
            e.printStackTrace();
            return null;
        } finally {
            ossClient.shutdown();
        }
        //返回的路径就是访问的路径。可以自己配置访问的权限
        return "https://<bucketName>.oss-cn-hangzhou.aliyuncs.com/" + fileName;
    }
}

测试：

	@Test
    public void  oss(){
        String file = OSSUtil.addFile("China_000007.jpg");
        System.out.println(file);
    }

发现问题

这里，我测试后，访问图片的链接，他每次都是弹出一个下载框，那我要是想直接在浏览器里面预览一个怎么配置呢？

设置文件HTTP头-阿里云文档

一定要先了解HTTP头，不然不知道怎么设置的！

可以看到：要想直接预览：

Content-Type：声明Object的文件类型，浏览器根据文件类型决定Object的默认打开方式。
Content-Disposition：指定Object的访问形式。
① inline：直接在浏览器中打开Object。如需确保通过浏览器访问图片或网页文件时是预览行为，除设置Content-Disposition为inline外，您还必须使用Bucket绑定的自定义域名进行访问。有关绑定自定义域名操作，请参见绑定自定义域名。
② attachment：将Object下载到本地。增加filename参数可预设Object保存在本地的文件名。例如attachment; filename=“example.jpg”。
Cache-Control：
① no-cache：Object允许被缓存在客户端或代理服务器的浏览器中，但每次访问时需要向OSS验证缓存是否可用。缓存可用时直接访问缓存，缓存不可用时重新向OSS请求。
②no-store
③public
④private
Expires：指定Object缓存时间，取值为GMT时间

可参考阿里云文档：访问OSS资源后资源被强制下载

然后，还要绑定自定义的域名才可以实现：

关于绑定自定义域名：可以先看一下官网的介绍视频

这里我添加的域名就是我的主域名前面加一段，成为了子域名，这样就可以了

然后在上传了图片上指定这个二级域名，就可以访问了，但是此时还没有配置HTTPS，因此还要配置证书：

如何配置证书呢？
搜索云解析dns----> 找到SSL证书—>自己的一级域名的下载—>选择其他版本的！！！（因为这个下载会有.pem和.key文件）

参考：阿里云-OSS对象储存-证书托管-文档

下载后得到.pem和.key文件。按照官方文档在证书托管页面进行配置：

然后，在首页–CDN-证书格式说明中，可以看到：

如果您得到的是以“-----BEGIN PRIVATE KEY-----”开头，以“-----END PRIVATE KEY-----”结尾的私钥，您需要使用OpenSSL工具执行以下命令进行转换，然后将new_server_key.pem的内容与证书一起上传

踩坑：这里我一开始用的是Nginx版本的，但是后面我发现他始终不成功，然后我又尝试把.key文件转化为.pem：把文件传到了Linux服务器上，然后使用了openssl rsa -in old_server_key.pem -out new_server_key.pem命令，发现还是不成功。后面看别人的操作原来是用的其他版本的证书，然后上传的时候，只上传.pem文件的第一段：然后就成功了。
个人是免费证书下载选项其它: 在本地打开两个文件把内容拷贝,第一个选项框选的是pem文件的第一段内容,不要选第二个.第二个选项框填写key文件内容,打开key文件把所有内容拷贝上去

配置完后发现原来我配置的是主域名的，不是这个子域名。由于使用免费版的SSL证书无法使用通配符的形式一次配置成功，我们就单独来配置这个域名

好吧，再来为这个子域名去申请证书：搜索【SSL证书】

重新下载证书后才可以。
此时在SSL证书页面多了一个我的免费证书：这个对应了这个子域名。

证书绑定成功后就可以啦；

这时我们再看看OSS控制台，在bucket页面找到我们的图片：注意要是公共读这种

同时注意一下自己设置的HTPP头

与之对应就可以了！然后可以复制这个URl，在浏览器打开就可以了；

SpringBoot上传文件流到阿里云OSS

写代码来测试一下：

	/**
     * 通过文件流上传文件
     *
     * @param dir 选择的目录
     * @return
     */
    public static String addFileStream(String dir, String fileName, InputStream inputStream) {
        // 创建OSSClient实例。
        OSS ossClient = new OSSClientBuilder().build(endpoint, accessKeyId, accessKeySecret);
        // 填写本地文件的完整路径。如果未指定本地路径，则默认从示例程序所属项目对应本地路径中上传文件流。
        // 填写Bucket名称和Object完整路径。Object完整路径中不能包含Bucket名称。
        ObjectMetadata metadata = new ObjectMetadata();
        metadata.setHeader(OSSHeaders.OSS_STORAGE_CLASS, StorageClass.Standard.toString());
        //设置为公共读（可以自己设置权限，官方推荐私有，不过我只是个人测试）
        metadata.setObjectAcl(CannedAccessControlList.PublicRead);
        //缓存，可以预览
        metadata.setCacheControl("no-cache");
        metadata.setHeader("Pragma", "no-cache");
        //指定该Object被下载时的名称（指示MINME用户代理如何显示附加的文件，打开或下载，及文件名称）
        metadata.setContentDisposition("inline;filename=" + fileName);
		//文件的MIME，定义文件的类型及网页编码，决定浏览器将以什么形式、什么编码读取文件。如果用户没有指定则根据Key或文件名的扩展名生成，
        metadata.setContentType(getcontentType(fileName.substring(fileName.lastIndexOf("."))));
        try {
            fileName = dir + "/" +fileName;
            ossClient.putObject(bucketName, fileName, inputStream, metadata);
        } catch (Exception e) {
            return null;
        } finally {
            try {
                inputStream.close();
            } catch (IOException e) {
                e.printStackTrace();
            }
        }
        // 关闭OSSClient。
        ossClient.shutdown();
        //使用刚刚自己配置的域名来得到链接！！！
        return "https://chengXXX-oos.XXXXXX.XXX/" + fileName;
    }


    /**
     * 判断OSS服务文件上传时文件的类型contentType
     *
     * @param FilenameExtension 文件后缀
     * @return String
     */
    public static String getcontentType(String FilenameExtension) {
        if (".bmp".equalsIgnoreCase(FilenameExtension)) {
            return "image/bmp";
        }
        if (".gif".equalsIgnoreCase(FilenameExtension)) {
            return "image/gif";
        }
        if (".jpeg".equalsIgnoreCase(FilenameExtension) ||
                ".jpg".equalsIgnoreCase(FilenameExtension)) {
            return "image/jpeg";
        }
        if (".html".equalsIgnoreCase(FilenameExtension)) {
            return "text/html";
        }
        if (".txt".equalsIgnoreCase(FilenameExtension)) {
            return "text/plain";
        }
        if (".vsd".equalsIgnoreCase(FilenameExtension)) {
            return "application/vnd.visio";
        }
        if (".pptx".equalsIgnoreCase(FilenameExtension) ||
                ".ppt".equalsIgnoreCase(FilenameExtension)) {
            return "application/vnd.ms-powerpoint";
        }
        if (".docx".equalsIgnoreCase(FilenameExtension) ||
                ".doc".equalsIgnoreCase(FilenameExtension)) {
            return "application/msword";
        }
        if (".xml".equalsIgnoreCase(FilenameExtension)) {
            return "text/xml";
        }
        if (".png".equalsIgnoreCase(FilenameExtension)) {
            return "image/png";
        }
        return "image/jpg";
    }

写一个测试类吧：【提示：在刚刚这个方法，右键go to–>Test生成Test类】

class OOSUtilTest {
    @Test
    void testOOS() throws FileNotFoundException {
        InputStream inputStream = new FileInputStream("C:\\Users\\Lenovo\\Desktop\\earth.png");
        int userId = 2;
        String url = OOSUtil.addFileStream("carry_head_portrait",  userId + ".png", inputStream);
        System.out.println(url);
    }
}

执行这个方法，图片就存上去了。然后再用打印的这个URL，可以在浏览器直接预览了，开心！

拓展：上传前进行图片的压缩

我们发现，现在手机拍的照片往往都很大，每次上传要耗费时间，更重要的是，每次预览就更加耗费时间和带宽了，因此考虑拓展，上传图片时进行压缩，最后再存到阿里云OSS里面去。

我就写在另一篇文章里面了：springboot上传图片到阿里云OSS同时进行压缩

总结：
其实，用阿里云OOS或者其他阿里云等的工具还是很方便的，不过就是有时候读文档还是挺费时间(毕竟也没有锻炼代码能力嘛)。以前还试过使用nginx实现图片的代理，直接就可以给用户访问，我觉得那也是个挺好的方法。不过，由于我以前没有做笔记，所以以前会了，但是过了一段时间，真的就什么也不记得了！所以大家一定不要学我，偷懒不做笔记，到时候吃亏的还是自己！然后自己写的笔记，毕竟是和别人不一样的（可能比别人差一点，但是自己看别人的，可能有时还是没自己写的好操作）
以前我也试过阿里云视频直播，想和硬件进行交互（进行推流和播流）。当时没有做什么笔记，可是现在，虽然说有官方文档，但是自己要是想快速上手，还是要时间的a。
希望大家踏踏实实学习😉