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

# WhatsApp ボットのホスティング方法

> Square Cloud で WhatsApp ボットを作成してホスティングする方法を学びます。設定、デプロイ、Node.js による実践的な例を含む完全なチュートリアルです。

export const RecommendedPlan = ({lang, plan, tier, cpu, appType}) => {
  const url = `https://squarecloud.app/${lang}/pay?plan=${plan.toLowerCase()}&tier=${tier}`;
  if (lang == 'en') {
    return <Note>
        <b>Wondering how much RAM and CPU your plan needs to host {appType}?</b><br />
        Don't worry, we're here to help.
        Our <a href={url}>{plan}</a> plan offers <b>{tier}GB</b> of RAM and <b>{cpu}vCPU</b>, which should be sufficient for most {appType}. 
        However, if you are working on a larger project and seeking extra stability, we recommend considering our <b>Pro</b> plan. With additional resources, you can maintain stability even during demand spikes. 
        To purchase, simply click <a href="https://squarecloud.app/en/pay?plan=pro">here</a>.
      </Note>;
  } else {
    return <Note>
          <b>Está se perguntando quanta RAM e CPU seu plano precisa para hospedar {appType}?</b><br />
          Não se preocupe, estamos aqui para ajudar.
          Nosso plano <a href={url}>{plan}</a> oferece <b>{tier}GB</b> de RAM e <b>{cpu}vCPU</b>, o que deve ser suficiente para a maioria dos {appType}.
          No entanto, se você estiver trabalhando em um projeto maior e precisar de mais estabilidade, recomendamos considerar nosso plano <b>Pro</b>.
          Com recursos adicionais, você pode manter a estabilidade mesmo durante picos de demanda.
          Para comprar, basta clicar <a href={`https://squarecloud.app/${lang}/pay?plan=pro`}>aqui</a>.
        </Note>;
  }
};

export const appType_0 = "a Whatsapp bot"

## はじめに

Square Cloud で {appType_0} を開発してホストするには、構成と前提条件の体系的な手順に従うことが不可欠です。この技術ガイドでは、初期セットアップから本番環境へのデプロイまで、プロセス全体を解説します。

### 前提条件

