ローカルファイルがOSSにアップロードされたときにアプリケーションサーバーにアップロードコールバックを提供する方法 - Object Storage Service

アップロードコールバックを設定するには、必要なコールバックパラメーターをObject Storage Service (OSS) に送信されるアップロードリクエストに追加するだけです。

使用状況ノート

WebpackやBrowserifyなどのパッケージングツールを使用する場合は、npm install ali-OSSコマンドを実行して、oss SDK for Browser.jsをインストールします。
ブラウザからOSSバケットにアクセスしたいが、バケットにCORSルールが設定されていない場合、ブラウザはリクエストを拒否します。したがって、ブラウザからバケットにアクセスする場合は、バケットのCORSルールを設定する必要があります。詳細については、「インストール」をご参照ください。
ほとんどの場合、ブラウザではOSS SDK for Browser.jsが使用されます。 AccessKeyペアが公開されないようにするには、Security Token Service (STS) から取得した一時的なアクセス資格情報を使用してOSSにアクセスすることを推奨します。
一時的なアクセス資格情報は、AccessKeyペアとセキュリティトークンで構成されます。 AccessKeyペアは、AccessKey IDとAccessKeyシークレットで構成されます。一時的なアクセス資格情報を取得する方法の詳細については、「一時的なアクセス権限付与にSTSを使用する」をご参照ください。

例

次のサンプルコードは、アップロードコールバックを設定する方法の例を示しています。

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

<ヘッド>
  <meta charset="UTF-8" />
  <title> ドキュメント </title>
</head>

<body>
  <button id='submit'> コールバックのアップロード </button>
    <!-- SDKファイルのインポート->
  <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({
      // バケットが配置されているリージョンを指定します。 たとえば、バケットが中国 (杭州) リージョンにある場合、リージョンをoss-cn-Hangzhouに設定します。 
      リージョン: 'yourRegion' 、
      // Security Token Service (STS) から取得した一時的なAccessKeyペアを指定します。 AccessKeyペアは、AccessKey IDとAccessKeyシークレットで構成されます。 
      accessKeyId: 'yourAccessKeyId' 、
      accessKeySecret: 'yourAccessKeySecret' 、
      // STSから取得したセキュリティトークンを指定します。 
      stsToken: 'yourSecurityToken' 、
      // バケットの名前を指定します。 例: examplebucket. 
      bucket: "examplebucket" 、
    });

    const options = {
      callback: {
        // コールバック要求を受信するサーバーのパブリックエンドポイントを指定します。 
        url: 'http:// examplebucket.aliyuncs.com:23450 '、
        // コールバック要求ヘッダーに含まれるHostフィールドを指定します。 
        // host: 'yourHost' 、
        // コールバック要求に含まれるbodyフィールドを指定します。 
        body: 'bucket =${ bucket}&object =${ object}&etag =${ etag}&size =${ size}&mimeType =${ mimeType}&imageInfo.height =${ imageInfo.height}&imageInfo.width =${ imageInfo.width}&imageInfo.format ={ x: varx}&var2}
        // コールバック要求のContent-Typeフィールドを指定します。 
        // contentType: 'application/x-www-form-urlencodd' 、
        // コールバック要求のカスタムパラメータを設定します。 
        customValue: {
          var1: 'value1' 、
          var2: 'value2'
        }
      }
    }
    // DOMを照会します。 
    const submit = document.getElementById('submit')
    // アップロードコールバックを実装します。 
    submit.addEventListener('click', () => {
      client.put('example.txt ', new Blob(['Hello World']), options).then(r => console.log(r))
    })


  </script>
</body>

</html>

参考資料

アップロードコールバックを設定するために呼び出すことができるAPI操作の詳細については、「コールバック」をご参照ください。