> ## Documentation Index
> Fetch the complete documentation index at: https://developer.box.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Postmanコレクション

export const MultiRelatedLinks = ({sections = []}) => {
  if (!sections || sections.length === 0) {
    return null;
  }
  return <div className="space-y-8">
      {sections.map((section, index) => <RelatedLinks key={index} title={section.title} items={section.items} />)}
    </div>;
};

export const RelatedLinks = ({title, items = []}) => {
  const getBadgeClass = badge => {
    if (!badge) return "badge-default";
    const badgeType = badge.toLowerCase().replace(/\s+/g, "-");
    return `badge-${badge === "ガイド" ? "guide" : badgeType}`;
  };
  if (!items || items.length === 0) {
    return null;
  }
  return <div className="my-8">
      {}
      <h3 className="text-sm font-bold uppercase tracking-wider mb-4">{title}</h3>

      {}
      <div className="flex flex-col gap-3">
        {items.map((item, index) => <a key={index} href={item.href} className="py-2 px-3 rounded related_link hover:bg-[#f2f2f2] dark:hover:bg-[#111827] flex items-center gap-3 group no-underline hover:no-underline border-b-0">
            {}
            <span className={`px-2 py-1 rounded-full text-xs font-semibold uppercase tracking-wide flex-shrink-0 ${getBadgeClass(item.badge)}`}>
              {item.badge}
            </span>

            {}
            <span className="text-base">{item.label}</span>
          </a>)}
      </div>
    </div>;
};

export const Link = ({href, children, className, ...props}) => {
  const localizedHref = localizeLink(href);
  return <a href={localizedHref} className={className} {...props}>
      {children}
    </a>;
};

export const Postman = ({env = null, anonymous = false, ...props}) => {
  const [showModal, setShowModal] = useState(false);
  const [showImportingModal, setShowImportingModal] = useState(false);
  const collectionId = "8119550-b5ea2aeb-c82a-425d-baff-ed5dfd1d7659";
  const workspaceId = "1a5945ff-a292-42c7-91c5-2cf3cdc68492";
  const referrer = "https%3A%2F%2Fdeveloper.box.com%2Fguides%2Ftooling%2Fpostman%2F%23latest-collection";
  const forkUrl = `https://elements.getpostman.com/view/fork?collection=${collectionId}&workspaceId=${workspaceId}&referrer=${referrer}`;
  const importUrl = `https://www.postman.com/collections/${collectionId}`;
  const handleForkCollection = () => {
    window.open(forkUrl, "_blank");
    setShowModal(false);
  };
  const handleImportCollection = () => {
    setShowImportingModal(true);
    setShowModal(false);
  };
  return <>
      {}
      <button onClick={() => setShowModal(true)} className="w-full px-8 py-4 my-4 text-lg font-medium text-white bg-orange-600 rounded-lg hover:bg-orange-700 transition-colors flex justify-between items-center" {...props}>
        {translate("Run in Postman")}
        <span className="text-2xl">›</span>
      </button>

      {}
      {showModal && <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50" onClick={() => setShowModal(false)}>
          {}
          <div className="relative w-full max-w-2xl mx-4 p-10 bg-white dark:bg-[#0E0E10] rounded-xl shadow-2xl border border-gray-200 dark:border-slate-800" onClick={e => e.stopPropagation()}>
            {}
            <button onClick={() => setShowModal(false)} className="absolute top-4 right-4 w-8 h-8 flex items-center justify-center text-gray-400 dark:text-gray-500 hover:text-gray-600 dark:hover:text-gray-400 transition-colors" title={translate("Close")}>
              ✕
            </button>

            {}
            <h2 className="mb-6 text-2xl font-semibold text-gray-900 dark:text-gray-100 mt-0">{translate("Fork collection into your workspace")}</h2>

            {}
            <div className="mb-8">
              <ul className="mb-6 space-y-4 list-none">
                <li className="text-sm text-gray-600 dark:text-gray-400 leading-relaxed flex">
                  <span>{translate("Work in your own workspace or with your team")}</span>
                </li>
                <li className="text-sm text-gray-600 dark:text-gray-400 leading-relaxed flex">
                  <span>{translate("Stay up to date with the latest changes to the source collection")}</span>
                </li>
                <li className="text-sm text-gray-600 dark:text-gray-400 leading-relaxed flex">
                  <span>{translate("Contribute to the source collection through pull requests")}</span>
                </li>
              </ul>

              <p className="mb-4 text-sm text-gray-600 dark:text-gray-400">
                <a href={`https://elements.getpostman.com/redirect?entityId=default&entityType=collection&workspaceId=1a5945ff-a292-42c7-91c5-2cf3cdc68492`} target="_blank" rel="noopener noreferrer">
                  {translate("View collection")}
                </a>{" "}
                {translate("in the workspace first if you'd like to.")}
              </p>

              <p className="text-sm text-gray-600 dark:text-gray-400">
              {translate("You can <a>import a copy</a> of the collection too.").replace("<a>", '<a href="#" onClick={(e) => {e.preventDefault(); handleImportCollection();}}>')}
              </p>
            </div>

            {}
            <div className="flex gap-3 justify-end">
              <button onClick={() => setShowModal(false)} className="px-6 py-2.5 text-sm font-medium text-gray-900 dark:text-gray-100 bg-gray-100 dark:bg-slate-800 rounded-lg border border-gray-300 dark:border-slate-700 hover:bg-gray-200 dark:hover:bg-slate-700 transition-colors">
                {translate("Cancel")}
              </button>
              <button onClick={handleForkCollection} className="px-6 py-2.5 text-sm font-medium text-white bg-orange-600 rounded-lg hover:bg-orange-700 transition-colors">
                {translate("Fork Collection")}
              </button>
            </div>
          </div>
        </div>}

      {}
      {showImportingModal && <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50" onClick={() => setShowImportingModal(false)}>
          <div className="relative w-full max-w-md mx-4 p-8 bg-white dark:bg-[#0E0E10] rounded-xl shadow-2xl border border-gray-200 dark:border-slate-800" onClick={e => e.stopPropagation()}>
            {}
            <button onClick={() => setShowImportingModal(false)} className="absolute top-4 right-4 w-8 h-8 flex items-center justify-center text-gray-400 dark:text-gray-500 hover:text-gray-600 dark:hover:text-gray-400 transition-colors" title={translate("Close")}>
              ✕
            </button>

            {}
            <h2 className="mb-4 text-xl font-semibold text-gray-900 dark:text-gray-100 mt-0">{translate("Importing collection...")}</h2>

            {}
            <div className="mb-6">
              <p className="text-sm text-gray-600 dark:text-gray-400 mb-4">
                {translate("Your Postman desktop app should launch now and start importing the collection.")}
              </p>
              <br />
              <br />
              <p className="text-orange-600 dark:text-orange-500">
                {translate("Don't have the Postman desktop app? <a>Download Desktop App</a>").replace("<a>", '<a href="https://www.postman.com/downloads/" target="_blank" rel="noopener noreferrer">')}
              </p>
            </div>
          </div>
        </div>}
    </>;
};

