kogiQA MCP Web Browser

kogiQA MCP Web Browser

เซิร์ฟเวอร์ Model Context Protocol (MCP) ที่ให้ความสามารถในการทำงานอัตโนมัติของเบราว์เซอร์โดยใช้ kogiQA เซิร์ฟเวอร์นี้ช่วยให้ LLM สามารถโต้ตอบกับหน้าเว็บผ่านภาษาธรรมชาติ โดยไม่จำเป็นต้องใช้ภาพหน้าจอหรือโมเดลที่ปรับแต่งด้วยภาพ

ใช้สำหรับ:

• แก้ไขปัญหาด้านสไตล์ (style) บนหน้าของคุณ
• แก้ไขข้อผิดพลาดในคอนโซลโดยอัตโนมัติ
• จัดทำแผนที่และบันทึกฟังก์ชันการทำงานของเว็บแอปของคุณ
• เขียนเทสต์แบบ end-to-end โดยอัตโนมัติ
• ทำให้การทดสอบเชิงสำรวจแอปพลิเคชันของคุณเป็นอัตโนมัติ

ดูตัวอย่างพรอมต์ Usage Examples

kogiQA MCP เทียบกับ Playwright MCP

kogiQA MCP Server มีเบราว์เซอร์ที่รวมความสามารถของอัลกอริทึมควบคุมเบราว์เซอร์ kogiQA ซึ่งช่วยให้เอเจนต์โต้ตอบกับหน้าเว็บได้โดยไม่ต้องใช้ตัวเลือก (selector) ประหยัดเวลาและโทเค็น

การติดตั้ง

ติดตั้งอัตโนมัติ:

npx kogiqa-mcp@latest

Claude Code

claude mcp add kogiqa-browser npx kogiqa-mcp@latest

VS Code

คลิกปุ่มใดปุ่มหนึ่งด้านล่างเพื่อติดตั้งโดยตรงใน VS Code:

หรือติดตั้งผ่าน VS Code CLI:

code --add-mcp '{"name":"kogiqa-browser","command":"npx","args":["kogiqa-mcp@latest"]}'

Cursor

หรือไปที่ Cursor Settings → MCP → Add new MCP Server แล้วป้อนคำสั่ง npx kogiqa-mcp@latest

การกำหนดค่ามาตรฐาน

สำหรับ MCP ไคลเอนต์อื่น ๆ ให้เพิ่มข้อมูลต่อไปนี้ในการกำหนดค่า MCP ของคุณ:

{
  "mcpServers": {
    "kogiqa-browser": {
      "command": "npx",
      "args": [
        "kogiqa-mcp@latest"
      ]
    }
  }
}

ตัวอย่างการใช้งาน

เมื่อกำหนดค่าเซิร์ฟเวอร์แล้ว เพียงแค่พูดคุยกับเอเจนต์ของคุณด้วยภาษาธรรมชาติ เนื่องจาก kogiQA ไม่ต้องใช้ตัวเลือก (selector) คุณเพียงอธิบายสิ่งที่ต้องการให้ทำ — ไม่ใช่วิธีค้นหาองค์ประกอบ

ทดสอบแบบ smoke-test สำหรับขั้นตอนผู้ใช้

Open http://localhost:3000, log in with the demo credentials, add the first product to the cart, and verify that the cart badge shows "1".

แก้ไขปัญหาด้านสไตล์

Go to https://myapp.example.com/pricing and check why the "Pro" plan card overflows its container on a 1280px-wide viewport. Suggest a CSS fix.

แก้ไขข้อผิดพลาดในคอนโซล

Navigate to http://localhost:5173, open every page linked from the main menu, collect all console errors, and fix them in the source code.

จัดทำแผนที่และบันทึกแอปของคุณ

Explore https://staging.example.com, follow all internal links up to two levels deep, and produce a Markdown document describing each page and its main features.

สร้างเทสต์แบบ end-to-end

Walk through the sign-up flow at http://localhost:3000/signup and write Cypress end-to-end tests covering the happy path and validation errors.

การทดสอบเชิงสำรวจ

Do 10 minutes of exploratory testing on http://localhost:8080: try edge-case inputs in every form you find and report anything that looks broken or inconsistent.

ข้อกำหนด

• Node.js เวอร์ชัน 20 หรือใหม่กว่า
• VS Code, Cursor, Windsurf, Claude Desktop, Goose, Junie หรือ MCP ไคลเอนต์อื่น ๆ