---
title: "เว็บฮุค: บอกเครื่องมืออื่นว่าเกิดอะไรขึ้น | Briks"
url: https://briks.dev/th/docs/webhooks
description: "ส่งข้อความที่ลงลายเซ็นไปยังเครื่องมืออื่นเมื่อเว็บไซต์เผยแพร่ ส่งแบบฟอร์ม หรือระเบียนเปลี่ยน อธิบายเพย์โหลด ลายเซ็น การลองใหม่ และการส่ง"
last_updated: 2026-10-08
---

# เว็บฮุค: บอกเครื่องมืออื่นว่าเกิดอะไรขึ้น

เว็บฮุคส่งข้อความสั้น ๆ ไปยังเครื่องมืออื่นทันทีที่มีเหตุการณ์เกิดขึ้นในโปรเจกต์ของคุณ เช่น การเผยแพร่ ข้อมูลที่ส่งเข้าฟอร์ม หรือเรคคอร์ดที่เปลี่ยนแปลง หน้านี้อธิบายวิธีเพิ่มเว็บฮุค หน้าตาของข้อความ วิธีที่ปลายทางตรวจสอบว่าเป็นข้อความจริง และสิ่งที่เกิดขึ้นเมื่อปลายทางนั้นใช้งานไม่ได้

อ่าน 7 นาทีตรวจเทียบกับสตูดิโอเมื่อ 8 ตุลาคม 2569

## เว็บฮุกคืออะไร

ลองนึกว่าเป็นโปรเจกต์ของคุณโทรไปบอกบริการอื่นว่าเพิ่งเกิดอะไรขึ้น คุณให้ที่อยู่แก่ Briks (URL ที่เครื่องมืออื่นให้มา) เลือกเหตุการณ์ที่ต้องการให้แจ้ง และทุกครั้งที่เกิดขึ้น Briks จะส่งข้อความไปที่นั่น เครื่องมืออัตโนมัติ เครื่องมือจัดการรายชื่อลูกค้า และส่วนเสริมของสเปรดชีตจำนวนมากให้ที่อยู่แบบนี้ได้

ในทางเทคนิค แต่ละข้อความคือคำขอแบบ POST ซึ่งเป็นการเรียกที่มีเนื้อหาแนบมา เขียนในรูปแบบ JSON ซึ่งเป็นรูปแบบข้อความธรรมดาที่โปรแกรมอ่านได้ เครื่องมือที่รับข้อความจะอ่านเนื้อหานั้นและทำตามที่คุณตั้งไว้

| อีเวนต์ ตามที่สตูดิโอแสดง | โค้ด | ส่งเมื่อ |
| --- | --- | --- |
| **Published** | `site.published` | เว็บไซต์เวอร์ชันใหม่เผยแพร่แล้ว |
| **Form received** | `form.received` | ผู้เข้าชมส่งข้อความผ่านหนึ่งในฟอร์มของเว็บไซต์ |
| **Record changed** | `record.changed` | มีการเพิ่ม แก้ไข หรือลบระเบียนในฐานข้อมูลของโปรเจกต์ |

`record.changed` ตามการเปลี่ยนแปลงที่ทำในสตูดิโอ คือเพิ่ม แก้ไข หรือลบระเบียนในแท็บ Database ล้างคอลเลกชัน หรือกู้คืนฐานข้อมูล ระเบียนที่เว็บไซต์ที่เผยแพร่แล้วบันทึกเอง เช่นคำขอจองที่ผู้เข้าชมส่งมา จะไม่ทริกเกอร์

`form.received` จะถูกส่งทั้งสำหรับรายการที่ส่งมาจากพรีวิวและจากเวอร์ชันใช้งานจริง แต่ละข้อความจะระบุว่ามาจากที่ใด เพื่อให้เครื่องมืออื่นข้ามรายการจากพรีวิวได้

ที่ไหน

1. Projects
2. Your project
3. Settings
4. Webhooks

## ข้อจำกัดของแต่ละแพลน

