WebMCP

Alexandra Klepper
Alexandra Klepper

Published: May 18, 2026

WebMCP เป็น มาตรฐานเว็บที่เสนอขึ้นเพื่อช่วยคุณสร้างและแสดงเครื่องมือที่มีโครงสร้างสำหรับ AI Agent WebMCP มี JavaScript และใส่คำอธิบายประกอบให้กับองค์ประกอบแบบฟอร์ม HTML เพื่อให้ Agent ทราบวิธีโต้ตอบกับฟีเจอร์ของหน้าเว็บอย่างถูกต้องเพื่อรองรับประสบการณ์ของผู้ใช้ ซึ่งจะช่วยปรับปรุงประสิทธิภาพและความน่าเชื่อถือของการทำงานของ Agent ได้อย่างมาก

AI Agent เป็นเทคโนโลยีใหม่ ซึ่งช่วยให้ผู้ใช้ที่เป็นมนุษย์ทำงานที่ซับซ้อนและต้องใช้ความรู้ทางเทคนิคให้เสร็จสมบูรณ์ได้ดียิ่งขึ้น WebMCP มีความแม่นยำสูงกว่าในการทำงานที่เป็น Agent ให้เสร็จสมบูรณ์ และสามารถเพิ่มเป็นการเพิ่มประสิทธิภาพแบบต่อเนื่องได้

เหตุใดจึงควรเลือกใช้ WebMCP

WebMCP ช่วยลดช่องว่างระหว่างเว็บแอปพลิเคชันกับ Agent รวมถึงปรับปรุงประสิทธิภาพ ความน่าเชื่อถือ และการทำงานให้เสร็จสมบูรณ์ด้วยการกำหนดกฎสำหรับการโต้ตอบ แทนที่ Agent จะต้องตรวจสอบองค์ประกอบต่างๆ เช่น ปุ่มหรือช่อง เพื่อทำความเข้าใจวัตถุประสงค์ขององค์ประกอบนั้น เว็บไซต์จะประกาศวัตถุประสงค์ขององค์ประกอบเพื่อให้มีการใช้งานอย่างถูกต้อง

วิธีนี้มีความน่าเชื่อถือมากกว่าการทำงาน ซึ่งอาจมีหลายขั้นตอนและแต่ละขั้นตอนอาจตีความได้หลายแบบโดย Agent

เว็บไซต์สามารถแชร์วัตถุประสงค์ที่ชัดเจน เช่น การค้นหาหรือการซื้อ โดยการกำหนด tool เครื่องมือจะทำงานบนหน้าเว็บอย่างชัดเจนเพื่อให้ผู้ใช้มั่นใจว่างานจะเสร็จสมบูรณ์ตามที่คาดไว้ นอกจากนี้ยังช่วยให้แบรนด์และการออกแบบที่เน้นผู้ใช้เป็นศูนย์กลางของคุณยังคงอยู่

WebMCP รองรับสิ่งต่อไปนี้

  • การค้นพบ: วิธีมาตรฐานสำหรับหน้าเว็บในการลงทะเบียนเครื่องมือกับ Agent เช่น checkout หรือ filter_results
  • สคีมา JSON: คำจำกัดความที่ชัดเจนของอินพุตและเอาต์พุตที่คาดไว้ เพื่อลดการหลอนหรือความเข้าใจผิด
  • สถานะ: ความเข้าใจร่วมกันเกี่ยวกับบริบทของหน้าเว็บปัจจุบัน เพื่อให้ Agent ทราบว่ามีทรัพยากรใดบ้างที่พร้อมใช้งานเพื่อดำเนินการแบบเรียลไทม์

เป้าหมายของเราคือการสร้าง API ที่เบราว์เซอร์ใดก็ตามที่มีความสามารถด้าน Agentic AI สามารถนำไปใช้และได้รับประโยชน์ เพื่อให้ผู้ใช้ทำงานให้เสร็จสมบูรณ์ได้ง่ายขึ้น คุณ สามารถติดตามกระบวนการนี้ได้บน GitHub