<Link href="https://postman.com">Postman</Link>は、フルセットの開発環境を構成しなくても、使いやすいインターフェースでHTTPリクエストを作成およびテストできるツールです。

**Box Postmanコレクション**は事前設定済みのリクエストをまとめたもので、これにより、リクエストを手動で構成しなくても、Box APIを利用できるようになります。

## クイックスタート

### 手順1: Postmanをインストールする

お使いのオペレーティングシステム (Windows、Mac、Linux) に適したPostmanアプリを<Link href="https://www.postman.com/downloads/">ダウンロード</Link>してインストールします。必要に応じて、<Link href="https://identity.getpostman.com/signup">Postmanアカウントを作成してサインインします</Link>。

### 手順2: Boxアプリを構成する

Postmanコレクションを使用するには、Box APIで認証を行うための**Boxアプリ**が必要です。次の例ではOAuth 2.0を使用していますが、その他の認証方法を使用することもできます。

1. <Link href="https://cloud.app.box.com/developers/console">開発者コンソール</Link>に移動します。
2. 次のいずれかを実行します。
   * アプリケーションを選択し、そのアプリケーションで認証方法として**標準OAuth 2.0**を使用することを確認します。
   * \[**新規アプリ**] を選択した後、**アプリ名**を入力し、\[**アプリタイプ**] として \[**OAuth 2.0**] を選択します。
3. \[**構成**] タブで \[**OAuth 2.0リダイレクトURI**] セクションまでスクロールし、\[**リダイレクトURI**] を`https://oauth.pstmn.io/v1/callback`に設定します。

   <Info>
     デスクトップアプリではなくPostmanウェブアプリを使用している場合は、すべての関連する手順で`https://oauth.pstmn.io/v1/browser-callback`を使用してください。
   </Info>
4. \[**アプリケーションスコープ**] セクションまでスクロールして、目的の<Link href="/guides/api-calls/permissions-and-errors/scopes">スコープ</Link>を選択します。アプリケーションには、以下のスコープのうち少なくとも1つが必要です。
   * `Manage users`
   * `Read all files and folders stored in Box`
   * `Read and write all files and folders in Box`
5. ページ上部にある \[**変更を保存**] をクリックします。
6. \[**OAuth 2.0資格情報**] セクションから、\[**クライアントID**] と \[**クライアントシークレット**] をコピーします。

### 手順3: Boxにログインする

前の手順で取得した**クライアントID**と**クライアントシークレット**を使用して、PostmanのOAuth 2.0でBoxの認証を行います。

1. Postmanで、<Link href="https://learning.postman.com/docs/sending-requests/create-requests/request-basics/">新しいリクエスト</Link>を作成するか、既存のリクエストを開きます。
2. \[**Authorization (承認)**] タブに移動します。
3. \[**Type (タイプ)**] を \[**OAuth 2.0**] に設定します。
4. Postmanデスクトップアプリを使用している場合は、\[**Authorize using browser (ブラウザを使用して承認)**] を選択します。
5. \[**Configure New Token (新しいトークンの構成)**] のフィールドを入力します。

