phyer/myfari
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

dockerfile

Browse Source
This commit is contained in:
zhangkun9038@dingtalk.com 2025-03-17 16:45:13 +08:00
parent df53ef7f10
commit 57baa24f38
3 changed files with 211 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.gitignore vendored Normal file
View File

@ -0,0 +1 @@
node_modules

193
public/asdf.html Normal file
View File

@ -0,0 +1,193 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Chat API</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
height: 100vh;
display: flex;
flex-direction: column;
}
.chat-container {
flex: 1;
max-width: 1360px;
margin: 0 auto;
width: 100%;
display: flex;
flex-direction: column;
padding: 20px;
box-sizing: border-box;
overflow-y: auto;
}
@media (max-width: 768px) {
.chat-container {
max-width: 100%;
padding: 10px;
}
}
.message-container {
flex: 1;
overflow-y: auto;
padding: 10px;
}
.input-container {
padding: 10px;
background: #f5f5f5;
position: sticky;
bottom: 0;
}
textarea {
width: calc(100% - 90px);
height: 60px;
padding: 10px;
border: 1px solid #ddd;
border-radius: 4px;
resize: none;
}
button {
width: 40px;
height: 40px;
margin-left: 10px;
background: #007bff;
color: white;
border: none;
border-radius: 50%;
cursor: pointer;
opacity: 0.7;
transition: opacity 0.2s;
display: flex;
align-items: center;
justify-content: center;
}
button:hover {
opacity: 1;
}
.message {
max-width: 70%;
margin-bottom: 15px;
padding: 10px;
border-radius: 8px;
position: relative;
}
.copy-btn {
position: absolute;
right: 10px;
bottom: -20px;
background: none;
border: none;
cursor: pointer;
color: #007bff;
font-size: 16px;
opacity: 0.7;
transition: opacity 0.2s;
padding: 0;
display: flex;
align-items: center;
justify-content: center;
}
</style>
</head>
<body>
<div class="chat-container">
<div class="message-container" id="messageContainer"></div>
<div class="input-container">
<textarea id="messageInput" placeholder="请输入您的问题..."></textarea>
<button onclick="sendMessage()" title="发送"><i class="fas fa-paper-plane"></i></button>
<button onclick="clearHistory()" style="margin-left: 10px; background-color: #ff4d4f;" title="清空历史"><i class="fas fa-trash-alt"></i></button>
</div>
</div>
<script>
let conversationHistory = [];
function formatMarkdown(text) {
text = text.replace(/\n/g, '<br>');
text = text.replace(/\*\*(.*?)\*\*/g, '<strong>$1</strong>');
text = text.replace(/\*(.*?)\*/g, '<em>$1</em>');
text = text.replace(/`(.*?)`/g, '<code>$1</code>');
text = text.replace(/\[(.*?)\]\((.*?)\)/g, '<a href="$2" target="_blank">$1</a>');
return text;
}
async function sendMessage() {
const message = document.getElementById('messageInput').value;
const messageContainer = document.getElementById('messageContainer');
if (!message) {
alert('请输入消息');
return;
}
const userMessageDiv = document.createElement('div');
userMessageDiv.className = 'message user-message';
userMessageDiv.innerHTML = `
<div>${message}</div>
<button class="copy-btn" onclick="copyText(this)" title="复制"><i class="fas fa-copy"></i></button>
`;
messageContainer.appendChild(userMessageDiv);
try {
conversationHistory.push({ role: 'user', content: message });
const response = await fetch('/api/chat', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({
message,
history: conversationHistory
})
});
const data = await response.json();
if (data.status === 'success') {
const formattedText = formatMarkdown(data.response.output.text);
const botMessageDiv = document.createElement('div');
botMessageDiv.className = 'message bot-message';
botMessageDiv.innerHTML = `
<div>${formattedText}</div>
<button class="copy-btn" onclick="copyText(this)" title="复制"><i class="fas fa-copy"></i></button>
`;
messageContainer.appendChild(botMessageDiv);
conversationHistory.push({ role: 'assistant', content: data.response.output.text });
} else {
const errorMessageDiv = document.createElement('div');
errorMessageDiv.className = 'message bot-message';
errorMessageDiv.textContent = '请求失败，请稍后重试';
messageContainer.appendChild(errorMessageDiv);
}
} catch (error) {
console.error(error);
const errorMessageDiv = document.createElement('div');
errorMessageDiv.className = 'message bot-message';
errorMessageDiv.textContent = '网络错误，请检查连接';
messageContainer.appendChild(errorMessageDiv);
}
document.getElementById('messageInput').value = '';
messageContainer.scrollTop = messageContainer.scrollHeight;
}
function clearHistory() {
conversationHistory = [];
document.getElementById('messageContainer').innerHTML = '';
}
function copyText(button) {
const text = button.previousElementSibling.textContent;
navigator.clipboard.writeText(text).then(() => {
button.textContent = '已复制';
setTimeout(() => button.textContent = '复制', 2000);
});
}
</script>
</body>
</html>

