Menyiapkan Klien Host MCP Populer

Panduan ini membahas cara mengonfigurasi dan menggunakan server MCP dengan aplikasi host AI populer. Setiap host memiliki pendekatan konfigurasi sendiri, tetapi setelah diatur, semuanya berkomunikasi dengan server MCP menggunakan protokol standar.

Apa itu Host MCP?

Host MCP adalah aplikasi AI yang dapat terhubung ke server MCP untuk memperluas kemampuannya. Anggap saja sebagai "antarmuka depan" yang digunakan pengguna, sementara server MCP menyediakan alat dan data "antarmuka belakang".

flowchart LR
    User[👤 Pengguna] --> Host[🖥️ Host MCP]
    Host --> S1[Server MCP A]
    Host --> S2[Server MCP B]
    Host --> S3[Server MCP C]
    
    subgraph "Host Populer"
        H1[Claude Desktop]
        H2[VS Code]
        H3[Cursor]
        H4[Cline]
        H5[Windsurf]
    end

Prasyarat

Sebuah server MCP untuk dihubungkan (lihat Modul 3.1 - Server Pertama)
Aplikasi host terpasang di sistem Anda
Pemahaman dasar tentang berkas konfigurasi JSON

1. Claude Desktop

Claude Desktop adalah aplikasi desktop resmi dari Anthropic yang secara native mendukung MCP.

Instalasi

Unduh Claude Desktop dari claude.ai/download
Instal dan masuk dengan akun Anthropic Anda

Konfigurasi

Claude Desktop menggunakan berkas konfigurasi JSON untuk mendefinisikan server MCP.

Lokasi berkas konfigurasi:

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

Contoh konfigurasi:

{
  "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"
      }
    }
  }
}

Opsi Konfigurasi

Field	Deskripsi	Contoh
`command`	Executable yang dijalankan	`"python"`, `"node"`, `"npx"`
`args`	Argumen baris perintah	`["-m", "my_server"]`
`env`	Variabel lingkungan	`{"API_KEY": "xxx"}`
`cwd`	Direktori kerja	`"/path/to/server"`

Menguji Pengaturan Anda

Simpan berkas konfigurasi
Restart Claude Desktop sepenuhnya (keluar dan buka kembali)
Buka percakapan baru
Cari ikon 🔌 yang menandakan server terhubung
Coba minta Claude menggunakan salah satu alat Anda

Pemecahan Masalah Claude Desktop

Server tidak muncul:

Periksa sintaks berkas konfigurasi dengan validator JSON
Pastikan jalur perintah benar
Periksa log Claude Desktop: Bantuan → Tampilkan Log

Server crash saat mulai:

Uji server Anda secara manual di terminal terlebih dahulu
Periksa variabel lingkungan sudah diatur dengan benar
Pastikan semua dependensi terinstal

2. VS Code dengan GitHub Copilot

VS Code mendukung MCP melalui ekstensi GitHub Copilot Chat.

Prasyarat

VS Code versi 1.99+ terinstal
Ekstensi GitHub Copilot terpasang
Ekstensi GitHub Copilot Chat terpasang

Konfigurasi

VS Code menggunakan .vscode/mcp.json di workspace atau pengaturan pengguna.

Konfigurasi 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"
    }
  }
}

Pengaturan pengguna (settings.json):

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

Menggunakan MCP di VS Code

Buka panel Copilot Chat (Ctrl+Shift+I / Cmd+Shift+I)
Ketik @ untuk melihat alat MCP yang tersedia
Gunakan bahasa alami untuk memanggil alat: "Hitung 25 * 48 menggunakan kalkulator"

Pemecahan Masalah VS Code

Server MCP tidak dimuat:

Periksa panel Output → "MCP" untuk log error
Reload window: Ctrl+Shift+P → "Developer: Reload Window"
Pastikan server berjalan secara mandiri terlebih dahulu

3. Cursor

Cursor adalah editor kode dengan dukungan MCP bawaan dan fokus pada AI.

Instalasi

Unduh Cursor dari cursor.sh
Instal dan masuk

Konfigurasi

Cursor menggunakan format konfigurasi serupa dengan Claude Desktop.

Lokasi berkas konfigurasi:

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

Contoh konfigurasi:

{
  "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"
      }
    }
  }
}

Menggunakan MCP di Cursor

Buka chat AI Cursor (Ctrl+L / Cmd+L)
Alat MCP otomatis muncul dalam saran
Minta AI untuk menjalankan tugas menggunakan server terhubung

4. Cline (Berbasis Terminal)

Cline adalah klien MCP berbasis terminal, ideal untuk alur kerja baris perintah.

Instalasi

npm install -g @anthropic/cline

Konfigurasi

Cline menggunakan variabel lingkungan dan argumen baris perintah.

Menggunakan variabel lingkungan:

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

Menggunakan argumen baris perintah:

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

Berkas konfigurasi (~/.clinerc):

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

Menggunakan Cline

# Mulai sesi interaktif
cline

# Satu kueri dengan MCP
cline "Calculate the square root of 144 using the calculator"