| フィールド                                | 値                                                                                                       |
| ------------------------------------ | ------------------------------------------------------------------------------------------------------- |
| **Token Name (トークン名)**               | 任意の名前 (例: `Box Access Token`)                                                                           |
| **Grant Type (許可タイプ)**               | `Authorization Code`                                                                                    |
| **Callback URL (コールバックURL)**         | `https://oauth.pstmn.io/v1/callback` (\[**Authorize using browser (ブラウザを使用して承認)**] を選択している場合は自動で入力されます) |
| **Auth URL (認証URL)**                 | `https://account.box.com/api/oauth2/authorize`                                                          |
| **Access Token URL (アクセストークンURL)**   | `https://api.box.com/oauth2/token`                                                                      |
| **Client ID (クライアントID)**             | 開発者コンソールからコピーした、アプリのクライアントID                                                                            |
| **クライアントシークレット**                     | 開発者コンソールからコピーした、アプリのクライアントシークレット                                                                        |
| **スコープ**                             | 空のままにする                                                                                                 |
| **State (状態)**                       | 空のままにする                                                                                                 |
| **Client Authentication (クライアント認証)** | `Send client credentials in body`                                                                       |

6. \[**Get New Access Token (新しいアクセストークンを取得)**] をクリックします。
7. ブラウザウィンドウが開かれるので、そこでBoxアカウントにログインしてアプリのアクセスを許可します。
8. 承認後、Postmanはアクセストークンを受け取ります。\[**Use Token (トークンを使用)**] を選択してください。

### 手順4: Box Postmanコレクションをフォークする

下のボタンをクリックして、**Box Postmanコレクション**を自分のPostmanワークスペースにフォークします。

<Postman anonymous />

Boxによる変更が行われた場合に更新を受け取れるように、コレクションを (コピーではなく) フォークすることをお勧めします。コレクションはインポートするとPostmanの左側のサイドバーに表示されます。リソースの種類別に整理された170以上のAPIエンドポイントを探索できます。

### 手順5: Box環境を構成する

Box Postmanコレクションでは、環境変数を使用してAPIリクエストを認証します。コールを実行する前に、コレクションとともにインポートされた**Box**環境で以下の変数を設定しておく必要があります。

1. Postmanの左側のサイドバーで、\[**Environments (環境)**] ドロップダウンから \[**Box**] を選択します。
2. 次のとおりにフィールドに入力します。

| 変数              | 値                                |
| --------------- | -------------------------------- |
| `client_id`     | 開発者コンソールからコピーした、アプリのクライアントID     |
| `client_secret` | 開発者コンソールからコピーした、アプリのクライアントシークレット |
| `grant_type`    | `authorization_code`             |

3. \[**保存**] をクリックします。

4. 次に、承認`code`を取得して、アクセストークンと交換する必要があります。コードを取得するには、ブラウザで次のURLにアクセスします。`[CLIENT_ID]`は実際のクライアントIDに置き換えてください。

`https://account.box.com/api/oauth2/authorize?response_type=code&client_id=[CLIENT_ID]&redirect_uri=https://oauth.pstmn.io/v1/callback
`

5. ログインしてアクセスを許可します。リダイレクト後、ブラウザのアドレスバーでURLの末尾から`code`パラメータをコピーします。このコードの有効期限は**30秒**のため、次の手順をすばやく完了してください。
6. Postmanに戻り、Box環境で`code`を**変数**として入力し、そのコードを \[**Value (値)**] フィールドに貼り付けます。
7. \[**Authorization (承認)**] フォルダを開き、\[**Refresh access token (アクセストークンを更新)**] を選択して、\[**Send (送信)**] をクリックします。
8. 成功した場合は、レスポンスとして`access_token`と`refresh_token`が返されます。これらをBox環境に入力します。

### 手順6: Box環境をテストする

1. Box Postmanコレクションで、\[**Folders (フォルダ)**] フォルダを展開し、\[**List items in folder (フォルダ内の項目のリストを取得)**] を選択します。
2. `folder_id`はデフォルトで`0` (ルートフォルダ) に設定されています。これはそのままにするか、特定のフォルダIDに変更します。
3. \[**Send (送信)**] をクリックします。

レスポンスの \[**Body (本文)**] タブには、フォルダ内の項目が表示されます。

<Warning>
  Postmanから認証エラーが返される場合は、アクセストークンの有効期限が切れている可能性があります。詳細については、<Link href="/guides/tooling/postman/refresh">アクセストークンの更新</Link>を参照してください。
</Warning>

## 追加情報

* Postmanチームが提供する<Link href="https://learning.postman.com/docs/getting-started/overview/">Postmanの公式ドキュメント</Link>を確認してください。
* 自動更新など、<Link href="/guides/tooling/postman/refresh">アクセストークンを更新</Link>してトークンの有効期限切れに対処する方法を確認してください。

<RelatedLinks
  title="関連するガイド"
  items={[
{ label: translate("Box SDKs"), href: "/guides/tooling/sdks/index", badge: "GUIDE" },
{ label: translate("OAuth 2.0 Auth"), href: "/guides/authentication/oauth2/index", badge: "GUIDE" }
]}
/>
