用以下方法可以在页面内使用简码的方式调用DeepSeek对话框并进行对话
1.将以下代码添加到主题的functions.php文件中(记得替换你的API KEY):
// 添加DeepSeek对话简码
add_shortcode('deepseek_chat', function(){
wp_enqueue_script('deepseek-chat');
return '<div class="deepseek-chat-container">
<div class="chat-messages"></div>
<div class="chat-input">
<input type="text" placeholder="输入你的问题...">
<button>发送</button>
</div>
</div>';
});
// 注册脚本
add_action('wp_enqueue_scripts', function(){
wp_register_script('deepseek-chat', get_template_directory_uri().'/deepseek-chat.js', ['jquery'], '1.0', true);
wp_localize_script('deepseek-chat', 'deepseek_vars', [
'ajax_url' => admin_url('admin-ajax.php'),
'nonce' => wp_create_nonce('deepseek-nonce')
]);
});
// 处理API请求
add_action('wp_ajax_deepseek_chat', 'handle_deepseek_request');
add_action('wp_ajax_nopriv_deepseek_chat', 'handle_deepseek_request');
function handle_deepseek_request() {
check_ajax_referer('deepseek-nonce', 'nonce');
$api_key = 'your-api-key-here'; // 替换为你的API密钥
$user_id = $_COOKIE['deepseek_session'] ?? uniqid();
// 设置会话cookie(30分钟有效期)
setcookie('deepseek_session', $user_id, time() + 1800, '/');
// 获取或初始化对话历史
$history = get_transient("deepseek_history_$user_id") ?: [];
// 构建请求数据
$messages = array_merge($history, [[
'role' => 'user',
'content' => sanitize_text_field($_POST['message'])
]]);
$response = wp_remote_post('https://api.deepseek.com/v1/chat/completions', [
'headers' => [
'Content-Type' => 'application/json',
'Authorization' => 'Bearer '.$api_key
],
'body' => json_encode([
'model' => 'deepseek-chat',
'messages' => $messages,
'temperature' => 0.7
])
]);
if (!is_wp_error($response)) {
$body = json_decode($response['body'], true);
$reply = $body['choices'][0]['message']['content'];
// 更新对话历史(保留最近5轮对话)
$updated_history = array_merge($messages, [[
'role' => 'assistant',
'content' => $reply
]]);
if (count($updated_history) > 10) {
$updated_history = array_slice($updated_history, -10);
}
set_transient("deepseek_history_$user_id", $updated_history, 1800);
wp_send_json_success([
'reply' => wp_kses_post($reply)
]);
}
wp_send_json_error(['error' => '请求失败,请重试']);
}
2.在主题目录中创建 deepseek-chat.js 文件:
jQuery(document).ready(function($) {
$('.deepseek-chat-container').each(function() {
const container = $(this);
const messagesDiv = container.find('.chat-messages');
const input = container.find('input');
const button = container.find('button');
function addMessage(content, isUser) {
messagesDiv.append(`
<div class="message ${isUser ? 'user' : 'bot'}">
${content}
</div>
`);
messagesDiv.scrollTop(messagesDiv[0].scrollHeight);
}
button.on('click', async function() {
const message = input.val().trim();
if (!message) return;
addMessage(message, true);
input.val('');
try {
const response = await $.ajax({
url: deepseek_vars.ajax_url,
type: 'POST',
data: {
action: 'deepseek_chat',
nonce: deepseek_vars.nonce,
message: message
}
});
if (response.success) {
addMessage(response.data.reply, false);
}
} catch (error) {
addMessage('请求失败,请稍后再试', false);
}
});
input.on('keypress', function(e) {
if (e.which === 13) {
button.click();
}
});
});
});
3.添加CSS样式到主题的额外CSS设置中:
.deepseek-chat-container {
max-width: 800px;
margin: 20px auto;
border: 1px solid #eee;
border-radius: 8px;
padding: 15px;
}
.chat-messages {
height: 400px;
overflow-y: auto;
margin-bottom: 15px;
padding: 10px;
background: #f9f9f9;
border-radius: 4px;
}
.message {
margin: 10px 0;
padding: 10px;
border-radius: 4px;
max-width: 80%;
}
.message.user {
background: #e3f2fd;
margin-left: auto;
}
.message.bot {
background: #fff;
border: 1px solid #eee;
}
.chat-input {
display: flex;
gap: 10px;
}
.chat-input input {
flex: 1;
padding: 8px;
border: 1px solid #ddd;
border-radius: 4px;
}
.chat-input button {
padding: 8px 20px;
background: #0073aa;
color: white;
border: none;
border-radius: 4px;
cursor: pointer;
}
4.创建页面
在新页面创建简码deepseek_chat
注意事项:
- 上下文记忆基于WordPress Transient API实现,默认保留30分钟
- 对话历史最多保留最近5轮(10条消息)对话
- 需要申请并替换代码中的DeepSeek API密钥