README.md

การตั้งค่าไคลเอนต์โฮสต์ MCP ยอดนิยม

คำแนะนำนี้ครอบคลุมวิธีการกำหนดค่าและใช้งานเซิร์ฟเวอร์ MCP กับแอปโฮสต์ AI ยอดนิยมแต่ละโฮสต์มีวิธีการกำหนดค่าของตัวเอง แต่เมื่อกำหนดค่าเรียบร้อยแล้ว พวกเขาทั้งหมดจะสื่อสารกับเซิร์ฟเวอร์ MCP โดยใช้โปรโตคอลมาตรฐาน

โฮสต์ MCP คืออะไร?

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

flowchart LR
    User[👤 ผู้ใช้] --> Host[🖥️ โฮสต์ MCP]
    Host --> S1[MCP เซิร์ฟเวอร์ A]
    Host --> S2[MCP เซิร์ฟเวอร์ B]
    Host --> S3[MCP เซิร์ฟเวอร์ C]
    
    subgraph "โฮสต์ยอดนิยม"
        H1[Claude เดสก์ท็อป]
        H2[VS Code]
        H3[Cursor]
        H4[Cline]
        H5[Windsurf]
    end

Loading

ข้อกำหนดเบื้องต้น

• มีเซิร์ฟเวอร์ MCP สำหรับเชื่อมต่อ (ดูที่ Module 3.1 - First Server)
• ติดตั้งแอปโฮสต์บนระบบของคุณแล้ว
• คุ้นเคยพื้นฐานกับไฟล์กำหนดค่า JSON

---

1. Claude Desktop

Claude Desktop คือแอปเดสก์ท็อปอย่างเป็นทางการของ Anthropic ที่รองรับ MCP โดยตรง

การติดตั้ง

1. ดาวน์โหลด Claude Desktop จาก claude.ai/download
2. ติดตั้งและเข้าสู่ระบบด้วยบัญชี Anthropic ของคุณ

การกำหนดค่า

Claude Desktop ใช้ไฟล์กำหนดค่า JSON เพื่อกำหนดเซิร์ฟเวอร์ MCP

ตำแหน่งไฟล์กำหนดค่า:

• macOS: ~/Library/Application Support/Claude/claude_desktop_config.json
• Windows: %APPDATA%\Claude\claude_desktop_config.json
• Linux: ~/.config/Claude/claude_desktop_config.json

ตัวอย่างการกำหนดค่า:

{
  "mcpServers": {
    "calculator": {
      "command": "python",
      "args": ["-m", "mcp_calculator_server"],
      "env": {
        "PYTHONPATH": "/path/to/your/server"
      }
    },
    "weather": {
      "command": "node",
      "args": ["/path/to/weather-server/build/index.js"]
    },
    "database": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-postgres"],
      "env": {
        "DATABASE_URL": "postgresql://user:pass@localhost/mydb"
      }
    }
  }
}

ตัวเลือกการกำหนดค่า

ฟิลด์	คำอธิบาย	ตัวอย่าง
command	โปรแกรมที่ต้องรัน	"python", "node", "npx"
args	อาร์กิวเมนต์บรรทัดคำสั่ง	["-m", "my_server"]
env	ตัวแปรสภาพแวดล้อม	{"API_KEY": "xxx"}
cwd	โฟลเดอร์ทำงาน	"/path/to/server"

การทดสอบการตั้งค่าของคุณ

1. บันทึกไฟล์กำหนดค่า
2. รีสตาร์ท Claude Desktop ให้ครบถ้วน (ออกจากโปรแกรมแล้วเปิดใหม่)
3. เปิดการสนทนาใหม่
4. มองหาไอคอน 🔌 ที่ระบุว่าเชื่อมต่อเซิร์ฟเวอร์แล้ว
5. ลองถาม Claude ให้ใช้เครื่องมือของคุณ

การแก้ไขปัญหา Claude Desktop

เซิร์ฟเวอร์ไม่แสดง:

• ตรวจสอบไวยากรณ์ไฟล์กำหนดค่าด้วยตัวตรวจ JSON
• ตรวจสอบให้แน่ใจว่าเส้นทางคำสั่งถูกต้อง
• ตรวจสอบบันทึก Claude Desktop: Help → Show Logs

เซิร์ฟเวอร์ล้มเหลวเมื่อเริ่มต้น:

• ทดสอบเซิร์ฟเวอร์ด้วยตัวเองผ่านเทอร์มินัลก่อน
• ตรวจสอบว่าตัวแปรสภาพแวดล้อมตั้งค่าอย่างถูกต้อง
• ตรวจสอบว่าติดตั้ง dependencies ครบถ้วน

---

2. VS Code กับ GitHub Copilot

VS Code รองรับ MCP ผ่านส่วนขยาย GitHub Copilot Chat

ข้อกำหนดเบื้องต้น

