OSS
OSS（Object Storage Service）是一種云存儲服務，提供了一種高度可擴展的、安全可靠的對象存儲解決方案
OSS 對象存儲以對象為基本存儲單元，每個對象都有唯一的標識符（稱為對象鍵）和數據。這些對象可以是任意類型的文件，如文檔、圖片、視頻等。OSS 提供了高可用性、高擴展性和高安全性的存儲服務，適用于各種應用場景，包括數據備份與歸檔、靜態網站托管、大規模數據處理、移動應用程序存儲等。
我們電腦平時開發的時候都是按文件和文件夾的方式存儲的
- OSS 是按照
Bucket存儲的
OSS購買（阿里云演示）
https://www.aliyun.com/product/oss
- 買個40G 資源包 $4.98元
- 買完之后創建一個
Bucket
選擇公共讀，如果選擇私有的訪問圖片的時候需要攜帶私鑰
- 測試上傳圖片
直接訪問即可
Nodejs上傳
創建秘鑰 nodejs需要用
OSS官方文檔
npm install ali-oss
import OSS from 'ali-oss';
import path from 'node:path'
const client = new OSS({region: 'oss-cn-beijing', //區域accessKeyId: 'XXXXXXXXXXXXXXXXXXXX上圖的accessKeyId',accessKeySecret: 'XXXXXXXXXXXXXXXXX上圖的accessKeySecret',bucket: 'nodejs-oss', //存儲庫
});
上傳
//第一個參數上傳到OSS文件的名稱
//第二個參數本地圖片的路徑
const result = await client.put('1.jpg', './1.jpg');
console.log(result)
下載
//第一個參數OSS圖片名稱
//第二個參數下載到本地的路徑
await client.get('1.png',path.join(process.cwd(),'./1.png'));
刪除
//第一個參數刪除存儲庫文件的名稱
const result = await client.delete('1.png');
第三方授權
官方文檔 簽名
import OSS from 'ali-oss';
import express from 'express'
import path from 'node:path'
import cors from 'cors'
const app = express()
app.use(cors())
const config = {region: 'oss-cn-beijing',accessKeyId: 'XXXXXXXX',accessKeySecret: 'XXXXXXXX',bucket: 'nodejs-oss',
}
const client = new OSS(config);app.get('/', async (req, res) => {const date = new Date();date.setDate(date.getDate() + 1);const policy = {expiration: date.toISOString(),//設置簽名日期conditions: [['content-length-range', 0, 1048576000], //設置文件大小限制]}const formData = await client.calculatePostSignature(policy);const { location } = await client.getBucketLocation();const host = `http://${config.bucket}.${location}.aliyuncs.com`res.json({host, //返回上傳的urlpolicy: formData.policy, //返回政策OSSAccessKeyId: formData.OSSAccessKeyId, //返回秘鑰signature: formData.Signature //返回簽名})
})app.listen(3000, () => {console.log('server is running on port 3000')
})
前端上傳
調用后端接口拿到需要上傳的參數傳遞給阿里云接口
記得設置跨域
const file = document.getElementById('file')let params = {}fetch('http://localhost:3000/').then(res => res.json()).then(res => {params = res})file.addEventListener('change', (e) => {let file = e.target.files[0]const formData = new FormData()formData.append('key', file.name)formData.append('policy', params.policy)formData.append('OSSAccessKeyId', params.OSSAccessKeyId)formData.append('success_action_status', 200)formData.append('signature', params.signature)formData.append('file', file)fetch(params.host, {method: 'POST',body: formData})
})
