当前位置: 首页 > news >正文

[Dify] -进阶9- 使用 API 调用方式将 Dify 嵌入自己的网站

随着 AI 聊天机器人在 Web 中应用场景日益增多,很多开发者希望将 Dify 应用嵌入自己的网站,实现客服、问答、知识检索等功能。本文将手把手展开讲解,包括最基础的脚本调用方式,以及在页面上实现交互动作的高级用法。


二、嵌入方式概览 🌐

Dify 支持两种嵌入方式:

  1. iframe + 脚本:最简单,官方直接复制、粘贴 iframe 或脚本代码。

  2. embed.js + JS API:高级方式,通过 JS API 创建按钮、iframe,并实现与宿主页面事件联动。

本文将依此由浅入深拆解。


三、基础嵌入:iframe 或脚本方式

这是官方推荐的快速嵌入办法:

  1. 在 Dify 控制台的应用发布页面,选择“Embed Into Site”,复制 iframe/snippet 代码。

  2. 将其粘贴到网站中对应位置,例如:

<iframesrc="https://udify.app/chatbot/你的token"style="width:100%; height:600px; position:fixed; bot
http://www.dtcms.com/a/292064.html

相关文章:

  • Typecho三种版权保护方法对比与实战指南
  • 【硬件基础】计算机存储和通信领域名词概念解释,时钟频率,传输速率,总线宽度,存储容量,带宽利用率,数据位宽,数据带宽
  • 牛客:最长无重复子数组
  • 嵌入式开发学习———Linux环境下数据结构学习(一)
  • Web3面试题
  • [特殊字符] 字节内部流出版!19道前端核心面试题解析——速存
  • 网络基础16--VRRP技术
  • ospf技术
  • 中国在远程医疗智能化方面有哪些特色发展模式?
  • js 数字逢三切断、整数最大9位、小数最大2位
  • LeetCode 热题100:42.接雨水
  • 数据交换---JSON格式
  • uniapp在app中关于解决输入框键盘弹出后遮住输入框问题
  • haproxy七层均衡
  • ucharts 搭配uniapp 自定义x轴文字 实现截取显示
  • 基于SpringBoot+Uniapp的非遗文化宣传小程序(AI问答、协同过滤算法、Echarts图形化分析)
  • 代码随想录算法训练营Day35|动态规划Part03|01背包问题 二维、01背包问题 一维、416. 分割等和子集
  • (12)机器学习小白入门YOLOv:YOLOv8-cls 模型微调实操
  • YOLO-实例分割头
  • 解决http下浏览器无法开启麦克风问题
  • 【论文阅读 | TIV 2024 | CDC-YOLOFusion:利用跨尺度动态卷积融合实现可见光-红外目标检测】
  • Python实例之画小猪佩奇
  • 知识库搭建之Meilisearch‘s 搜索引擎 测评-东方仙盟测评师
  • Agent架构与工作原理:理解智能体的核心机制
  • Apache Ignite 中 WHERE 子句中的子查询(Subqueries in WHERE Clause)的执行方式
  • 社交电商推客系统全栈开发指南:SpringCloud+分润算法+Flutter跨端
  • 深入浅出控制反转与依赖注入:从理论到实践
  • 深度学习的一些疑点整理
  • J2EE模式---拦截过滤器模式
  • 操作系统 —— A / 概述