| แพ็กเกจ | เว็บฮุกต่อโปรเจกต์ | จำนวนการเรียกต่อวันต่อโปรเจกต์ |
| --- | --- | --- |
| Free | 1 | 2,000 |
| Starter | 5 | 5,000 |
| Pro | 10 | 10,000 |
| Studio | 25 | 50,000 |
| Agency | 50 | 100,000 |

จำนวนการเรียกต่อวันใช้ร่วมกับงานตามกำหนดเวลา ความพยายามส่งแต่ละครั้งนับเป็นหนึ่งครั้ง รวมถึงการลองใหม่ และวันใหม่เริ่มตอนเที่ยงคืน UTC

เมื่อใช้การเรียกของวันนี้หมดแล้ว การส่งจะไม่ถูกส่งและถูกทำเครื่องหมายเป็น **Failed** พร้อมข้อความ: Today's calls for this project are used up, so this delivery was not sent. Send it again tomorrow.

เมื่อโปรเจกต์มีเว็บฮุกครบตามที่แผนอนุญาต **Add webhook** จะเป็นสีเทา และลิงก์ **Get more** ข้างตัวเลขจะเปิดหน้าต่างอัปเกรด ซึ่งระบุแผนที่เล็กที่สุดที่ยังมีที่ว่างเพิ่มอีกหนึ่ง

## เพิ่ม webhook

1. กด Add webhook

   ที่ไหน: Settings, Webhooks

   หน้านี้แสดงจำนวนที่คุณมีเทียบกับแผนของคุณ เช่น 1 จาก 5 ในแผนของคุณ Editor, Admin และ Owner เพิ่ม webhook ได้

2. ป้อนที่อยู่

   ที่ไหน: Add a webhook

   วางที่อยู่ที่เครื่องมืออื่นให้ไว้ลงใน **Address** ต้องเป็นที่อยู่ https สาธารณะ ที่เขียนเป็นชื่อเต็ม ไม่ใช่ตัวเลข

3. เพิ่มบันทึก

   ที่ไหน: Add a webhook

   **Note** ไม่บังคับ ยาวได้ไม่เกิน 120 ตัวอักษร และช่วยให้แยกเว็บฮุกออกจากกันได้ในภายหลัง เช่น `Enquiries sheet`

4. เลือกอีเวนต์

   ที่ไหน: Add a webhook

   ติ๊กเหตุการณ์ที่ต้องการให้รับรู้ **Published** และ **Form received** ติ๊กไว้ตั้งแต่แรก เปลี่ยนได้ตามต้องการ

5. บันทึกและคัดลอกรหัสลับ

   ที่ไหน: Your signing secret

   กด **Add webhook** กล่องโต้ตอบจะแสดงรหัสลับสำหรับการลงนาม ซึ่งขึ้นต้นด้วย `whsec_` กด **Copy** แล้วเก็บไว้ เพราะจะแสดงเพียงครั้งเดียว จากนั้นกด **Done**

6. ส่งอีเมลทดสอบ

   ที่ไหน: Settings, Webhooks

   เปิดจุดสามจุดของเว็บฮุกแล้วเลือก **Send a test event** คุณจะเห็น: A test event is on its way. See how it went under Deliveries.

เว็บฮุคแต่ละรายการในรายการจะแสดงที่อยู่ หมายเหตุ และเหตุการณ์ ซีเคร็ตที่ใช้เซ็นชื่อ (อักขระสองสามตัวแรก) และผลของการส่งครั้งล่าสุด สวิตช์ของแต่ละรายการใช้เปิดเป็น **On** หรือปิดเป็น **Off** ส่วนจุดสามจุดมี **Send a test event** (ส่งได้สูงสุดสิบครั้งต่อชั่วโมง และเฉพาะเมื่อเปิดอยู่), **Change**, **New signing secret** และ **Delete**

## การจัดส่งหน้าตาเป็นอย่างไร

ทุกการส่งมี 3 ส่วนเหมือนกัน: `type` (รหัสของเหตุการณ์), `timestamp` (เวลาที่เกิดขึ้น เป็น UTC) และ `data` (รายละเอียด) ตัวอย่างการส่งแบบฟอร์ม:

การส่ง form.received

