すべてのプロダクト
Search
ドキュメントセンター

Object Storage Service:フォルダの管理 (Browser.js SDK)

最終更新日:Nov 30, 2025

フラットな構造では整理と管理が困難になる可能性がある大量のオブジェクトを簡素化するため、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 Secret で構成されます。一時的なアクセス認証情報を取得する方法の詳細については、「STS を使用した一時的なアクセス権限付与」をご参照ください。

ディレクトリの作成

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <script src="https://gosspublic.alicdn.com/aliyun-oss-sdk-6.18.0.min.js"></script>
  </head>
  <body>
    <script>
      const client = OSS({
        // yourRegion をバケットが配置されているリージョンに設定します。 たとえば、リージョンが中国 (杭州) の場合、yourRegion を oss-cn-hangzhou に設定します。
        region: 'yourRegion',
        authorizationV4: true,
        // STS サービスから取得した一時的な AccessKey ペア (AccessKey ID と AccessKey Secret)。
        accessKeyId: 'yourAccessKeyId',
        accessKeySecret: 'yourAccessKeySecret',
        // STS サービスから取得したセキュリティトークン (SecurityToken)。
        stsToken: 'yourSecurityToken',
        // バケット名を指定します。
        bucket: 'examplebucket'
      });
      // ディレクトリ名を指定します。 ディレクトリ名はスラッシュ (/) で終わる必要があります。
      client
        .put("log/", new Blob([]))
        .then((r) => {
          console.log(r);
        })
        .catch((e) => {
          console.log(e);
        });
    </script>
  </body>
</html>

ディレクトリの削除

Prefix を指定して、ディレクトリとそのすべてのオブジェクトを削除します。たとえば、examplebucket バケットから log ディレクトリとそのすべてのオブジェクトを削除するには、サンプルコードの Prefix パラメーターを log/ に設定します。

警告

ディレクトリを削除すると、そのすべてのサブディレクトリとオブジェクトも削除されます。操作は慎重に行ってください。

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <script src="https://gosspublic.alicdn.com/aliyun-oss-sdk-6.18.0.min.js"></script>
  </head>
  <body>
    <script>
      const client = new OSS({
        // yourRegion をバケットが配置されているリージョンに設定します。 たとえば、リージョンが中国 (杭州) の場合、yourRegion を oss-cn-hangzhou に設定します。
        region: "yourRegion",
        authorizationV4: true,
        // STS サービスから取得した一時的な AccessKey ID と AccessKey Secret。
        accessKeyId: "yourAccessKeyId",
        accessKeySecret: "yourAccessKeySecret",
        // STS サービスから取得したセキュリティトークン。
        stsToken: 'yourSecurityToken',
        // バケット名を指定します。 たとえば、examplebucket です。
        bucket: "examplebucket",
      });

      // リクエストの失敗を処理します。 これにより、promise.all が中断されるのを防ぎ、失敗の理由と失敗したファイルの名前が返されます。
      async function handleDel(name, options) {
        try {
          await client.delete(name);
        } catch (error) {
          error.failObjectName = name;
          return error;
        }
      }

      // 複数のファイルを削除します。
      async function deletePrefix(prefix) {
        const list = await client.list({
          prefix: prefix,
        });

        list.objects = list.objects || [];
        const result = await Promise.all(
          list.objects.map((v) => handleDel(v.name))
        );
        console.log(result);
      }
      // ディレクトリとディレクトリ内のすべてのファイルを削除します。
      deletePrefix("log/");
    </script>
  </body>
</html>

関連ドキュメント

  • ディレクトリの作成に使用される API 操作の詳細については、「PutObjectおよび「CreateDirectoryをご参照ください。

  • フォルダとそのすべてのファイルを削除するために使用される API 操作の詳細については、「DeleteObject」をご参照ください。