怎么在WordPress6.4版本网站中接入豆包AI对话接口

雨瑶小哥_8876

雨瑶小哥_8876

2026-08-11

349人浏览

原创

必须通过火山引擎ark平台接入豆包ai,禁用doubao.com直连;需企业认证、开通指定模型、安全存储ark_api_key与endpoint id;web sdk部署须https且配置正确域名;rest api代理调用需定义凭证、注册端点并前端请求。

☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜

怎么在wordpress6.4版本网站中接入豆包ai对话接口

要在WordPress 6.4网站中接入豆包AI对话接口,必须绕过豆包官方未开放通用API的限制,采用火山引擎ARK平台作为合规通道——直接调用doubao.com域名下的接口会返回403错误且签名逻辑不可逆。

准备火山引擎模型接入凭证

访问火山引擎控制台(https://www.volcengine.com),使用企业实名认证手机号登录。未完成企业认证将无法开通ARK模型服务。

进入「模型服务」→「ARK」页面,开通Doubao-pro-32k或Doubao-vision-pro-32k模型服务。Lite版不支持多轮上下文保持,生产环境请勿选用。

在「API密钥管理」中创建新密钥,【ARK_API_KEY必须保存至服务器环境变量,绝不可写入前端JS或PHP模板】。硬编码密钥会导致API密钥泄露,他人可盗用配额并触发风控封禁。

在「模型推理」页创建接入点,记录Endpoint ID(格式为ep-xxxxxxxx)。该ID将作为请求时的model参数值,不可用模型名称替代。

在WordPress主题中嵌入Web SDK对话窗口

方法一:通过官方Web SDK快速部署(适合无开发资源的运营型站点)

登录豆包AI开放平台,在「应用管理」中创建新应用,获取App ID与App Secret。注意:此处App ID仅用于SDK初始化,与火山引擎ARK密钥无关。

进入「Web SDK配置」页面,填写你的WordPress站点主域名(如example.com),【必须启用HTTPS协议,HTTP域名会被拒绝加载】,启用「Web嵌入」权限后保存。

复制生成的SDK初始化代码,粘贴到WordPress主题的functions.php末尾,用wp_add_inline_script注入:

add_action('wp_enqueue_scripts', function() { wp_add_inline_script('wp-blocks', 'window.DoubaoWidget = window.DoubaoWidget || {}; (function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = "https://sdk.doubao.com/widget/v1.0.js"; fjs.parentNode.insertBefore(js, fjs); }(document, "script", "doubao-js-sdk"));'); });

Feihong Word Docx
Feihong Word Docx

创建、检查和编辑 Microsoft Word 文档和 DOCX 文件,支持样式、编号、修订追踪、表格、分节及兼容性检查

下载

在需要显示对话框的位置(如页脚widget区域),添加容器:

。ID必须与SDK配置中一致,否则组件无法挂载。

最后在主题JS文件中调用初始化:window.DoubaoWidget.init({ theme: "light", placeholder: "向豆包AI提问", appId: "your_app_id_here" });

通过WordPress REST API代理调用火山引擎ARK接口

第一步:在wp-config.php中定义安全凭证

define('ARK_API_KEY', getenv('ARK_API_KEY') ?: 'your_ark_api_key_here'); define('ARK_ENDPOINT_ID', 'ep-20241230135456-wd2db');

第二步:注册自定义REST端点

在functions.php中添加:

add_action('rest_api_init', function() { register_rest_route('doubao/v1', '/chat', [ 'methods' => 'POST', 'callback' => 'handle_doubao_chat', 'permission_callback' => '__return_true', ]); }); function handle_doubao_chat($request) { $body = $request->get_json_params(); $user_input = $body['message'] ?? ''; if (!$user_input) return new WP_Error('empty_message', '消息不能为空', ['status' => 400]); $response = wp_remote_post('https://ark.cn-beijing.volces.com/api/v3/chat/completions', [ 'headers' => [ 'Authorization' => 'Bearer ' . ARK_API_KEY, 'Content-Type' => 'application/json', ], 'body' => json_encode([ 'model' => ARK_ENDPOINT_ID, 'messages' => [['role' => 'user', 'content' => $user_input]], 'max_tokens' => 1024 ]), 'timeout' => 30 ]); if (is_wp_error($response)) return new WP_Error('api_failed', $response->get_error_message()); $body = json_decode(wp_remote_retrieve_body($response), true); return rest_ensure_response($body['choices'][0]['message']['content'] ?? 'AI响应异常'); }

第三步:前端JS发起请求

const chatForm = document.getElementById('doubao-chat-form'); if (chatForm) { chatForm.addEventListener('submit', async (e) => { e.preventDefault(); const input = chatForm.querySelector('input[name="q"]').value; const res = await fetch('/wp-json/doubao/v1/chat', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ message: input }) }); const data = await res.json(); document.getElementById('doubao-response').textContent = data; }); }