# Daftar alat yang tersedia
cline --list-tools

5. Windsurf

Windsurf adalah editor kode bertenaga AI lain dengan dukungan MCP.

Instalasi

Unduh Windsurf dari codeium.com/windsurf
Instal dan buat akun

Konfigurasi

Konfigurasi Windsurf dikelola melalui UI pengaturan:

Buka Pengaturan (Ctrl+, / Cmd+,)
Cari "MCP"
Klik "Edit in settings.json"

Contoh konfigurasi:

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

Perbandingan Tipe Transportasi

Host yang berbeda mendukung mekanisme transportasi berbeda:

Host	stdio	SSE/HTTP	WebSocket
Claude Desktop	✅	❌	❌
VS Code	✅	✅	❌
Cursor	✅	✅	❌
Cline	✅	✅	❌
Windsurf	✅	✅	❌

stdio (standard input/output): Terbaik untuk server lokal yang dijalankan oleh host
SSE/HTTP: Terbaik untuk server jarak jauh atau server yang dibagikan antara beberapa klien

Pemecahan Masalah Umum

Server tidak mau mulai

Uji server secara manual terlebih dahulu:

# Untuk Python
python -m your_server_module

# Untuk Node.js
node /path/to/server/index.js

Periksa jalur perintah:
- Gunakan jalur absolut jika memungkinkan
- Pastikan executable ada di PATH Anda

Verifikasi dependensi:

# Python
pip list | grep mcp

# Node.js
npm list @modelcontextprotocol/sdk

Server terhubung tetapi alat tidak berfungsi

Periksa log server - Kebanyakan host memiliki opsi logging
Verifikasi pendaftaran alat - Gunakan MCP Inspector untuk pengujian
Periksa izin - Beberapa alat memerlukan akses file/jaringan

Variabel lingkungan tidak diteruskan

Beberapa host menyaring variabel lingkungan
Gunakan bidang env secara eksplisit dalam konfigurasi
Hindari data sensitif di berkas konfigurasi (gunakan manajemen rahasia)

Praktik Keamanan Terbaik

Jangan pernah commit kunci API ke berkas konfigurasi
Gunakan variabel lingkungan untuk data sensitif
Batasi izin server hanya untuk yang dibutuhkan
Tinjau kode server sebelum memberikan akses ke sistem Anda
Gunakan allowlist untuk akses sistem file dan jaringan

Selanjutnya

Sumber Daya Tambahan

Penafian: Dokumen ini telah diterjemahkan menggunakan layanan terjemahan AI Co-op Translator. Meskipun kami berupaya untuk akurasi, mohon diingat bahwa terjemahan otomatis mungkin mengandung kesalahan atau ketidakakuratan. Dokumen asli dalam bahasa aslinya harus dianggap sebagai sumber yang sahih. Untuk informasi penting, disarankan menggunakan terjemahan profesional oleh manusia. Kami tidak bertanggung jawab atas kesalahpahaman atau salah tafsir yang timbul dari penggunaan terjemahan ini.

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Menyiapkan Klien Host MCP Populer

Apa itu Host MCP?

Prasyarat

1. Claude Desktop

Instalasi

Konfigurasi

Opsi Konfigurasi

Menguji Pengaturan Anda

Pemecahan Masalah Claude Desktop

2. VS Code dengan GitHub Copilot

Prasyarat

Konfigurasi

Menggunakan MCP di VS Code

Pemecahan Masalah VS Code

3. Cursor

Instalasi

Konfigurasi

Menggunakan MCP di Cursor

4. Cline (Berbasis Terminal)

Instalasi

Konfigurasi

Menggunakan Cline

5. Windsurf

Instalasi

Konfigurasi

Perbandingan Tipe Transportasi

Pemecahan Masalah Umum

Server tidak mau mulai

Server terhubung tetapi alat tidak berfungsi

Variabel lingkungan tidak diteruskan

Praktik Keamanan Terbaik

Selanjutnya

Sumber Daya Tambahan

FilesExpand file tree

README.md

Latest commit

History

README.md

File metadata and controls

Menyiapkan Klien Host MCP Populer

Apa itu Host MCP?

Prasyarat

1. Claude Desktop

Instalasi

Konfigurasi

Opsi Konfigurasi

Menguji Pengaturan Anda

Pemecahan Masalah Claude Desktop

2. VS Code dengan GitHub Copilot

Prasyarat

Konfigurasi

Menggunakan MCP di VS Code

Pemecahan Masalah VS Code

3. Cursor

Instalasi

Konfigurasi

Menggunakan MCP di Cursor

4. Cline (Berbasis Terminal)

Instalasi

Konfigurasi

Menggunakan Cline

5. Windsurf

Instalasi

Konfigurasi

Perbandingan Tipe Transportasi

Pemecahan Masalah Umum

Server tidak mau mulai

Server terhubung tetapi alat tidak berfungsi

Variabel lingkungan tidak diteruskan

Praktik Keamanan Terbaik

Selanjutnya

Sumber Daya Tambahan