> `{"type":"form.received","timestamp":"2026-10-08T09:41:07.000Z","data":{"form":{"id":"…","subject":"สอบถามงานแต่งงาน","page":"/contact","fields":[{"label":"ชื่อ","value":"Ellie Marsh"},{"label":"วันแต่งงาน","value":"14 มิถุนายน 2027"}],"replyTo":"ellie@example.com"},"production":true}}`

| กิจกรรม | `data` เก็บอะไรไว้ |
| --- | --- |
| `form.received` | `form`: ประกอบด้วย `id`, `subject`, `page` ที่ส่งฟอร์มมา, `fields` (แต่ละรายการมี `label` และ `value` เรียงตามลำดับในฟอร์ม) และ `replyTo` ซึ่งเป็นอีเมลของผู้เข้าชมเมื่อฟอร์มขอข้อมูลนี้ จากนั้นคือ `production`: เป็น `true` สำหรับเว็บไซต์ที่ใช้งานจริง และ `false` สำหรับพรีวิว |
| `site.published` | `url`: ที่อยู่ที่เว็บไซต์เปิดใช้งาน `production`: เว็บไซต์อยู่ในเวอร์ชันใช้งานจริงหรือไม่ `abTest`: มีการทดสอบ A/B กำลังรันอยู่หรือไม่ `served`: Briks เห็นเวอร์ชันใหม่ตอบกลับที่ที่อยู่นั้นหรือไม่ ณ ตอนที่ส่งข้อความ |
| `record.changed` | `action`: `created`, `updated`, `deleted`, `cleared` หรือ `restored` `collection`: คอลเลกชันใด `record`: id ของเรคคอร์ด ค่าในเรคคอร์ดไม่รวมอยู่ด้วย |
| `test` | `message` และ `project` พร้อม `id` และ `name` ส่งเฉพาะเมื่อคุณกด **Send a test event** |

การส่งแต่ละครั้งยังมีเฮดเดอร์อีกสามรายการ ได้แก่ `webhook-id` (รหัสของข้อความ), `webhook-timestamp` (เวลาที่ส่ง เป็นวินาที) และ `webhook-signature` เฮดเดอร์เหล่านี้เป็นไปตามรูปแบบ Standard Webhooks แบบเปิด เครื่องมือที่รองรับจึงตรวจสอบการส่งให้คุณได้

## ตรวจสอบว่าข้อมูลที่ส่งมาเป็นของจริง

ใครก็ส่งข้อความไปยังที่อยู่หนึ่งได้ ฝั่งรับจึงควรตรวจลายเซ็นก่อนเชื่อถือ ลายเซ็นสร้างด้วยความลับสำหรับลงนามที่มีเพียงคุณกับ Briks เท่านั้น เมื่อโปรเจกต์มีเว็บฮุกแล้ว หน้า Webhooks จะแสดงตัวอย่างโค้ดสั้นๆ ใต้ **Checking a delivery is genuine** เป็นคำพูด การตรวจมีขั้นตอนดังนี้:

1. รับเนื้อหาคำขอตามที่ส่งมาทุกประการในรูปแบบข้อความ ก่อนจะอ่านเป็น JSON
2. ต่อ `webhook-id`, `webhook-timestamp` และเนื้อหาเข้าด้วยกัน โดยคั่นด้วยจุด
3. นำ secret ของคุณมา ตัด `whsec_` ที่ขึ้นต้นออก แล้วถอดรหัสส่วนที่เหลือจาก base64 นั่นคือคีย์
4. ลงลายเซ็นข้อความที่ต่อกันด้วย HMAC SHA-256 และคีย์นั้น เขียนผลลัพธ์เป็น base64 และใส่ `v1,` ไว้ข้างหน้า
5. การส่งข้อมูลถือว่าเป็นของจริงหากค่านั้นตรงกับค่าใดค่าหนึ่งที่คั่นด้วยช่องว่างใน `webhook-signature` และเวลาที่ระบุอยู่ในช่วงห้านาทีจากปัจจุบัน

