> ## 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.

# 基本的なサムネイルの取得

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>;
};

<RelatedLinks
  title="必須のガイド"
  items={[
{ label: translate("List All Representations for File"), href: "/guides/representations/list-all-representations", badge: "GUIDE" },
{ label: translate("Request Desired Representation"), href: "/guides/representations/request-a-representation", badge: "GUIDE" },
{ label: translate("Download File Representation"), href: "/guides/representations/download-a-representation", badge: "GUIDE" }
]}
/>

サムネイルとは小さい画像のことで、アプリケーション内でファイルのレプリゼンテーションとして使用できる`.png`または`.jpg`で表されます。たとえば、ファイルをダウンロードまたはプレビューするリンクのプレースホルダとして使用されます。

<Info>
  ファイルのサムネイルを取得するには、<Link href="/guides/representations/thumbnail-representation">レプリゼンテーションAPI</Link>を使用する方法をお勧めします。
</Info>

## リクエスト

ファイルのサムネイルをリクエストするには、<Link href="/reference/get-files-id-thumbnail-id">`GET
/files/:id/thumbnail.:extension`</Link>エンドポイントを使用します。

<CodeGroup>
  ```sh cURL theme={null}
  curl -i -X GET "https://api.box.com/2.0/files/12345/thumbnail.png" \
       -H "authorization: Bearer <ACCESS_TOKEN>"
  ```

  ```typescript Node/TypeScript v10 theme={null}
  await client.files.getFileThumbnailById(
    thumbnailFile.id,
    'png' as GetFileThumbnailByIdExtension,
  );
  ```

  ```python Python v10 theme={null}
  client.files.get_file_thumbnail_by_id(
      thumbnail_file.id, GetFileThumbnailByIdExtension.PNG
  )
  ```

  ```cs .NET v10 theme={null}
  await client.Files.GetFileThumbnailByIdAsync(fileId: thumbnailFile.Id, extension: GetFileThumbnailByIdExtension.Png);
  ```

  ```swift Swift v10 theme={null}
  try await client.files.getFileThumbnailById(fileId: thumbnailFile.id, extension_: GetFileThumbnailByIdExtension.png, downloadDestinationUrl: destinationPath)
  ```

  ```java Java v10 theme={null}
  client.getFiles().getFileThumbnailById(thumbnailFile.getId(), GetFileThumbnailByIdExtension.PNG)
  ```

  ```python Python v4 theme={null}
  file_id = '11111'

  thumbnail = client.file(file_id).get_thumbnail_representation('92x92', extension='jpg')
  ```

  ```cs .NET v6 theme={null}
  Stream thumbnailContents = await client.FilesManager.GetThumbnailAsync("11111", maxWidth: 160, maxHeight: 160);
  ```
</CodeGroup>

サムネイルの作成に成功すると、そのサムネイルがレスポンスの本文内でバイナリデータとして返されます。

## サムネイルの非同期的な作成

場合によっては、サムネイルを直接作成できないこともあります。代わりに、APIから`location`レスポンスヘッダーで`HTTP 202`が返されます。この場所は、サムネイルの生成中に使用できる一時的な画像のためのものです。

このエンドポイントを再試行するまでの推定秒数を示す`retry-after`レスポンスヘッダーも返されます。

## サポートされているファイルサイズ

以下のサムネイルの形式とサイズが使用可能です。

| ファイルの種類 | サイズ                                                                |
| ------- | ------------------------------------------------------------------ |
| JPG     | `32x32`, `94x94`, `160x160`, `320x320`, `1024x1024`, `2048x2048`\* |
| PNG     | `1024x1024`\*, `2048x2048`\*                                       |

`*`が付いているサイズには、いくつかの制限があります。

## ファイルサイズの制限

### 元のファイルサイズ

サムネイルは拡大されません。Boxにアップロードされたファイルの元のファイルサイズがレプリゼンテーションのサイズより小さい場合は、作成されるサムネイルのサイズの上限は元のファイルのサイズになります。

## サポートされているファイルの種類

現時点でサポートされているファイルの種類は以下のとおりです。

| ファイルの種類 | ファイル拡張子                                                                                                                                                         |
| ------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| ドキュメント  | `doc`, `docx`, `gdoc`, `gsheet`, `gslide`, `gslides`, `odp`, `ods`, `odt`, `pdf`, `ppt`, `pptx`, `rtf`, `wpd`, `xls`, `xlsm`, `xlsx`, `key`, `pages`, `numbers` |
| 画像      | `ai`, `bmp`, `dcm`, `dicm`, `eps`, `gif`, `idml`, `indd`, `indt`, `inx`, `jpeg`, `jpg`, `png`, `ps`, `psd`, `svg`, `svs`, `tif`, `tiff`, `tga`                  |
| オーディオ   | `aac`, `aifc`, `aiff`, `amr`, `au`, `flac`, `m4a`, `mp3`, `ogg`, `ra`, `wav`, `wma`                                                                             |
| 動画      | `3g2`, `3gp`, `avi`, `m2v`, `m2ts`, `m4v`, `mkv`, `mov`, `mp4`, `mpeg`, `mpg`, `mts`, `ogg`, `qt`, `wmv`                                                        |

<RelatedLinks
  title="関連するAPI"
  items={[
{ label: translate("Get file thumbnail"), href: "/reference/get-files-id-thumbnail-id", badge: "GET" }
]}
/>

<RelatedLinks
  title="関連するガイド"
  items={[
{ label: translate("Get Thumbnail Representation"), href: "/guides/representations/thumbnail-representation", badge: "GUIDE" },
{ label: translate("Supported File Types"), href: "/guides/representations/supported-file-types", badge: "GUIDE" }
]}
/>