* **Square Cloud アカウント**: [登録ページ](https://squarecloud.app/ja/signup)からメールアドレスを使って登録します。
* **有効な有料プラン**: アプリケーションに専用リソースと最適化されたパフォーマンスを提供します。[利用可能なプラン](https://squarecloud.app/ja/pricing)を確認し、ニーズに最も適したものを選択してください。

<RecommendedPlan appType="Whatsapp bots" plan="Standard" tier="4" cpu="4" lang="ja" />

## プロジェクトの作成

ボットの認証と連携には、WhatsApp がインストールされ設定されている必要があります。アプリをお持ちでない場合は、[WhatsApp 公式サイト](https://www.whatsapp.com/coronavirus/get-started?lang=en)からダウンロードしてセットアップしてください。

<AccordionGroup>
  <Accordion title="WhatsApp Web のリモートパス設定" icon="file" iconType="solid">
    実装で WhatsApp Web バージョンのリモートパスにアクセスする必要がある場合は、次の技術的な手順に従ってください:

    1. [wa-version](https://github.com/wppconnect-team/wa-version/tree/main/html) リポジトリにアクセスします
    2. 目的のバージョンを選択します(常に最新版の使用を推奨します)
    3. 「Raw」をクリックしてファイルを表示します
    4. 生成された URL を後で使用するためにコピーします

    **設定された URL の例:**

    ```
    https://raw.githubusercontent.com/wppconnect-team/wa-version/main/html/2.2412.54.html
    ```
  </Accordion>
</AccordionGroup>

### プロジェクトの開発

1. **Node.js の確認**: Node.js がシステムにインストールされていることを確認してください。ない場合は、[Node.js 公式サイト](https://nodejs.org/)からダウンロードしてください。

2. **プロジェクトの初期化**: 初期化コマンドを実行して、新しい Node.js プロジェクトをセットアップします:

```bash Terminal theme={null}
npm init -y
```

3. **依存関係のインストール**: ボットの機能に必要な基本ライブラリをインストールします:

```bash Terminal theme={null}
npm install whatsapp-web.js qrcode
```

4. **メインファイルの作成**: ボットの基本構造を含む `index.js` ファイルを作成します:

```javascript index.js theme={null}
// Import necessary modules
const { Client } = require("whatsapp-web.js");
const qrcode = require("qrcode");

// Create a new WhatsApp client instance
const client = new Client({
  puppeteer: {
    // Run Chrome in headless mode (without graphical interface)
    headless: true,
    args: [
      // Disable Chrome sandboxing features
      // Required for execution in containerized environments
      "--no-sandbox",
      // Additional sandboxing flag to disable setuid sandbox
      "--disable-setuid-sandbox",
    ],
  },
  // Web version cache configuration
  webVersionCache: {
    // Type "remote" indicates WhatsApp Web version will be fetched from remote URL
    type: "remote",
    // Remote path for WhatsApp Web version
    remotePath: "INSERT_YOUR_URL_HERE",
  },
});

// Event listener for QR Code generation
client.on("qr", async (qr) => {
  // Use qrcode library to generate and save QR Code
  try {
    await qrcode.toFile("./qrcode.png", qr);
    console.log("QR Code generated and saved as qrcode.png");
  } catch (err) {
    console.error("Error generating QR Code:", err);
  }
});

// Event listener for client ready
client.on("ready", () => {
  // Confirmation log when WhatsApp Web session is established
  console.log("WhatsApp client successfully initialized!");
});

// Event listener for created messages
client.on("message_create", (msg) => {
  // Log message content to console
  console.log("Message received:", msg.body);
  
  // Test command implementation
  if (msg.body === "!ping") {
    // Automatic response for ping command
    msg.reply("pong - Bot working correctly!");
  }
});

// Initialize WhatsApp client
client.initialize();
```

## デプロイ

プロジェクトファイルの準備が完了したら、それらを Square Cloud にアップロードしてプロジェクトをホスティングできます。
そのためには、すべてのプロジェクトファイルを含む ZIP ファイルを作成してください。

### ダッシュボード経由

<Steps>
  <Step title="アップロードページにアクセス">
    [アップロードページ](https://squarecloud.app/ja/dashboard/new)にアクセスし、プロジェクトの zip ファイルをアップロードします。
  </Step>

  <Step title="環境を設定">
    zip をアップロードした後、プロジェクトの名前、メインファイルまたはランタイム環境、その他の設定を構成する必要があります。\
    ウェブプロジェクトをアップロードする場合は、必ず「Web Publication」を選択し、プロジェクトにサブドメインを設定してください。
  </Step>

  <Step title="プロジェクトをデプロイ">
    最後に「Deploy」ボタンをクリックして、プロジェクトを Square Cloud にホストします。\
    デプロイ後、ダッシュボードからプロジェクトのステータスとログを監視できます。

    <Frame>
      <img src="https://cdn.squarecloud.app/docs/articles/dashboard/uploading.gif" alt="Square Cloud へのアプリケーションのアップロード" style={{ borderRadius: "0.2rem" }} />
    </Frame>
  </Step>
</Steps>

### CLI 経由

この方法を使用するには、プロジェクトのルートディレクトリに `squarecloud.app` という名前の設定ファイルを作成する必要があります。このファイルには、プロジェクトに必要な設定が含まれます。

<Card title="詳細はこちら: Square Cloud の設定ファイルの作成方法。" icon="link" href="/ja/getting-started/config-file">
  squarecloud.app ファイルはアプリケーションを構成するために使用される設定ファイルであり、環境を定義するために使用されます。
</Card>

<Steps>
  <Step title="CLI をインストール">
    まず、環境に CLI がインストールされている必要があります。まだの場合は、ターミナルで次のコマンドを実行してください:

    ```
    npm install -g @squarecloud/cli
    ```

    すでにお持ちの場合は、更新することを推奨します。更新するには、ターミナルで次のコマンドを実行してください:

    <Tabs>
      <Tab title="Windows">
        ```bash theme={null}
        squarecloud update
        ```
      </Tab>

      <Tab title="Linux, macOS, and WSL">
        ```bash theme={null}
        curl -fsSL https://cli.squarecloud.app/install | bash
        ```
      </Tab>
    </Tabs>
  </Step>

  <Step title="認証">
    次に、認証して他の CLI コマンドを使用するには、[こちら](https://squarecloud.app/ja/account/security)で「Request API Key」をクリックして認証キーを取得します。認証キーを取得したら、次のコマンドを実行してください:

    ```bash theme={null}
    squarecloud auth login
    ```
  </Step>

  <Step title="プロジェクトをアップロード">
    最後に、CLI を使用してアプリケーションを Square Cloud にデプロイするには、次のコマンドを実行する必要があります:

    ```bash theme={null}
    squarecloud upload 
    ```

    または、zip を手動で作成した場合は、次を使用できます:

    ```bash theme={null}
    squarecloud upload --file <path/to/zip> 
    ```
  </Step>
</Steps>

## その他のリソース

whatsapp-web.js を使用した WhatsApp ボット開発についてさらに理解を深めるには、[whatsapp-web.js 公式ライブラリのドキュメント](https://wwebjs.dev/)を参照してください。このドキュメントでは、詳細な技術ガイド、高度なチュートリアル、そして実装の可能性を最大化するための完全な API リファレンスを提供しています。

## お問い合わせ

**技術的な問題**が解決しない場合は、**専門のサポートチーム**がお手伝いします。[**お問い合わせ**](https://squarecloud.app/ja/support)いただければ、どのような問題でも喜んで解決をサポートいたします。