1. ติดตั้ง VS Code เวอร์ชัน 1.99 ขึ้นไป
2. ติดตั้งส่วนขยาย GitHub Copilot
3. ติดตั้งส่วนขยาย GitHub Copilot Chat

การกำหนดค่า

VS Code ใช้ไฟล์ .vscode/mcp.json ใน workspace หรือการตั้งค่าผู้ใช้

การกำหนดค่า workspace (.vscode/mcp.json):

{
  "servers": {
    "my-calculator": {
      "type": "stdio",
      "command": "python",
      "args": ["-m", "mcp_calculator_server"]
    },
    "my-database": {
      "type": "sse",
      "url": "http://localhost:8080/sse"
    }
  }
}

การตั้งค่าผู้ใช้ (settings.json):

{
  "mcp.servers": {
    "global-server": {
      "type": "stdio",
      "command": "npx",
      "args": ["-y", "@anthropic/mcp-server-memory"]
    }
  },
  "mcp.enableLogging": true
}

การใช้ MCP ใน VS Code

1. เปิดแผง Copilot Chat (Ctrl+Shift+I / Cmd+Shift+I)
2. พิมพ์ @ เพื่อดูเครื่องมือ MCP ที่มี
3. ใช้ภาษาธรรมชาติเพื่อเรียกใช้งานเครื่องมือ: "Calculate 25 * 48 using the calculator"

การแก้ไขปัญหา VS Code

เซิร์ฟเวอร์ MCP ไม่โหลด:

• ตรวจสอบแผงผลลัพธ์ → "MCP" สำหรับบันทึกข้อผิดพลาด
• โหลดหน้าต่างใหม่: Ctrl+Shift+P → "Developer: Reload Window"
• ตรวจสอบให้แน่ใจว่าเซิร์ฟเวอร์รันได้เองก่อน

---

3. Cursor

Cursor คือโปรแกรมแก้ไขโค้ดที่เน้น AI โดยมี MCP ในตัว

การติดตั้ง

1. ดาวน์โหลด Cursor จาก cursor.sh
2. ติดตั้งและลงชื่อเข้าใช้

การกำหนดค่า

Cursor ใช้รูปแบบกำหนดค่าคล้าย Claude Desktop

ตำแหน่งไฟล์กำหนดค่า:

• macOS: ~/.cursor/mcp.json
• Windows: %USERPROFILE%\.cursor\mcp.json
• Linux: ~/.cursor/mcp.json

ตัวอย่างการกำหนดค่า:

{
  "mcpServers": {
    "filesystem": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-filesystem", "/path/to/allowed/directory"]
    },
    "github": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-github"],
      "env": {
        "GITHUB_TOKEN": "ghp_your_token_here"
      }
    }
  }
}

การใช้ MCP ใน Cursor

1. เปิดแชท AI ของ Cursor (Ctrl+L / Cmd+L)
2. เครื่องมือ MCP จะปรากฏในคำแนะนำโดยอัตโนมัติ
3. ขอให้ AI ทำงานโดยใช้เซิร์ฟเวอร์ที่เชื่อมต่อ

---

4. Cline (แบบใช้เทอร์มินัล)

Cline เป็นไคลเอนต์ MCP แบบใช้เทอร์มินัล เหมาะสำหรับการทำงานสายคำสั่ง

การติดตั้ง

npm install -g @anthropic/cline

การกำหนดค่า

Cline ใช้ตัวแปรสภาพแวดล้อมและอาร์กิวเมนต์บรรทัดคำสั่ง

ใช้ตัวแปรสภาพแวดล้อม:

export ANTHROPIC_API_KEY="your-api-key"
export MCP_SERVER_CALCULATOR="python -m mcp_calculator_server"

ใช้บรรทัดคำสั่งอาร์กิวเมนต์:

cline --mcp-server "calculator:python -m mcp_calculator_server" \
      --mcp-server "weather:node /path/to/weather/index.js"

ไฟล์กำหนดค่า (~/.clinerc):

{
  "apiKey": "your-api-key",
  "mcpServers": {
    "calculator": {
      "command": "python",
      "args": ["-m", "mcp_calculator_server"]
    }
  }
}

การใช้ Cline

# เริ่มต้นเซสชันแบบโต้ตอบ
cline

# คำถามเดียวพร้อม MCP
cline "Calculate the square root of 144 using the calculator"

# แสดงรายการเครื่องมือที่มีอยู่
cline --list-tools

---

5. Windsurf

Windsurf เป็นโปรแกรมแก้ไขโค้ดที่ขับเคลื่อนด้วย AI อีกตัวหนึ่งที่รองรับ MCP

การติดตั้ง

1. ดาวน์โหลด Windsurf จาก codeium.com/windsurf
2. ติดตั้งและสร้างบัญชี

การกำหนดค่า

การกำหนดค่าของ Windsurf จัดการผ่าน UI การตั้งค่า:

1. เปิด Settings (Ctrl+, / Cmd+,)
2. ค้นหา "MCP"
3. คลิก "Edit in settings.json"

ตัวอย่างการกำหนดค่า:

{
  "windsurf.mcp.servers": {
    "my-tools": {
      "command": "python",
      "args": ["/path/to/server.py"],
      "env": {}
    }
  },
  "windsurf.mcp.enabled": true
}

---

การเปรียบเทียบประเภทการขนส่ง

โฮสต์แต่ละตัวรองรับวิธีการขนส่งแตกต่างกัน:

โฮสต์	stdio	SSE/HTTP	WebSocket
Claude Desktop	✅	❌	❌
VS Code	✅	✅	❌
Cursor	✅	✅	❌
Cline	✅	✅	❌
Windsurf	✅	✅	❌

stdio (standard input/output): เหมาะสำหรับเซิร์ฟเวอร์ในเครื่องที่โฮสต์สตาร์ทเอง
SSE/HTTP: เหมาะสำหรับเซิร์ฟเวอร์ระยะไกลหรือเซิร์ฟเวอร์ที่แชร์ระหว่างไคลเอนต์หลายตัว

---

การแก้ไขปัญหาทั่วไป

เซิร์ฟเวอร์ไม่เริ่มทำงาน

1. ทดสอบเซิร์ฟเวอร์ด้วยตนเองก่อน:

   # สำหรับ Python
   python -m your_server_module
   
   # สำหรับ Node.js
   node /path/to/server/index.js

2. ตรวจสอบเส้นทางคำสั่ง:

   • ใช้เส้นทางแบบสมบูรณ์เมื่อเป็นไปได้
   • ตรวจสอบว่าโปรแกรม executable อยู่ใน PATH

3. ตรวจสอบ dependencies:

   # ไพธอน
   pip list | grep mcp
   
   # Node.js
   npm list @modelcontextprotocol/sdk

เซิร์ฟเวอร์เชื่อมต่อได้แต่เครื่องมือไม่ทำงาน

1. ตรวจสอบบันทึกเซิร์ฟเวอร์ - โฮสต์ส่วนใหญ่มีตัวเลือกบันทึก
2. ตรวจสอบการลงทะเบียนเครื่องมือ - ใช้ MCP Inspector ทดสอบ
3. ตรวจสอบสิทธิ์ - เครื่องมือบางตัวต้องการสิทธิ์เข้าถึงไฟล์/เครือข่าย

ตัวแปรสภาพแวดล้อมไม่ถูกส่งผ่าน

• โฮสต์บางตัวกรองตัวแปรสภาพแวดล้อม
• ใช้ฟิลด์ env ในการกำหนดค่าโดยตรง
• หลีกเลี่ยงข้อมูลสำคัญในไฟล์กำหนดค่า (ใช้การจัดการความลับ)

---

แนวปฏิบัติด้านความปลอดภัยที่ดีที่สุด

1. ไม่เคยคอมมิตคีย์ API ลงในไฟล์กำหนดค่า
2. ใช้ตัวแปรสภาพแวดล้อม สำหรับข้อมูลสำคัญ
3. จำกัดสิทธิ์เซิร์ฟเวอร์ ให้เฉพาะที่จำเป็นเท่านั้น
4. ตรวจสอบโค้ดเซิร์ฟเวอร์ ก่อนให้สิทธิ์เข้าถึงระบบของคุณ
5. ใช้รายการอนุญาต สำหรับการเข้าถึงระบบไฟล์และเครือข่าย

---

ขั้นตอนถัดไป

• 3.13 - Debugging with MCP Inspector
• 3.1 - สร้างเซิร์ฟเวอร์ MCP แรกของคุณ
• Module 5 - หัวข้อขั้นสูง

---

แหล่งข้อมูลเพิ่มเติม

• เอกสาร MCP ของ Claude Desktop
• ส่วนขยาย MCP บน VS Code
• ข้อกำหนด MCP - การขนส่ง
• ทะเบียนเซิร์ฟเวอร์ MCP อย่างเป็นทางการ

---

ข้อจำกัดความรับผิดชอบ: เอกสารนี้ได้รับการแปลโดยใช้บริการแปลภาษา AI Co-op Translator แม้เราจะพยายามให้ความถูกต้องสูงสุด แต่โปรดทราบว่าการแปลอัตโนมัติอาจมีข้อผิดพลาดหรือความไม่ถูกต้อง เอกสารต้นฉบับในภาษาดั้งเดิมควรถือเป็นแหล่งข้อมูลที่เชื่อถือได้ สำหรับข้อมูลสำคัญ แนะนำให้ใช้การแปลโดยมืออาชีพที่เป็นมนุษย์ เราไม่รับผิดชอบต่อความเข้าใจผิดหรือการตีความที่ผิดพลาดอันเกิดจากการใช้การแปลนี้