33
public/index.html
View File

@ -25,7 +25,6 @@
box-sizing: border-box;
overflow-y: auto;
}
@media (max-width: 768px) {
.chat-container {
max-width: 100%;
@ -92,16 +91,6 @@
align-items: center;
justify-content: center;
}
font-size: 16px;
opacity: 0.7;
transition: opacity 0.2s;
padding: 0;
display: flex;
align-items: center;
justify-content: center;
<button onclick="sendMessage()" title="发送"><i class="fas fa-paper-plane"></i></button>
<button onclick="clearHistory()" style="margin-left: 10px; background-color: #ff4d4f;" title="清空历史"><i class="fas fa-trash-alt"></i></button>
}
</style>
</head>
<body>
@ -119,13 +108,11 @@
let conversationHistory = [];
function formatMarkdown(text) {
// 处理换行符
text = text.replace(/\n/g, '<br>');
// 简单Markdown格式化
text = text.replace(/\*\*(.*?)\*\*/g, '<strong>$1</strong>'); // 加粗
text = text.replace(/\*(.*?)\*/g, '<em>$1</em>'); // 斜体
text = text.replace(/`(.*?)`/g, '<code>$1</code>'); // 代码
text = text.replace(/\[(.*?)\]\((.*?)\)/g, '<a href="$2" target="_blank">$1</a>'); // 链接
text = text.replace(/\*\*(.*?)\*\*/g, '<strong>$1</strong>');
text = text.replace(/\*(.*?)\*/g, '<em>$1</em>');
text = text.replace(/`(.*?)`/g, '<code>$1</code>');
text = text.replace(/\[(.*?)\]\((.*?)\)/g, '<a href="$2" target="_blank">$1</a>');
return text;
}
@ -138,23 +125,20 @@
return;
}
// 添加用户消息
const userMessageDiv = document.createElement('div');
userMessageDiv.className = 'message user-message';
userMessageDiv.innerHTML = `
<div>${message}</div>
<button class="copy-btn" onclick="copyText(this)" title="复制"><i class="fas fa-copy"></i></button>
`;
messageContainer.appendChild(userMessageDiv);
try {
// 添加当前消息到对话历史
conversationHistory.push({ role: 'user', content: message });
const response = await fetch('/api/chat', {
method: 'POST',
headers: {
<button class="copy-btn" onclick="copyText(this)" title="复制"><i class="fas fa-copy"></i></button>
'Content-Type': 'application/json'
},
body: JSON.stringify({
message,
@ -169,11 +153,9 @@
botMessageDiv.className = 'message bot-message';
botMessageDiv.innerHTML = `
<div>${formattedText}</div>
<button class="copy-btn" onclick="copyText(this)" title="复制"><i class="fas fa-copy"></i></button>
`;
messageContainer.appendChild(botMessageDiv);
// 添加AI回复到对话历史
conversationHistory.push({ role: 'assistant', content: data.response.output.text });
} else {
const errorMessageDiv = document.createElement('div');
@ -189,13 +171,10 @@
messageContainer.appendChild(errorMessageDiv);
}
// 清空输入框
document.getElementById('messageInput').value = '';
// 滚动到底部
messageContainer.scrollTop = messageContainer.scrollHeight;
}
// 清空对话历史
function clearHistory() {
conversationHistory = [];
document.getElementById('messageContainer').innerHTML = '';
@ -212,3 +191,5 @@
</body>
</html>