> For the complete documentation index, see [llms.txt](https://maxchat.gitbook.io/v3/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://maxchat.gitbook.io/v3/integration/app-service/webhook.md).

# Webhook

Dengan Webhook Anda dapat memantau pertukaran data secara real-time dari satu aplikasi ke aplikasi lainnya setiap kali **event** (peristiwa) tertentu terpicu. Dengan adanya penangkap event, Anda dapat mengintegrasikan aplikasi Anda dengan maxchat.

## Istilah dalam Webhook

Berikut istilah dalam webhook:

* **Trigger Event**: suatu peristiwa yang terjadi di aplikasi sumber (dalam hal ini adalah maxchat). Contohnya, chat baru terkirim.
* **Webhook URL**: aplikasi sumber (dalam hal ini adalah maxchat) akan mengirimkan data tentang event (peristiwa) ke alamat webhook yang telah ditentukan ke aplikasi tujuan.
* **Payload**: Data yang dikirim biasanya dalam format JSON atau XML, berisi detail tentang peristiwa tersebut.

## Cara Kerja Webhook

Berikut adalah cara kerja webhook:

1. **Menentukan Trigger Event**: Tentukan event apa yang akan memicu webhook. Misalnya, ketika ada chat baru yang terkirim ke pelanggan.
2. **Membuat URL Webhook**: Buat URL di aplikasi tujuan yang akan menerima data dari aplikasi sumber. URL ini harus dapat menerima permintaan HTTP POST. Contohnya, Anda dapat mendapatkan URL webhook melalui situs <https://webhook.site>

<figure><img src="/files/PSaK8cKnhd5EvVq8Q9pE" alt=""><figcaption></figcaption></figure>

3. **Mengonfigurasi Webhook di Aplikasi Sumber**: Di aplikasi sumber, konfigurasikan webhook dengan memasukkan URL yang telah Anda buat. \
   Pada tahap ini, silakan akses menu Integration, lalu pada sub-menu App Services Anda akan melihat bagian Webhook.\
   Silakan copy-paste URL webhook Anda ke dalam text area yang disediakan. Anda dapat memasukkan lebih dari satu URL.

<figure><img src="/files/mVY1u3kDLqZwUhoEHjnm" alt=""><figcaption></figcaption></figure>

4. **Mengirim Data**: Ketika peristiwa pemicu terjadi, aplikasi sumber akan mengirimkan permintaan HTTP POST ke URL webhook yang telah ditentukan, dengan payload yang berisi data tentang peristiwa tersebut.

{% code title="Contoh payload" lineNumbers="true" %}

```json
{
  "from": "628xxxxxxxxxx",
  "timestamp": 1724728411000,
  "id": "17247",
  "msgType": "text",
  "serviced": "654dac",
  "text": "Halo",
  "username": "Aisya"
}
```

{% endcode %}

5. **Menerima dan Memproses Data**: Aplikasi tujuan menerima data tersebut dan memprosesnya sesuai kebutuhan. Misalnya, memperbarui database atau mengirim notifikasi.

Berikut adalah contoh sederhana dalam kode PHP untuk menerima webhook:

{% code lineNumbers="true" %}

```php
<?php
// Mendapatkan data dari webhook
$payload = file_get_contents('php://input');
$data = json_decode($payload, true);

// Memproses data
if ($data['event'] == 'new_comment') {
    // Lakukan sesuatu, misalnya menyimpan komentar ke database
    saveComment($data['comment']);
}

function saveComment($comment) {
    // Logika untuk menyimpan komentar ke database
    // ...
}
?>
```

{% endcode %}

## Events

Platform Maxchat Omnichannel dapat menyediakan fitur untuk mengkustomisasi penggunaan webhook sesuai dengan kebutuhan Bisnis dengan cara menghubungkan event ke beberapa URL yang berbeda (dapat terhubung sampai ke 5 alamat URL ).

<figure><img src="/files/VWtbTCLDKzw0CCpFgJQ5" alt=""><figcaption></figcaption></figure>

Saat ini terdapat 5 event yang yang tersedia di platform Maxchat Omnichannel;

### 1. Incoming Message

Event ini akan tertrigger ketika ada pesan masuk (pesan dari pelanggan ke nomor WABA bisnis), payload datanya akan seperti ini:

```json
{
  "from": "628xxxxxxxxxx",
  "timestamp": 1732506641000,
  "id": "1732506642262aKBp3GaVoiet5DdfC7cih",
  "msgType": "text",
  "serviceId": "659d15320e794e7fefee1516",
  "text": "this is a sample text",
  "username": "a_customer",
  "chatId": "65a4cabff27103ca23545021"
}
```

### 2. Outgoing Message

Event ini akan tertrigger ketika ada pesan keluar (pesan dari nomor WABA bisnis ke pelanggan), payload datanya akan seperti ini:

```json
{
  "to": "628xxxxxxxxxx",
  "fromMe": true,
  "status": "queue",
  "id": "5nPS6g5usYlVN5Tc_7pT8-1732509850296",
  "msgType": "text",
  "serviceId": "659d15320e794e7fefee1516",
  "timestamp": 1732509850422,
  "channel": "whatsapp",
  "mimeType": null,
  "chatId": "65a4cabff27103ca23545021",
  "text": "Test message"
}
```

### 3. Message Status

Event ini akan tertrigger ketika ada perubahan status pesan keluar (pesan dari nomor WABA bisnis ke pelanggan), payload datanya akan seperti ini:

#### Sent

```json
// Some code
{
  "id": "9UPKez1WBvYZVBJ1AR-V3-1732509963755",
  "status": "sent",
  "timestamp": 1732509964000,
  "serviceId": "659d15320e794e7fefee1516"
}
```

#### Delivered

```json
// Some code
{
  "id": "9UPKez1WBvYZVBJ1AR-V3-1732509963755",
  "status": "delivered",
  "timestamp": 1732509965000,
  "serviceId": "659d15320e794e7fefee1516"
}
```

#### Read

```json
// Some code
{
  "id": "9UPKez1WBvYZVBJ1AR-V3-1732509963755",
  "status": "read",
  "timestamp": 1732510071000,
  "serviceId": "659d15320e794e7fefee1516"
}
```

### 4. Resolved

Event ini akan tertrigger ketika ada&#x20;

pesan keluar (pesan dari nomor WABA bisnis ke pelanggan), payload datanya akan seperti ini:

```json
// Some code
{
  "ticketId": "67440322b4db347c8aeddd45",
  "chatId": "65a4cabff27103ca23545021",
  "agentId": "662600a2f215d43c28e3e1ac",
  "resolved": true
}
```

### 5. Login/Logout Activity

#### Login

```json
// Some code
{
  "email": "supportmax@maxchat.id",
  "activity": "logout",
  "device": "Chrome",
  "name": "Maxchat",
  "role": "admin"
}
```

#### Logout

```json
// Some code
{
  "email": "supportmax@maxchat.id",
  "activity": "login",
  "device": "Chrome",
  "name": "Maxchat",
  "role": "admin"
}
```
