Tidio
ทางการเชื่อมต่อ Tidio กับเว็บไซต์ของคุณผ่าน MCP ฝังวิดเจ็ตโดยไม่ต้องออกจากสภาพแวดล้อมการเขียนโปรแกรมของคุณ
คุณทำอะไรได้บ้างด้วย Tidio MCP?
- เชื่อมต่อ Tidio กับเว็บไซต์ — ขอให้เชื่อมต่อ Tidio กับ URL ของเว็บไซต์ผ่าน
tidio_connectซึ่งจะเปิดเบราว์เซอร์สำหรับการเข้าสู่ระบบ OAuth และดึงคีย์สาธารณะของคุณกลับมาโดยอัตโนมัติ - ตรวจสอบสถานะการเชื่อมต่อ — ใช้เพื่อยืนยันว่า Tidio เชื่อมต่ออยู่หรือไม่ และดึงโค้ดฝังตัวปัจจุบันของคุณกลับมา
- สร้างโค้ดฝังตัว — เรียกใช้ด้วยคีย์สาธารณะเพื่อสร้าง JavaScript ที่พร้อมใช้งาน โดยสามารถเลือกโหลดแบบ
asyncหรือsyncได้ - ยกเลิกการเชื่อมต่อ Tidio — เรียกใช้เพื่อลบข้อมูลประจำตัวที่จัดเก็บไว้ในเครื่องจาก
~/.tidio-mcp/credentials.json
เอกสาร
ตัวเชื่อมต่อ MCP ของ Tidio
เซิร์ฟเวอร์ MCP (Model Context Protocol) ที่เชื่อมต่อผู้ช่วย AI เข้ากับแชทสดของ Tidio - พร้อมการตั้งค่าอัตโนมัติ
คุณสมบัติ
- การตั้งค่าอัตโนมัติ: เชื่อมต่อกับ Tidio ด้วยคำสั่งเดียว - ไม่ต้องคัดลอกคีย์ด้วยตนเอง
- การยืนยันตัวตน OAuth: เปิดเบราว์เซอร์เพื่อเข้าสู่ระบบ Tidio อย่างปลอดภัย และดึงคีย์สาธารณะของคุณโดยอัตโนมัติ
- การจัดเก็บข้อมูลประจำตัว: ข้อมูลประจำตัวจะถูกบันทึกในเครื่องสำหรับเซสชันถัดไป
- การสร้างโค้ดฝังตัว: รับโค้ด JavaScript ที่พร้อมใช้งานสำหรับเว็บไซต์ใดก็ได้
การติดตั้ง
npm install tidio-mcp-connector
หรือโคลนและสร้างในเครื่อง:
git clone https://github.com/your-username/tidio-mcp-connector.git
cd tidio-mcp-connector
npm install
npm run build
การใช้งาน
กับ Claude Desktop
เพิ่มในไฟล์คอนฟิกของ Claude Desktop (~/Library/Application Support/Claude/claude_desktop_config.json):
{
"mcpServers": {
"tidio": {
"command": "npx",
"args": ["tidio-mcp-connector"]
}
}
}
กับ Lovable
ตัวเชื่อมต่อ MCP นี้ทำงานร่วมกับ Lovable และแพลตฟอร์มพัฒนาที่ขับเคลื่อนด้วย AI ที่คล้ายกัน เพิ่มเป็นเซิร์ฟเวอร์ MCP แบบกำหนดเอง
กับ MCP Inspector (การทดสอบ)
npx @modelcontextprotocol/inspector npx tidio-mcp-connector
เครื่องมือที่มีให้
tidio_connect (แนะนำ)
เชื่อมต่อกับ Tidio และรับคีย์สาธารณะของคุณโดยอัตโนมัติ
วิธีการทำงาน:
- เปิดเบราว์เซอร์ของคุณไปยังหน้าเข้าสู่ระบบของ Tidio
- คุณยืนยันตัวตนด้วยบัญชี Tidio ของคุณ
- ส่งคืนคีย์สาธารณะและโค้ดฝังตัวของคุณโดยอัตโนมัติ
พารามิเตอร์:
site_url(จำเป็น): URL ของเว็บไซต์ที่จะฝัง Tidio
ตัวอย่าง:
Connect Tidio to https://mywebsite.com
tidio_status
ตรวจสอบสถานะการเชื่อมต่อของคุณและรับโค้ดฝังตัว
พารามิเตอร์: ไม่มี
tidio_disconnect
ล้างข้อมูลประจำตัวที่เก็บไว้
พารามิเตอร์: ไม่มี
generate_tidio_embed
สร้างโค้ดฝังตัวสำหรับคีย์สาธารณะเฉพาะ (ถ้าคุณมีอยู่แล้ว)
พารามิเตอร์:
public_key(จำเป็น): คีย์สาธารณะ Tidio ของคุณloading_mode(ไม่บังคับ):"async"(ค่าเริ่มต้น) หรือ"sync"
วิธีการทำงาน
- ผู้ใช้เรียก
tidio_connectพร้อม URL ของเว็บไซต์ - เบราว์เซอร์เปิด ไปยังหน้าสำหรับยืนยันตัวตนของ Tidio
- ผู้ใช้เข้าสู่ระบบ ด้วยบัญชี Tidio ของตน
- ได้รับ Callback - เซิร์ฟเวอร์ MCP รับ refresh token
- เรียก API - แลกเปลี่ยน token เป็น access token จากนั้นดึงคีย์สาธารณะ
- บันทึกข้อมูลประจำตัว ไปยัง
~/.tidio-mcp/credentials.json - ส่งคืนโค้ดฝังตัว - พร้อมที่จะเพิ่มลงในเว็บไซต์
การจัดเก็บข้อมูลประจำตัว
ข้อมูลประจำตัวถูกจัดเก็บในเครื่องที่ ~/.tidio-mcp/credentials.json:
{
"public_key": "abc123...",
"access_token": "...",
"refresh_token": "...",
"site_url": "https://example.com",
"created_at": "2024-01-01T00:00:00.000Z",
"updated_at": "2024-01-01T00:00:00.000Z"
}
ผลลัพธ์โค้ดฝังตัว
ตัวเชื่อมต่อสร้างโค้ดโหลดแบบ async ที่ปรับให้เหมาะสม:
<script type="text/javascript">
document.tidioChatCode = "YOUR_PUBLIC_KEY";
(function() {
function asyncLoad() {
var tidioScript = document.createElement("script");
tidioScript.type = "text/javascript";
tidioScript.async = true;
tidioScript.src = "//code.tidio.co/YOUR_PUBLIC_KEY.js";
document.body.appendChild(tidioScript);
}
if (window.attachEvent) {
window.attachEvent("onload", asyncLoad);
} else {
window.addEventListener("load", asyncLoad, false);
}
})();
</script>
การพัฒนา
# Install dependencies
npm install
# Run in development mode
npm run dev
# Build for production
npm run build
# Run built version
npm start