กรณีการใช้งาน

คุณสามารถใช้ WebMCP บนเว็บได้หลายวิธี เช่น

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

การกระทำบางอย่างอาจมีความละเอียดอ่อน เช่น การซื้อ คุณสามารถใส่คำสั่งเพื่อขอให้ผู้ใช้โต้ตอบกับกล่องโต้ตอบการยืนยัน

ในทางปฏิบัติ เครื่องมือของคุณสามารถทำงานต่อไปนี้ให้เสร็จสมบูรณ์ได้

  • กรอกแบบฟอร์มที่มีโครงสร้าง: สร้างเครื่องมือ submit_application เพื่อช่วยให้ Agent จับคู่ข้อมูลที่รวบรวมจากการสนทนากับผู้ใช้กับช่องแบบฟอร์มได้อย่างถูกต้อง เช่น คุณสามารถแยกความแตกต่างได้ว่าช่องใดต้องใช้ชื่อเต็มและช่องใดต้องใช้ชื่อและนามสกุลแยกกัน
  • รองรับการโต้ตอบของ Agent ในอินเทอร์เฟซที่เน้นผู้ใช้เป็นอันดับแรก: ช่องบางช่อง ออกแบบมาสำหรับผู้ใช้ที่เป็นมนุษย์ แต่ Agent อาจไม่เข้าใจ คุณสามารถสร้างเครื่องมือ date_pick ที่อนุญาตให้เลือกวันที่และเวลาที่ซับซ้อนในการจองที่พักหรือการจองกิจกรรม
  • การแก้ไขข้อบกพร่องของแอปพลิเคชันได้เร็วขึ้น: คุณสามารถสร้างเครื่องมือ run_diagnostics ในหน้าการตั้งค่าสำหรับนักพัฒนาซอฟต์แวร์ เพื่อให้ Agent สามารถทริกเกอร์การแก้ไขที่ซ่อนอยู่เบื้องหลังเมนูที่ซ้อนกัน

กรณีการใช้งานของคุณไม่อยู่ในรายการใช่ไหม หรือคุณมีไอเดียที่อยากแชร์เกี่ยวกับ WebMCP ใช่ไหม เข้าร่วมโปรแกรมทดลองใช้ก่อนเปิดตัว และแชร์ความคิดเห็นของคุณ

เริ่มต้นใช้งาน

WebMCP พร้อมใช้งานเป็น Chrome Flag สำหรับการพัฒนาในเครื่อง และจะพร้อมใช้งาน ในช่วงทดลองใช้จากต้นทางใน Chrome 149

วิธีเปิดใช้ WebMCP ในเครื่อง

  1. เปิด Chrome แล้วไปที่ chrome://flags/#enable-webmcp-testing
  2. ตั้งค่าแฟล็กเป็นเปิดใช้
  3. รีสตาร์ท Chrome เพื่อใช้การเปลี่ยนแปลง

ใช้ WebMCP API

คุณสามารถใช้ API 2 รายการต่อไปนี้เพื่อตั้งค่าเครื่องมือเว็บไซต์

  • Imperative API: กำหนดเครื่องมือประเภทต่างๆ ด้วย JavaScript มาตรฐาน เช่น อินพุตแบบฟอร์ม เครื่องมือนำทาง การจัดการสถานะ หรือฟังก์ชันอื่นๆ
  • Declarative API: เพิ่มคำอธิบายประกอบลงในแบบฟอร์ม HTML มาตรฐาน เพื่อสร้างเครื่องมือ WebMCP

ข้อจำกัด

