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

# Connect Meta WhatsApp channel

> Complete flow to connect a META_WHATSAPP channel to the WhatsApp Official API

export const frontendUrl = 'https://app.hubmessage.io';

export const projectName = 'Hub Message';

## Overview

After [creating a channel](/en/channels/create-channel) of type `META_WHATSAPP`, you need to **connect it** to a WhatsApp Business number. There are two ways:

* **Via dashboard** — Guided flow directly in the [Dashboard](\{frontendUrl})
* **Via SDK + API** — Integrate the connection flow into your system

## Connection via dashboard

The simplest way. Go to the [Dashboard](\{frontendUrl}), select the created channel and follow the guided connection flow.

## Connection via SDK + API

Use this flow when you want **your user** to connect the channel from within **your system**, without needing to access the {projectName} dashboard.

The flow has 3 steps:

<Steps>
  <Step title="Frontend — Start connection with SDK">
    In your application's **frontend**, use the SDK to start the connection flow. The SDK will open the WhatsApp authentication process and return the necessary information.

    ```javascript theme={null}
    import HubMessage from '@hubmessage/connect';

    const client = HubMessage.newClient({
      publicKey: 'YOUR_PUBLIC_KEY'
    });

    const response = await client.connect({
      channelId: 'CHANNEL_ID'
    });

    // Send the response to your backend
    ```

    <Tip>
      The `publicKey` can be exposed in the frontend. See more at [Authentication](/en/authentication).
    </Tip>
  </Step>

  <Step title="Frontend → Backend — Send data">
    The SDK returns an object with the connection information. Send this data to your application's **backend**:

    ```json theme={null}
    {
      "wabaId": "428083093730937",
      "phoneId": "123456789012345",
      "code": "ABC123DEF456",
      "coexistence": false
    }
    ```

    | Field         | Type    | Description                               |
    | ------------- | ------- | ----------------------------------------- |
    | `wabaId`      | string  | Selected WhatsApp Business Account ID     |
    | `phoneId`     | string  | Selected phone number ID                  |
    | `code`        | string  | Authorization code generated by WhatsApp  |
    | `coexistence` | boolean | Whether the number is in coexistence mode |
  </Step>

  <Step title="Backend — Finalize connection via API">
    In the **backend**, call the connection API passing the data received from the frontend:

    `POST /v1/channels/{channelId}/connect`

    ```bash theme={null}
    curl -X POST https://api.hubmessage.io/v1/channels/CHANNEL_ID/connect \
      -H "Content-Type: application/json" \
      -H "Authorization: Bearer YOUR_SECRET_KEY" \
      -d '{
        "wabaId": "428083093730937",
        "phoneId": "123456789012345",
        "code": "ABC123DEF456",
        "coexistence": false
      }'
    ```

    <Warning>
      This call must be made in the **backend**, as it uses the Secret Key which should never be exposed in the frontend.
    </Warning>
  </Step>
</Steps>

## Flow summary

```
Frontend (SDK)              →  Backend (API)

1. client.connect()
2. User authenticates
3. SDK returns data -----→  4. POST /v1/channels/{id}/connect
                               with wabaId, phoneId, code, coexistence
                            5. Channel connected ✓
```

<Note>
  After connection, the channel is ready to send and receive messages. Use the `channelId` in the [free messages](/en/messages/introduction) and [templates](/en/templates/introduction) endpoints.
</Note>


## OpenAPI

````yaml en/channels/openapi-connect.json POST /v1/channels/{channelId}/connect
openapi: 3.1.0
info:
  title: Hub Message - Connect Channel
  version: 1.0.0
servers:
  - url: https://api.hubmessage.io
security:
  - bearerAuth: []
paths:
  /v1/channels/{channelId}/connect:
    post:
      tags:
        - Channels
      summary: Connect Meta WhatsApp channel
      description: >-
        Finalizes the connection of a **META_WHATSAPP** channel with the data
        returned by the `@hubmessage/connect` SDK. Exclusive to WhatsApp
        Official API (Meta) channels.
      operationId: connectMetaChannel
      parameters:
        - name: channelId
          in: path
          required: true
          description: Channel ID (obtained via Create channel)
          schema:
            type: string
            example: a1b2c3d4-e5f6-7890-abcd-ef1234567890
      requestBody:
        required: true
        content:
          application/json:
            schema:
              $ref: '#/components/schemas/ConnectChannelRequest'
            example:
              wabaId: '428083093730937'
              phoneId: '123456789012345'
              code: ABC123DEF456
              coexistence: false
      responses:
        '200':
          description: Channel connected successfully
          content:
            application/json:
              schema:
                $ref: '#/components/schemas/SuccessResponse'
              example:
                success: true
        '401':
          $ref: '#/components/responses/Unauthorized'
components:
  schemas:
    ConnectChannelRequest:
      type: object
      required:
        - wabaId
        - phoneId
        - code
        - coexistence
      properties:
        wabaId:
          type: string
          description: WhatsApp Business Account ID
        phoneId:
          type: string
          description: Phone number ID
        code:
          type: string
          description: Authorization code generated by WhatsApp
        coexistence:
          type: boolean
          description: Whether the number is in coexistence mode
    SuccessResponse:
      type: object
      properties:
        success:
          type: boolean
          description: Indicates whether the operation was successful
    Error:
      type: object
      properties:
        error:
          type: integer
        message:
          type: string
  responses:
    Unauthorized:
      description: Invalid or missing token.
      content:
        application/json:
          schema:
            $ref: '#/components/schemas/Error'
          example:
            error: 401
            message: Unauthorized
  securitySchemes:
    bearerAuth:
      type: http
      scheme: bearer
      description: Secret Key generated in the Hub Message Security panel

````