166 lines
6.9 KiB
HTML
166 lines
6.9 KiB
HTML
|
<!DOCTYPE html>
|
|||
|
|
<html lang="ru">
|
|||
|
|
<head>
|
|||
|
|
<meta charset="UTF-8">
|
|||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|||
|
|
<title>Тест MCP Typebot сервера</title>
|
|||
|
|
<style>
|
|||
|
|
body { font-family: Arial, sans-serif; margin: 20px; background: #f5f5f5; }
|
|||
|
|
.container { max-width: 800px; margin: 0 auto; background: white; padding: 20px; border-radius: 8px; box-shadow: 0 2px 10px rgba(0,0,0,0.1); }
|
|||
|
|
.test-section { margin: 20px 0; padding: 15px; border: 1px solid #ddd; border-radius: 5px; }
|
|||
|
|
.result { background: #f8f9fa; padding: 10px; margin: 10px 0; border-radius: 3px; font-family: monospace; white-space: pre-wrap; }
|
|||
|
|
.success { background: #d4edda; border: 1px solid #c3e6cb; }
|
|||
|
|
.error { background: #f8d7da; border: 1px solid #f5c6cb; }
|
|||
|
|
button { padding: 10px 20px; margin: 5px; background: #007bff; color: white; border: none; border-radius: 3px; cursor: pointer; }
|
|||
|
|
button:hover { background: #0056b3; }
|
|||
|
|
button:disabled { background: #6c757d; cursor: not-allowed; }
|
|||
|
|
input, textarea { padding: 8px; width: 100%; margin: 5px 0; border: 1px solid #ddd; border-radius: 3px; }
|
|||
|
|
.status { padding: 10px; margin: 10px 0; border-radius: 3px; font-weight: bold; }
|
|||
|
|
.status.connected { background: #d4edda; color: #155724; }
|
|||
|
|
.status.disconnected { background: #f8d7da; color: #721c24; }
|
|||
|
|
</style>
|
|||
|
|
</head>
|
|||
|
|
<body>
|
|||
|
|
<div class="container">
|
|||
|
|
<h1>🔧 Тест MCP Typebot сервера</h1>
|
|||
|
|
|
|||
|
|
<div class="test-section">
|
|||
|
|
<h3>📊 Статус подключения</h3>
|
|||
|
|
<div id="connectionStatus" class="status disconnected">❌ Не подключен</div>
|
|||
|
|
<button onclick="checkMCPStatus()">Проверить статус</button>
|
|||
|
|
<div id="statusResult" class="result"></div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="test-section">
|
|||
|
|
<h3>🛠️ Доступные инструменты</h3>
|
|||
|
|
<button onclick="listMCPTools()">Список инструментов</button>
|
|||
|
|
<div id="toolsResult" class="result"></div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="test-section">
|
|||
|
|
<h3>🤖 Тест ботов</h3>
|
|||
|
|
<button onclick="listBots()">Список ботов</button>
|
|||
|
|
<div id="botsResult" class="result"></div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="test-section">
|
|||
|
|
<h3>💬 Тест чата</h3>
|
|||
|
|
<input type="text" id="botId" placeholder="ID бота" value="my-typebot-lezm06l">
|
|||
|
|
<input type="text" id="chatMessage" placeholder="Сообщение" value="Привет!">
|
|||
|
|
<button onclick="startChat()">Начать чат</button>
|
|||
|
|
<div id="chatResult" class="result"></div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="test-section">
|
|||
|
|
<h3>📋 Результаты чата</h3>
|
|||
|
|
<input type="text" id="sessionId" placeholder="ID сессии">
|
|||
|
|
<button onclick="getResults()">Получить результаты</button>
|
|||
|
|
<div id="resultsResult" class="result"></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
let currentSessionId = null;
|
|||
|
|
|
|||
|
|
async function makeMCPRequest(method, params = {}) {
|
|||
|
|
try {
|
|||
|
|
const response = await fetch('/aiassist/mcp_proxy.php', {
|
|||
|
|
method: 'POST',
|
|||
|
|
headers: {
|
|||
|
|
'Content-Type': 'application/json',
|
|||
|
|
},
|
|||
|
|
body: JSON.stringify({
|
|||
|
|
method: method,
|
|||
|
|
params: params
|
|||
|
|
})
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
const result = await response.json();
|
|||
|
|
return result;
|
|||
|
|
} catch (error) {
|
|||
|
|
console.error('MCP Request Error:', error);
|
|||
|
|
return { error: error.message };
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function showResult(elementId, data, isError = false) {
|
|||
|
|
const element = document.getElementById(elementId);
|
|||
|
|
element.textContent = JSON.stringify(data, null, 2);
|
|||
|
|
element.className = `result ${isError ? 'error' : 'success'}`;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
async function checkMCPStatus() {
|
|||
|
|
const statusElement = document.getElementById('connectionStatus');
|
|||
|
|
const resultElement = document.getElementById('statusResult');
|
|||
|
|
|
|||
|
|
try {
|
|||
|
|
const result = await makeMCPRequest('ping');
|
|||
|
|
|
|||
|
|
if (result.error) {
|
|||
|
|
statusElement.textContent = '❌ Ошибка подключения';
|
|||
|
|
statusElement.className = 'status disconnected';
|
|||
|
|
showResult('statusResult', result, true);
|
|||
|
|
} else {
|
|||
|
|
statusElement.textContent = '✅ Подключен';
|
|||
|
|
statusElement.className = 'status connected';
|
|||
|
|
showResult('statusResult', result);
|
|||
|
|
}
|
|||
|
|
} catch (error) {
|
|||
|
|
statusElement.textContent = '❌ Ошибка подключения';
|
|||
|
|
statusElement.className = 'status disconnected';
|
|||
|
|
showResult('statusResult', { error: error.message }, true);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
async function listMCPTools() {
|
|||
|
|
const result = await makeMCPRequest('tools/list');
|
|||
|
|
showResult('toolsResult', result, result.error);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
async function listBots() {
|
|||
|
|
const result = await makeMCPRequest('listBots');
|
|||
|
|
showResult('botsResult', result, result.error);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
async function startChat() {
|
|||
|
|
const botId = document.getElementById('botId').value;
|
|||
|
|
const message = document.getElementById('chatMessage').value;
|
|||
|
|
|
|||
|
|
const result = await makeMCPRequest('startChat', {
|
|||
|
|
botId: botId,
|
|||
|
|
message: message
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
if (result.data && result.data.sessionId) {
|
|||
|
|
currentSessionId = result.data.sessionId;
|
|||
|
|
document.getElementById('sessionId').value = currentSessionId;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
showResult('chatResult', result, result.error);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
async function getResults() {
|
|||
|
|
const sessionId = document.getElementById('sessionId').value || currentSessionId;
|
|||
|
|
|
|||
|
|
if (!sessionId) {
|
|||
|
|
showResult('resultsResult', { error: 'Нет ID сессии' }, true);
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const result = await makeMCPRequest('listResults', {
|
|||
|
|
sessionId: sessionId
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
showResult('resultsResult', result, result.error);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// Автоматическая проверка статуса при загрузке
|
|||
|
|
window.onload = function() {
|
|||
|
|
checkMCPStatus();
|
|||
|
|
};
|
|||
|
|
</script>
|
|||
|
|
</body>
|
|||
|
|
</html>
|
|||
|
|
|
|||
|
|
|