實現圖片上傳至阿里雲OSS存儲

準備工作

首先去阿里雲購買對象存儲OSS資源包。
在這裏插入圖片描述
供學習使用選擇最低檔的價格很優惠,標準型存儲包5元半年。
上傳不收取網絡流量費用,但是當外網去訪問存儲的資源時,會產生下行的流量費用,因此,還需要購買下行流量包,也是選擇最低檔,半年60元。


控制檯

先新建一個Bucket
在這裏插入圖片描述
在文件管理中,可直接上傳圖片,在瀏覽器訪問到。

在圖片處理中,可添加水印的樣式。
在這裏插入圖片描述
在訪問設置中,選擇自定義分隔符,在圖片路徑後拼接分隔符與水印的規格名稱,就能給圖片添加上水印。
開啓原圖保護功能的話,如果把路徑後的水印規則給去掉,就不能訪問該圖片了。
在這裏插入圖片描述
效果如下
在這裏插入圖片描述
控制檯的其他監控管理等功能就不一一介紹了。


Java實現圖片上傳

更多可閱讀其開發者指南,很豐富,很多花式上傳下載。
https://help.aliyun.com/document_detail/52830.html?spm=5176.8465980.home.d3.4e701450YLCAOg

這裏採用簡單上傳,使用它的SDK與自己的項目整合。

SDK依賴:

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

我們需要一個OSSClient實例去實現上傳等功能,編寫配置類將其裝配到Spring容器中。
在RAM訪問控制中可以獲取到accessKeyId與accessKeySecret。
在這裏插入圖片描述
或者就在OSS控制檯概覽的右側進入,根據其提示獲得。

這裏使用的是SpringBoot,所以相關配置直接在application.yml中編寫。

aliyun:
  accessKeyId: xxxxx
  accessKeySecret: xxxxxx
  oss:
    endpoint: http://oss-cn-shanghai.aliyuncs.com
    bucketName: orcas-rent
    urlPrefix: https://orcas-rent.oss-cn-shanghai.aliyuncs.com/
/**
 * 用於Ali產品的配置 (OSS)
 * @author: Orcas
 * @version:1.0.0
 * @date: 2019/4/28
 */
// @PropertySource("classpath:xxxx.properties") 默認路徑下可不加
@Data
@Configuration
public class AliyunConfig {
    // 地域節點
    @Value("${aliyun.oss.endpoint}")
    private String endpoint;
    @Value("${aliyun.accessKeyId}")
    private String accessKeyId;
    @Value("${aliyun.accessKeySecret}")
    private String accessKeySecret;
    
    @Value("${aliyun.oss.bucketName}")
    private String bucketName;
    @Value("${aliyun.oss.urlPrefix}")
    private String urlPrefix;

    @Bean
    public OSSClient ossClient() {
        return new OSSClient(endpoint, accessKeyId, accessKeySecret);
    }
}

根據前端需要我們響應的數據創建一個上傳圖片返回結果類(略)。
在這裏插入圖片描述
Controller層代碼略。

簡單實現上傳圖片的功能,具體看註釋。

@Service
public class UploadPicService {
    // 允許上傳的格式
    private static final String[] IMAGE_TYPE = new String[]{".bmp", ".jpg", ".jpeg", ".gif", ".png"};

    @Autowired
    private OSSClient ossClient;

    @Autowired
    private AliyunConfig aliyunConfig;

    public PicUploadResult upload(MultipartFile multipartFile) {
        // 1. 對上傳的圖片進行校驗: 這裏簡單校驗後綴名
        // 另外可通過ImageIO讀取圖片的長寬來判斷是否是圖片,校驗圖片的大小等。
        // TODO 圖片校驗
        boolean isLegal = false;
        for (String type : IMAGE_TYPE) {
            if (StringUtils.endsWithIgnoreCase(multipartFile.getOriginalFilename(), type)) {
                isLegal = true;
                break;  // 只要與允許上傳格式其中一個匹配就可以
            }
        }
        PicUploadResult picUploadResult = new PicUploadResult();
        // 格式錯誤, 返回與前端約定的error
        if (!isLegal) {
            picUploadResult.setStatus("error");
            return picUploadResult;
        }

        // 2. 準備上傳API的參數
        String fileName = multipartFile.getOriginalFilename();
        String filePath = this.getFilePath(fileName);

        // 3. 上傳至阿里OSS
        try {
            ossClient.putObject(aliyunConfig.getBucketName(), filePath, new ByteArrayInputStream(multipartFile.getBytes()));
        } catch (IOException e) {
            e.printStackTrace();
            // 上傳失敗
            picUploadResult.setStatus("error");
            return picUploadResult;
        }

        // 上傳成功
        picUploadResult.setStatus("done");
        // 文件名(即直接訪問的完整路徑)
        picUploadResult.setName(aliyunConfig.getUrlPrefix() + filePath);
        // uid
        picUploadResult.setUid(String.valueOf(System.currentTimeMillis()));
        return picUploadResult;
    }

    /**
     * 上傳的目錄
     * 目錄: 根據年月日歸檔
     * 文件名: 時間戳 + 隨機數
     * @param fileName
     * @return
     */
    private String getFilePath(String fileName) {
        DateTime dateTime = new DateTime();
        return "images/" + dateTime.toString("yyyy") + "/" + dateTime.toString("MM") + "/"
                + dateTime.toString("dd") + "/" + System.currentTimeMillis() +
                RandomUtils.nextInt(100, 9999) + "." + StringUtils.substringAfterLast(fileName, ".");
    }

測試

代碼編寫完成後,用Insomnia進行調試。
需要注意兩點,設置Header。Content-Type: multipart/form-data。
還有就是設置與Controller接口中請求約定的@RequestParam("file")中的 file。
在這裏插入圖片描述
成功在瀏覽器中訪問到
在這裏插入圖片描述
這個時候我們去控制檯文件管理中也可看到上傳的文件
在這裏插入圖片描述


期間遇到的錯誤

調試過程中遇到過一個報錯,忘了截圖了,根據我百度的歷史記錄找到了這段關鍵句:
You have no right to access this object because of bucket acl.
這是因爲我在控制檯創建用戶的時候並沒有給他授權,可在RAM訪問控制中進行設置。
在這裏插入圖片描述

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章