Konfigurasi upload callback menggunakan Browser.js SDK - Object Storage Service

Untuk mengonfigurasi OSS agar mengirimkan callback ke server aplikasi Anda setelah file (Object) diunggah, cukup sertakan parameter callback dalam permintaan unggahan Anda.

Catatan

Anda dapat mengonfigurasi pengaturan seperti callbackSNI untuk callback. Untuk informasi selengkapnya, lihat Callback.

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 terekspos, kami menyarankan penggunaan 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 mencakup ID AccessKey dan Rahasia AccessKey. Untuk informasi selengkapnya tentang cara memperoleh kredensial akses temporary, lihat Gunakan STS untuk otorisasi akses temporary.

Contoh Kode

Kode berikut memberikan contoh upload callback:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Document</title>
  </head>

  <body>
    <button id="submit">Upload Callback</button>
    <!--Import the SDK file-->
    <script
      type="text/javascript"
      src="https://gosspublic.alicdn.com/aliyun-oss-sdk-6.16.0.min.js"
    ></script>
    <script type="text/javascript">
      const client = new OSS({
        // Set yourRegion to the region where the bucket is located. For example, if the bucket is in the China (Hangzhou) region, set yourRegion to oss-cn-hangzhou.
        region: "yourRegion",
        authorizationV4: true,
        // The temporary AccessKey pair (AccessKey ID and AccessKey secret) obtained from the Security Token Service (STS).
        accessKeyId: "yourAccessKeyId",
        accessKeySecret: "yourAccessKeySecret",
        // The security token (SecurityToken) obtained from the STS service.
        stsToken: "yourSecurityToken",
        // Specify the bucket name. For example, examplebucket.
        bucket: "examplebucket",
      });

      const options = {
        callback: {
          // The server address for the callback request. The address must be an Internet URL.
          url: "http://examplebucket.aliyuncs.com:23450",
          // The value of Host in the callback request header. This is the Host value configured on your server.
          // host: 'yourHost',
          // The value of the request body for the callback.
          body: "bucket=${bucket}&object=${object}&etag=${etag}&size=${size}&mimeType=${mimeType}&imageInfo.height=${imageInfo.height}&imageInfo.width=${imageInfo.width}&imageInfo.format=${imageInfo.format}&var1=${x:var1}&var2=${x:var2}",
          // The Content-Type of the callback request.
          // contentType: 'application/x-www-form-urlencoded',
          // Specifies whether OSS sends a Server Name Indication (SNI) to the origin URL specified by callbackUrl when the client initiates a callback request.
          callbackSNI: true,
          // The custom parameters for the callback request.
          customValue: {
            var1: "value1",
            var2: "value2",
          },
        },
      };
      // Get the DOM.
      const submit = document.getElementById("submit");
      // Upload callback.
      submit.addEventListener("click", () => {
        client
          .put("example.txt", new Blob(["Hello World"]), options)
          .then((r) => console.log(r));
      });
    </script>
  </body>
</html>

Referensi

Untuk informasi selengkapnya tentang operasi API untuk upload callback, lihat Callback.