การส่งที่ลองใหม่จะใช้ `webhook-id` เดิม ผู้รับจึงเก็บ id ที่จัดการแล้วไว้และข้ามรายการซ้ำได้

เก็บความลับให้ปลอดภัย

รหัสลับสำหรับลงนามจะแสดงเพียงครั้งเดียวและแสดงซ้ำไม่ได้ หากทำหายหรือรั่วไหล ให้เลือก **New signing secret** จากจุดสามจุดของเว็บฮุก รหัสเก่าจะหยุดลงนามการส่งข้อมูลใหม่ทันที ดังนั้นให้ใส่รหัสใหม่ในเครื่องมือที่รับข้อมูลทันที

## การส่งและการลองใหม่

ที่ไหน

1. Projects
2. Your project
3. Settings
4. Webhooks
5. Deliveries

**Deliveries** แสดงการส่งทุกรายการในช่วงสามสิบวันที่ผ่านมา โดยเรียงจากใหม่สุดก่อน กรองได้ด้วย **Status** แล้วกด **Show** คลิกรายการใดก็ได้เพื่อดูข้อความฉบับเต็ม ข้อผิดพลาด (ถ้ามี) และสิ่งที่ที่อยู่ปลายทางตอบกลับมา

| สถานะ | ความหมาย |
| --- | --- |
| **Sending** | รอการลองครั้งแรก |
| **Retrying** | การลองครั้งหนึ่งล้มเหลวและกำลังจะลองอีกครั้ง บรรทัดนี้แสดงเวลาหลังการลองครั้งถัดไป |
| **Delivered** | ที่อยู่ตอบกลับด้วยสถานะ 2xx ซึ่งเป็นรหัสของเว็บที่หมายถึงสำเร็จ |
| **Failed** | ทุกครั้งที่ลองล้มเหลว หรือไม่สามารถส่งได้เลย |

แต่ละครั้งรอคำตอบนานสุด 15 วินาที หากคำตอบไม่ใช่ 2xx Briks จะลองใหม่ รวมห้าครั้ง ครั้งแรกทันที จากนั้นหลังประมาณ 30 วินาที, 2 นาที, 8 นาที และ 32 นาที รวมตั้งแต่ครั้งแรกถึงครั้งสุดท้ายประมาณ 45 นาที คำตอบ 410 (gone) จะหยุดการลองใหม่ทันที ระบบไม่ตามการเปลี่ยนเส้นทาง ดังนั้นโปรดระบุที่อยู่ปลายทางจริง

เมื่อการส่งมีสถานะ **Failed** หรือ **Delivered** ปุ่ม **Send again** จะส่งข้อความเดิมด้วยรหัสเดิม โดยเซ็นลายเซ็นใหม่ ต้องเปิดใช้งานเว็บฮุกไว้

## ข้อมูลเชิงลึกและการตั้งค่า

**Insights** สรุปข้อมูล 30 วันล่าสุด ได้แก่ **Deliveries** สัดส่วน **Delivered** **Failed after every try** (พร้อมจำนวนครั้งที่ลองซ้ำ) และเวลา **Average answer** ด้านล่าง **By event** และ **By address** แสดงว่าความล้มเหลวกระจุกอยู่ตรงไหน

**Settings** มี **Download JSON** ใต้ **Download the webhooks** ซึ่งรวมที่อยู่ เหตุการณ์ และบันทึกของทุกเว็บฮุก รหัสลับสำหรับลงลายเซ็นจะไม่รวมอยู่ด้วยเลย โซนอันตรายมี **Clear log** ซึ่งลบบันทึกการส่งและหยุดการลองใหม่ทั้งหมด และ **Delete all** ซึ่งลบเว็บฮุกทั้งหมดหลังจากคุณพิมพ์ชื่อโปรเจกต์ ทั้งสองอย่างสำหรับ Owner และ Admin

## ตัวอย่างการใช้งาน: ส่งข้อมูลจากฟอร์มไปยังเครื่องมืออื่น

