373 lines
15 KiB
HTML
373 lines
15 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="ru">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Тест автоматического запуска</title>
|
||
<style>
|
||
body {
|
||
font-family: Arial, sans-serif;
|
||
max-width: 800px;
|
||
margin: 0 auto;
|
||
padding: 20px;
|
||
background-color: #f5f5f5;
|
||
}
|
||
.container {
|
||
background: white;
|
||
border-radius: 10px;
|
||
padding: 20px;
|
||
box-shadow: 0 2px 10px rgba(0,0,0,0.1);
|
||
}
|
||
.test-section {
|
||
background: #e3f2fd;
|
||
padding: 15px;
|
||
border-radius: 8px;
|
||
margin: 15px 0;
|
||
}
|
||
.result {
|
||
background: #f3e5f5;
|
||
padding: 10px;
|
||
border-radius: 5px;
|
||
margin: 10px 0;
|
||
white-space: pre-wrap;
|
||
font-family: monospace;
|
||
font-size: 12px;
|
||
}
|
||
.error {
|
||
background: #ffebee;
|
||
color: #c62828;
|
||
}
|
||
.success {
|
||
background: #e8f5e8;
|
||
color: #2e7d32;
|
||
}
|
||
button {
|
||
background: #2196f3;
|
||
color: white;
|
||
border: none;
|
||
padding: 10px 20px;
|
||
border-radius: 5px;
|
||
cursor: pointer;
|
||
margin: 5px;
|
||
}
|
||
button:hover {
|
||
background: #1976d2;
|
||
}
|
||
input[type="text"] {
|
||
width: 100%;
|
||
padding: 10px;
|
||
border: 1px solid #ddd;
|
||
border-radius: 5px;
|
||
margin: 5px 0;
|
||
}
|
||
.chat-log {
|
||
background: #f8f9fa;
|
||
padding: 15px;
|
||
border-radius: 8px;
|
||
margin: 15px 0;
|
||
max-height: 400px;
|
||
overflow-y: auto;
|
||
border: 1px solid #dee2e6;
|
||
}
|
||
.message {
|
||
margin: 10px 0;
|
||
padding: 10px;
|
||
border-radius: 5px;
|
||
}
|
||
.message.user {
|
||
background: #007bff;
|
||
color: white;
|
||
text-align: right;
|
||
}
|
||
.message.bot {
|
||
background: #e9ecef;
|
||
color: #333;
|
||
}
|
||
.message.system {
|
||
background: #fff3cd;
|
||
color: #856404;
|
||
font-style: italic;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div class="container">
|
||
<h1>🚀 Тест автоматического запуска</h1>
|
||
|
||
<div class="test-section">
|
||
<h3>💬 Тест автостарта бота</h3>
|
||
<p><strong>Цель:</strong> Проверить, что бот автоматически запускается при открытии чата</p>
|
||
|
||
<button onclick="initChat()">Открыть чат (автостарт)</button>
|
||
<button onclick="clearChat()">Очистить чат</button>
|
||
|
||
<div id="chatLog" class="chat-log"></div>
|
||
</div>
|
||
|
||
<div class="test-section">
|
||
<h3>📊 Результаты тестов</h3>
|
||
<div id="testResults" class="result"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<script>
|
||
let sessionId = null;
|
||
const PROXY_URL = '/aiassist/typebot_proxy.php';
|
||
|
||
function addMessage(text, isUser = false, isSystem = false) {
|
||
const chatLog = document.getElementById('chatLog');
|
||
const messageDiv = document.createElement('div');
|
||
messageDiv.className = `message ${isUser ? 'user' : (isSystem ? 'system' : 'bot')}`;
|
||
messageDiv.textContent = text;
|
||
chatLog.appendChild(messageDiv);
|
||
chatLog.scrollTop = chatLog.scrollHeight;
|
||
}
|
||
|
||
function logResult(message, isError = false) {
|
||
const resultsDiv = document.getElementById('testResults');
|
||
const timestamp = new Date().toLocaleTimeString();
|
||
const logEntry = `[${timestamp}] ${message}\n`;
|
||
resultsDiv.textContent += logEntry;
|
||
|
||
if (isError) {
|
||
resultsDiv.className = 'result error';
|
||
} else {
|
||
resultsDiv.className = 'result success';
|
||
}
|
||
}
|
||
|
||
function clearChat() {
|
||
document.getElementById('chatLog').innerHTML = '';
|
||
sessionId = null;
|
||
logResult('Чат очищен, сессия сброшена');
|
||
}
|
||
|
||
function getCurrentContext() {
|
||
return {
|
||
projectId: 'test-123',
|
||
module: 'Test',
|
||
view: 'Test',
|
||
userId: 'test-user'
|
||
};
|
||
}
|
||
|
||
async function sendToAI(message) {
|
||
try {
|
||
logResult(`Отправка в AI: "${message}"`);
|
||
const context = getCurrentContext();
|
||
|
||
// Пробуем Typebot
|
||
const response = await sendToTypebot(message, context);
|
||
return response;
|
||
|
||
} catch (error) {
|
||
logResult(`Ошибка AI: ${error.message}`, true);
|
||
return 'Извините, произошла ошибка при отправке сообщения. Попробуйте позже.';
|
||
}
|
||
}
|
||
|
||
async function sendToTypebot(message, context) {
|
||
try {
|
||
logResult(`Отправка в Typebot: "${message}"`);
|
||
|
||
// Если это первое сообщение, создаем сессию
|
||
if (!sessionId) {
|
||
logResult('Создание новой сессии');
|
||
const response = await fetch(PROXY_URL, {
|
||
method: 'POST',
|
||
headers: {
|
||
'Content-Type': 'application/json',
|
||
},
|
||
body: JSON.stringify({
|
||
action: 'startChat',
|
||
message: message,
|
||
context: context
|
||
})
|
||
});
|
||
|
||
const result = await response.json();
|
||
|
||
if (result.success) {
|
||
const data = result.data;
|
||
sessionId = data.sessionId;
|
||
logResult(`SessionId создан: ${sessionId}`);
|
||
|
||
// Проверяем, есть ли clientSideActions (webhook к n8n)
|
||
if (data.clientSideActions && data.clientSideActions.length > 0) {
|
||
logResult(`Найдено ${data.clientSideActions.length} clientSideActions`);
|
||
|
||
for (const action of data.clientSideActions) {
|
||
if (action.type === 'httpRequestToExecute') {
|
||
const webhookResult = await executeHttpRequest(action.httpRequestToExecute);
|
||
|
||
if (webhookResult && webhookResult.length > 0 && webhookResult[0].output) {
|
||
logResult(`✅ n8n ответ получен`);
|
||
return webhookResult[0].output; // Возвращаем ответ от n8n
|
||
} else {
|
||
logResult(`❌ n8n не ответил`);
|
||
return 'Извините, сервис временно недоступен. Попробуйте позже.';
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
// Обрабатываем сообщения
|
||
if (data.messages && data.messages.length > 0) {
|
||
const lastMessage = data.messages[data.messages.length - 1];
|
||
let messageText = '';
|
||
|
||
if (lastMessage.content && lastMessage.content.richText) {
|
||
messageText = extractTextFromRichText(lastMessage.content.richText);
|
||
} else {
|
||
messageText = lastMessage.content || '';
|
||
}
|
||
|
||
// Пропускаем приветствие
|
||
if (messageText.toLowerCase().includes('привет') || messageText.toLowerCase().includes('hello')) {
|
||
logResult('Пропускаем приветствие');
|
||
return null; // Не показываем приветствие
|
||
}
|
||
|
||
return messageText;
|
||
}
|
||
|
||
return null;
|
||
} else {
|
||
throw new Error(`Typebot Proxy error: ${result.error}`);
|
||
}
|
||
} else {
|
||
logResult('Продолжение существующей сессии');
|
||
const response = await fetch(PROXY_URL, {
|
||
method: 'POST',
|
||
headers: {
|
||
'Content-Type': 'application/json',
|
||
},
|
||
body: JSON.stringify({
|
||
action: 'continueChat',
|
||
sessionId: sessionId,
|
||
message: message,
|
||
context: context
|
||
})
|
||
});
|
||
|
||
const result = await response.json();
|
||
|
||
if (result.success) {
|
||
const data = result.data;
|
||
|
||
// Проверяем, есть ли clientSideActions (webhook к n8n)
|
||
if (data.clientSideActions && data.clientSideActions.length > 0) {
|
||
for (const action of data.clientSideActions) {
|
||
if (action.type === 'httpRequestToExecute') {
|
||
const webhookResult = await executeHttpRequest(action.httpRequestToExecute);
|
||
|
||
if (webhookResult && webhookResult.length > 0 && webhookResult[0].output) {
|
||
return webhookResult[0].output;
|
||
} else {
|
||
return 'Извините, сервис временно недоступен. Попробуйте позже.';
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
// Обрабатываем сообщения
|
||
if (data.messages && data.messages.length > 0) {
|
||
const lastMessage = data.messages[data.messages.length - 1];
|
||
let messageText = '';
|
||
|
||
if (lastMessage.content && lastMessage.content.richText) {
|
||
messageText = extractTextFromRichText(lastMessage.content.richText);
|
||
} else {
|
||
messageText = lastMessage.content || '';
|
||
}
|
||
|
||
return messageText;
|
||
}
|
||
|
||
return null;
|
||
} else {
|
||
throw new Error(`Typebot Proxy error: ${result.error}`);
|
||
}
|
||
}
|
||
} catch (error) {
|
||
logResult(`Ошибка Typebot: ${error.message}`, true);
|
||
throw error;
|
||
}
|
||
}
|
||
|
||
function extractTextFromRichText(richText) {
|
||
if (!richText || !Array.isArray(richText)) {
|
||
return '';
|
||
}
|
||
|
||
let text = '';
|
||
for (const item of richText) {
|
||
if (item.type === 'p' && item.children) {
|
||
for (const child of item.children) {
|
||
if (child.text) {
|
||
text += child.text;
|
||
}
|
||
}
|
||
text += '\n';
|
||
} else if (item.text) {
|
||
text += item.text;
|
||
}
|
||
}
|
||
|
||
return text.trim();
|
||
}
|
||
|
||
async function executeHttpRequest(httpRequest) {
|
||
try {
|
||
logResult(`Выполнение HTTP запроса: ${httpRequest.url}`);
|
||
|
||
const response = await fetch(httpRequest.url, {
|
||
method: httpRequest.method || 'POST',
|
||
headers: {
|
||
'Content-Type': 'application/json',
|
||
},
|
||
body: JSON.stringify(httpRequest.body)
|
||
});
|
||
|
||
const result = await response.json();
|
||
logResult(`HTTP запрос выполнен`);
|
||
|
||
return result;
|
||
} catch (error) {
|
||
logResult(`Ошибка HTTP запроса: ${error.message}`, true);
|
||
return null;
|
||
}
|
||
}
|
||
|
||
async function initChat() {
|
||
logResult('Инициализация чата...');
|
||
|
||
// Добавляем приветственное сообщение
|
||
addMessage('Привет! Я AI ассистент вашей CRM системы. Задавайте любые вопросы - я сразу на них отвечу!', false);
|
||
|
||
// Автоматически запускаем бота
|
||
try {
|
||
logResult('Автостарт бота...');
|
||
const context = getCurrentContext();
|
||
const response = await sendToAI('Привет, я готов к работе!');
|
||
|
||
if (response && response !== null) {
|
||
addMessage(response, false);
|
||
logResult('✅ Бот автостарт успешен');
|
||
} else {
|
||
logResult('✅ Бот автостарт (нет ответа для показа)');
|
||
}
|
||
} catch (error) {
|
||
logResult(`❌ Ошибка автостарта: ${error.message}`, true);
|
||
addMessage('Бот готов к работе! Задавайте вопросы.', false);
|
||
}
|
||
}
|
||
|
||
// Автоматический тест при загрузке
|
||
window.onload = function() {
|
||
logResult('Тест автоматического запуска готов');
|
||
};
|
||
</script>
|
||
</body>
|
||
</html>
|