相关专题

更多
wordpress seo
wordpress seo

WordPress网站SEO优化方法有:1、选择一个SEO友好的主题,具有清晰的代码结构,快速的加载速度和响应式设计;2、使用SEO插件,优化你的标题标签,元描述,关键字,XML站点地图等;3、优化你的内容,内容是SEO优化的核心;4、优化你的网站速度;5、创建友好的URL;6、使用内部链接;7、优化图像;8、使用社交媒体;9、定期更新你的网站;10、监控和分析你的网站等等。

2023.09.18

4295

6

wordpress下载后怎么安装
wordpress下载后怎么安装

安装前准备:确保服务器满足要求、获取安装文件、创建数据库。上传 wordpress 文件。创建数据库和用户。运行安装程序:选择语言、输入数据库信息、网站标题和管理员信息。安装 wordpress。安装后配置:设置永久链接、安装主题、安装插件、创建内容。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

2024.04.15

4459

6

WordPress插件教程
WordPress插件教程

本专题整理热门WordPress插件资源,涵盖SEO优化、缓存加速、安全防护、表单管理、电商扩展等插件推荐与使用教程。

2026.06.16

218

17

WordPress建站教程大全
WordPress建站教程大全

本专题汇总WordPress教程相关内容,包括WordPress安装教程、建站教程、使用技巧、网站管理经验和实战案例,帮助用户快速掌握WordPress建站与运营方法。

2026.06.16

440

20

WordPress开发教程
WordPress开发教程

本专题提供WordPress开发技术资料,包括主题开发、插件开发、自定义功能开发、API调用及性能优化等内容。

2026.06.16

578

25

wordpress seo
wordpress seo

WordPress网站SEO优化方法有:1、选择一个SEO友好的主题,具有清晰的代码结构,快速的加载速度和响应式设计;2、使用SEO插件,优化你的标题标签,元描述,关键字,XML站点地图等;3、优化你的内容,内容是SEO优化的核心;4、优化你的网站速度;5、创建友好的URL;6、使用内部链接;7、优化图像;8、使用社交媒体;9、定期更新你的网站;10、监控和分析你的网站等等。

2023.09.18

4295

6

wordpress下载后怎么安装
wordpress下载后怎么安装

安装前准备:确保服务器满足要求、获取安装文件、创建数据库。上传 wordpress 文件。创建数据库和用户。运行安装程序:选择语言、输入数据库信息、网站标题和管理员信息。安装 wordpress。安装后配置:设置永久链接、安装主题、安装插件、创建内容。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

2024.04.15

4459

6

WordPress插件教程
WordPress插件教程

本专题整理热门WordPress插件资源,涵盖SEO优化、缓存加速、安全防护、表单管理、电商扩展等插件推荐与使用教程。

2026.06.16

218

17

WordPress建站教程大全
WordPress建站教程大全

本专题汇总WordPress教程相关内容,包括WordPress安装教程、建站教程、使用技巧、网站管理经验和实战案例,帮助用户快速掌握WordPress建站与运营方法。

2026.06.16

440

20

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
如何在 Windows 11 上安装 XAMPP
如何在 Windows 11 上安装 XAMPP

共1课时 | 193人学习

第二十三期_前端开发
第二十三期_前端开发

共98课时 | 11.4万人学习