ไม่สามารถส่งออกรายการจากแบบฟอร์มจากสตูดิโอได้ ดังนั้นเว็บฮุกจึงเป็นวิธีเก็บรายการไว้ในเครื่องมืออื่นทันทีที่เข้ามา สตูดิโอก็เก็บไว้เช่นกัน โดย 100 รายการล่าสุดจะแสดงใน **Settings**, **Forms**

ช่างภาพงานแต่งงานในยอร์กส่งอีเมลตอบคำถามไปยังรายชื่อลูกค้าของเธอ

1. รับที่อยู่จากเครื่องมืออื่น

   ที่ไหน: Her client list tool

   เธอสร้าง incoming webhook ที่นั่น แล้วคัดลอกที่อยู่ที่ได้มา

2. เพิ่ม webhook

   ที่ไหน: Settings, Webhooks

   เธอวางที่อยู่ เขียนบันทึกว่า `รายชื่อลูกค้า` เอาเครื่องหมายถูกออกจาก **Published** และเหลือเครื่องหมายถูกไว้เฉพาะ **Form received**

3. ให้ความลับแก่เครื่องมือ

   ที่ไหน: Her client list tool

   เครื่องมือของเธอตรวจสอบลายเซ็น เธอจึงวางความลับสำหรับลงนามในการตั้งค่าของเครื่องมือก่อนปิดกล่องโต้ตอบ

4. ทดลองใช้

   ที่ไหน: Settings, Webhooks, Deliveries

   เธอส่งอีเวนต์ทดสอบและเห็นว่าเป็น **Delivered** ใต้ **Deliveries**

5. จับคู่ฟิลด์

   ที่ไหน: Her client list tool

   เธอจับคู่ป้ายชื่อใน `fields` ได้แก่ ชื่อ วันแต่งงาน และสถานที่จัดงาน กับคอลัมน์ในเครื่องมือของเธอ และสั่งให้ข้ามข้อความที่ `production` เป็น `false`

คำถามถัดไป

> คู่รักคู่หนึ่งกรอกแบบฟอร์มติดต่อบนเว็บไซต์ของเธอ

คำสอบถามจะเข้าอีเมลของเธอ เพราะเว็บไซต์อยู่ในเวอร์ชันใช้งานจริง และปรากฏในรายชื่อลูกค้าของเธอหลังจากนั้นไม่นาน

## อ่านต่อ

- [ฟีเจอร์ของเว็บไซต์คุณ **ฟอร์ม** เพิ่มแบบฟอร์มในเว็บไซต์ Briks ทดสอบในพรีวิว ดูทุกรายการในสตูดิโอ รับอีเมลทุกรายการในเวอร์ชันใช้งานจริง และส่งต่อด้วย webhook](https://briks.dev/th/docs/forms)
- [ข้อมูลและระบบอัตโนมัติ**งานตามกำหนดเวลา** งานตามกำหนดเวลาบนเว็บไซต์ เช่น สรุปตอนเช้าหรือจัดระเบียบรายสัปดาห์ เขียนตารางเวลา ดูผลแต่ละรอบ แก้รอบที่ล้มเหลว และดูขีดจำกัดของแผน](https://briks.dev/th/docs/crons)
- [ข้อมูลและระบบอัตโนมัติ**ฐานข้อมูล** ดูว่าเว็บไซต์เก็บข้อมูลอะไร แก้ไขและเพิ่มเรคคอร์ดเอง ดาวน์โหลดคอลเลกชันเป็น JSON หรือ CSV พร้อมสิทธิ์ของแต่ละคนและข้อจำกัด](https://briks.dev/th/docs/database)
- [ข้อมูลและระบบอัตโนมัติ**บันทึก** อ่านบันทึกการสร้างและคำขอของเว็บไซต์ในรอบวันล่าสุด กรองตามระดับหรือสถานะ และหาสาเหตุของแบบฟอร์ม งาน หรือหน้าเว็บที่ช้าหรือทำงานล้มเหลว](https://briks.dev/th/docs/logs)

ยังติดปัญหาอยู่ไหม

เขียนถึง [hello@briks.dev](mailto:hello@briks.dev) พร้อมชื่อโปรเจกต์และสิ่งที่คุณคาดว่าจะเห็น ภาพหน้าจอช่วยได้