แม้ว่า WebMCP จะมีเป้าหมายเพื่อทำให้งานที่ซับซ้อนง่ายขึ้นสำหรับ Agent และผู้ใช้ที่เป็นมนุษย์ แต่ก็มีข้อจำกัดบางประการดังนี้

  • ต้องมีบริบทการท่องเว็บ: เนื่องจากระบบจะจัดการการเรียกเครื่องมือใน JavaScript จึงต้องเปิดแท็บเบราว์เซอร์หรือ WebView เพื่อแสดงอินเทอร์เฟซและ บริบทของเบราว์เซอร์ กล่าวคือ ไม่มีการรองรับ Agent หรือเครื่องมือช่วยเหลือในการเรียกเครื่องมือในสถานะที่ไม่มีส่วนหัว
  • มีค่าใช้จ่ายเพิ่มเติมสำหรับอินเทอร์เฟซที่ซับซ้อน: หากเว็บไซต์ของคุณซับซ้อนมาก คุณอาจต้องรีแฟกเตอร์หรือเพิ่ม JavaScript เพื่อจัดการสถานะของแอปพลิเคชันและอินเทอร์เฟซ
  • การค้นพบเครื่องมือ: ไคลเอ็นต์และเบราว์เซอร์ต้องเข้าชมเว็บไซต์โดยตรงเพื่อดูว่าเว็บไซต์มีเครื่องมือที่เรียกใช้ได้หรือไม่

นโยบายสิทธิ์

API ทั้ง 2 รายการได้รับการควบคุมโดย tools นโยบายสิทธิ์ นโยบายนี้มีค่าเริ่มต้นเป็น self ซึ่งอนุญาตให้ลงทะเบียนเครื่องมือในบริบทระดับบนสุดและบริบทที่มีต้นทางเดียวกัน และปิดใช้สำหรับ iframe แบบข้ามต้นทาง

หากต้องการอนุญาตเครื่องมือ WebMCP ใน iframe แบบข้ามต้นทาง ให้เพิ่มแอตทริบิวต์ allow="tools" ลงใน iframe

สาธิต

ตัวอย่างการสาธิตที่ครอบคลุมทั้งการติดตั้งใช้งานแบบ Imperative และ Declarative มีดังนี้

นอกจากนี้ คุณยังดูและสำรวจซอร์สโค้ดของการสาธิตได้บน GitHub

เลียนแบบการแชทของ Agent ด้วยส่วนขยาย Inspector

ติดตั้งส่วนขยาย Model Context Tool Inspector เพื่อทดลองใช้ Agent และดูว่าเครื่องมือ WebMCP ทำงานอย่างไรในการสาธิตแบบสดหรือใน แอปพลิเคชันของคุณเอง ใช้พรอมต์ภาษาธรรมชาติเพื่อดูว่า Agent โต้ตอบกับเครื่องมือ WebMCP ตามที่คาดไว้หรือไม่

ส่วนขยายนี้ช่วยให้คุณทำสิ่งต่อไปนี้ได้

  • ดูว่ามีการลงทะเบียนเครื่องมือใดบ้างในหน้าเว็บโดยการตรวจสอบ API navigator.modelContext
  • เรียกเครื่องมือและเรียกใช้ฟังก์ชันด้วยตนเอง
  • ตรวจสอบว่าสคีมา JSON ได้รับการกำหนดอย่างถูกต้องและเบราว์เซอร์สามารถแยกวิเคราะห์ข้อมูลตามที่เครื่องมือคาดไว้
  • ดูเอาต์พุตที่มีโครงสร้างหรือข้อความแสดงข้อผิดพลาดที่เครื่องมือส่งคืนเพื่อให้แน่ใจว่าเขียนอย่างชัดเจนและจัดรูปแบบอย่างถูกต้อง เพื่อให้ Agent เข้าใจได้

พูดคุยกับ Agent โดยใช้ภาษาธรรมชาติเพื่อดูว่า Agent สามารถระบุและเรียกใช้เครื่องมือ WebMCP ที่เหมาะสมได้อย่างถูกต้องหรือไม่ ระบบจะส่งพรอมต์ของคุณไปยังโมเดล gemini-3-flash-preview โดยค่าเริ่มต้น

มีส่วนร่วมและแชร์ความคิดเห็น

WebMCP อยู่ระหว่างการพูดคุยอย่างจริงจังและอาจมีการเปลี่ยนแปลงในอนาคต หากคุณลองใช้ API เหล่านี้แล้วมีความคิดเห็น โปรดแจ้งให้เราทราบ