Cara mengunduh data dalam rentang tertentu menggunakan Browser.js SDK - Object Storage Service

Jika Anda hanya memerlukan sebagian data file, Anda dapat menggunakan range download untuk mengambil data dalam rentang yang ditentukan.

Catatan penggunaan

Saat menggunakan alat packaging seperti Webpack dan Browserify, instal OSS SDK untuk Browser.js dengan menjalankan perintah npm install ali-oss.
Jika Anda ingin mengakses bucket OSS dari browser tetapi bucket tersebut belum dikonfigurasi dengan aturan CORS, browser akan menolak permintaan tersebut. Oleh karena itu, Anda harus mengonfigurasi aturan CORS pada bucket jika ingin mengaksesnya dari browser. Untuk informasi selengkapnya, lihat Instalasi.
Dalam kebanyakan kasus, OSS SDK untuk Browser.js digunakan di browser. Untuk mencegah pasangan AccessKey Anda terpapar, kami menyarankan agar Anda menggunakan kredensial akses temporary yang diperoleh dari Security Token Service (STS) untuk mengakses OSS.
Kredensial akses temporary terdiri atas pasangan AccessKey dan token keamanan. Pasangan AccessKey terdiri atas ID AccessKey dan Rahasia AccessKey. Untuk informasi selengkapnya tentang cara memperoleh kredensial akses temporary, lihat Gunakan STS untuk otorisasi akses temporary.

Kode contoh

Kode contoh berikut menunjukkan cara melakukan range download:

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <title>Document</title>
</head>

<body>
  <button id='download'>Download</button>
  <!--Impor file SDK.-->
  <script type="text/javascript" src="https://gosspublic.alicdn.com/aliyun-oss-sdk-6.18.0.min.js"></script>
  <script type="text/javascript">    
    const client = new OSS({
      // Setel region ke wilayah tempat bucket Anda berada. Misalnya, jika bucket Anda berada di wilayah China (Hangzhou), setel region ke oss-cn-hangzhou.
      region: 'yourRegion',
      authorizationV4: true,
      // ID AccessKey dan Rahasia AccessKey temporary yang diperoleh dari Security Token Service (STS).
      accessKeyId: 'yourAccessKeyId',
      accessKeySecret: 'yourAccessKeySecret',
      // Token keamanan (SecurityToken) yang diperoleh dari STS.
      stsToken: 'yourSecurityToken',
      // Tentukan nama bucket. Misalnya, examplebucket.
      bucket: "examplebucket",
    });

    // Ambil elemen DOM.
    const download = document.getElementById('download')
    // Untuk file berukuran 1000 byte, rentang byte yang valid adalah 0 hingga 999.
    // Jika rentang yang ditentukan tidak valid, misalnya posisi awal atau akhir bernilai negatif atau melebihi ukuran file, seluruh file akan diunduh.
    const start = 0, end = 999
    // Tambahkan pendengar ke tombol.
    download.addEventListener('click', () => {
      client.get('example.txt',{
        headers: {          
          Range: `bytes=${start}-${end}`,
        },
      }).then(r => {
        // Konversi data yang dikembalikan menjadi objek yang dapat diunduh dalam format BLOB.
        const newBlob = new Blob([r.content], { type: r.res.headers['content-type'] });
        // Buat elemen anchor.
        const link = document.createElement('a')
        // Sambungkan properti href ke elemen tersebut.
        link.href = window.URL.createObjectURL(newBlob)
        // Tentukan nama file lokal.
        link.download = 'example.txt'
        // Unduh objek.
        link.click()
        // Hapus URL yang telah disambungkan.
        window.URL.revokeObjectURL(link.href)
      })
    })

  </script>
</body>

</html>

Referensi

Untuk kode contoh lengkap mengenai range download, lihat contoh di GitHub.
Untuk referensi API mengenai range download, lihat GetObject.