如何将自定义GPT集成到您的网站中?(一步一步指南)

By Bo Sar · 2024-03-17

在本文中,我将向您展示如何将自定义GPT集成到您的网站中的详细步骤。无需编程经验,只需跟随我的指导,您就能轻松完成集成。我们将探讨两种集成方法,让您选择最适合您的方式。

如何将自定义GPT集成到网站中

  • 在这个视频中,我将展示如何将自定义GPT集成到您的网站中。在之前的视频中,我们使用GPT Builder构建了一个自定义的GPT,如果您还没有观看,我建议您先观看那个视频。但是在本视频结束时,您将清楚地了解如何将自定义GPT添加到任何网站中。我将展示两种集成方法,第一种方法根本不需要任何代码,第二种方法稍微复杂一些,但您不需要任何技术背景。我将为您提供一步一步的教程,您只需要复制并粘贴我在屏幕上展示的内容,视频描述中还将提供所有必要的模板。在深入教程之前,了解GPT和助手API之间的区别是很重要的。尽管它们在根本上是相同的,但它们的应用领域不同。GPTs被设计为B2C(企业对消费者)产品,适用于面向消费者的应用程序,它们允许您创建具有自定义指令和自定义知识库的GPT,通常用于个人使用。而助手API则是B2B(企业对企业)产品,旨在面向企业的应用程序,它也具有相同的自定义指令和知识库,但可以以编程方式运行,这意味着您可以构建一个调用此助手的代码通过API的代码。这使得它可以集成到各种应用程序、网站或您构建的任何内容中,而这正是我们要做的。我们将使用一段代码来创建助手,然后将其连接到一个聊天机器人构建器,最后将其放到网站上。当然,已经有许多初创公司构建了所有这些集成,并且他们通过订阅费用提供了一个用户友好的界面,您可以在其中添加您的自定义指令和知识库,并通过几次点击将您的GPT添加到网站上。作为示例,我将向您展示Chatbase Doco,您可以通过描述下方的链接访问。在本教程中,我将使用这个示例网站,我的目标是添加一个基于我的知识库训练的客服聊天机器人,并连接到一个GPT。
如何将自定义GPT集成到网站中
如何将自定义GPT集成到网站中

创建和定制您的聊天机器人

  • 一旦您注册了模型,您就可以单击新的聊天机器人按钮,首先要做的是添加基于知识的文件,只需拖放并单击创建聊天机器人,就完成了!聊天机器人已创建,它是在我刚刚上传的文件上进行训练,并连接到了一个GPT模型。现在我可以定制它,然后将其添加到我的网站上。因此,我转到设置模型,在这里,就像您在GPT Builder中添加自定义指令一样,您也可以在这里添加自定义指令,有一个默认的指令可以保留,但我打算替换它,我已经准备好了,所以我只需粘贴。您可以看到正在使用一个付费计划的GPT模型,您可以选择GPT 4 Turbo,但在免费试用版中只有GPT 3.5 Turbo可用,所以我只需单击保存。当您转到来源选项卡时,一个有趣的功能是除了添加包含知识的文件之外,还可以添加您的网站网址,它将抓取所有链接直接从您的网站中获取知识,因此在某些情况下可能非常方便。但在我的示例中,我将只使用一开始上传的知识文档,现在我们已经定制了我们的知识库和指令。如果您转到设置然后选择聊天界面,您可以修改聊天机器人在您网站上的外观,因此您可以编辑初始消息,更改主题,并上传聊天机器人的个人资料图片等。一旦您满意您的聊天机器人设计,让我们单击嵌入到网站然后公开,现在我们需要做的就是复制这段脚本并将其粘贴到我们网站的代码中,因此我只需滚动到具有脚本的部分,粘贴那段代码并保存。现在当我返回到示例网站时,聊天机器人图标已经出现了,让我们问一个问题看看它是如何工作的,“您的会员选择是什么?”它为我们提供了一段包含在我一开始添加的知识文件中的信息,就这样,我们的目标已经实现了!聊天机器人在那里,正在工作,并连接到一个GPT模型,显然使用第三方存在一些劣势。
创建和定制您的聊天机器人
创建和定制您的聊天机器人

创建定制智能聊天机器人的方法

  • 首先,像这样的第三方服务首先有成本因素,您必须支付他们的费用,因为他们需要产生收入。其次,与使用您自己的代码相比,灵活性不足,他们决定向您提供哪种 GPT 模型,而且您无法通过助手 API 执行任何高级有趣的操作,因为您根本没有直接访问权。现在让我们来看第二种方法,直接在 OpenAI 平台上创建助手 API,将其连接到聊天机器人,然后将其集成到网站中。我们的目标仍然完全相同,我们将构建一个自定义知识库聊天机器人,作为样本网站上的客户支持助手。这个过程涉及两个主要组成部分:后端和前端。对于后端,我们将使用 RIT,它将托管实现我们聊天机器人功能的代码。对于前端,我们将使用 Voiceflow 设计和构建聊天机器人界面。然后我们将通过 API 调用将后端的 RIT 与前端的 Voiceflow 连接起来,使它们能够相互通信。我理解前端、后端和 API 调用这样的术语听起来有点技术性,但绝对不用担心,您只需要复制粘贴我演示的内容,无需写任何代码即可开始。您需要注册 RIT 并复制视频描述中提供的代码。我还要感谢 Liam Otley,这位实际构建了代码并与社区分享的家伙,我们非常感激。为了复制该代码,您需要在这里点击 Fork,给它取一个名字,然后点击 Fork。这是代码,它将创建一个新的系统或加载现有系统,启动对话线程,生成响应等等。如果您有兴趣了解这段代码的构造方式,这里有一个主意:复制整段代码,粘贴到 ChatGPT 中,然后请求解释。这是一个学习的绝佳方式,如果那是您的目标。但是如果您只是想要用它为您的网站添加一个定制的 GPT,您实际上需要改变的唯一一件事就是定制指令。
创建定制智能聊天机器人的方法
创建定制智能聊天机器人的方法

搭建AI助手后端和前端的步骤

  • 知识和自定义说明是文档的一部分。首先,您需要在platform.open.com上添加您的OpenAI秘钥。如果您将CPT视为开放给客户的OpenAI产品,那么这个平台就是面向业务的。它专门为开发人员设计。首先,转到设置,然后到帐单中添加一些信用额度,否则您将无法使用gp4 turbo模型。您仍然需要支付使用Open AI助手API,但直接这样做比使用第三方解决方案要便宜得多。在添加一些信用额度后,转到API密钥,点击创建新的秘钥,为其命名,然后点击创建,现在复制您的秘密API秘钥,返回到代码中粘贴在这里作为一个值,然后点击添加秘钥。这样我们的后端就设置好了。每次运行此代码时,它将首先检查是否存在助手Json文件,如果没有,将创建一个。第一次运行代码时,将创建助手,并且对所有后续运行,代码将使用现有的助手。所以,如果您回到Open AI平台,您会注意到我们的代码根据我们的自定义说明和知识文档创建了一个新的助手。第二部分是设置Voice Flow,这是我们的前端,也就是聊天机器人生成器。在视频描述中,您会找到一个模板文件,您可以直接上传到Voice Flow中。在此之后,唯一需要更改的是添加您的Replit URL,以便在Replit和Voice Flow之间启用通信。所以,只需点击此创建线程框,并粘贴您的URL。找到您的URL,回到Replit,点击新标签页,从新标签页复制此URL,在Voice Flow中粘贴,并确保最后是以斜杠开始。然后点击生成响应框,再次粘贴相同的URL,但是这次确保以斜杠chat结尾。这样就完成了。您可以运行测试来查看它的运行情况。让我们问它什么时候开放吧。
搭建AI助手后端和前端的步骤
搭建AI助手后端和前端的步骤

如何使用AI工具开展业务:Voiceflow聊天机器人教程

  • 在这个教程中,我们将学习如何使用Voiceflow创建一个能够回答客户查询的聊天机器人。首先,我们需要设置聊天机器人的工作时间,确保它在工作期间能够正常运行。通过在控制台跟踪工作情况,我们可以随时了解是否有异常情况发生。接着,我们需要将这个聊天板块添加到网站上。通过点击发布并嵌入小部件,我们可以在网站上显示聊天机器人。调整外观方面,你可以根据自己的喜好修改颜色、助手形象和头像等。借助Voiceflow,我们可以轻松地让聊天机器人在网站上运行,提供帮助并回答客户的问题。AI技术的应用不仅可以节省时间和金钱,还可以提升用户体验,让业务更高效地运转。
如何使用AI工具开展业务:Voiceflow聊天机器人教程
如何使用AI工具开展业务:Voiceflow聊天机器人教程

Conclusion:

通过这篇文章,您将学会如何将自定义GPT轻松集成到您的网站中,无需编程经验。跟随我的指导,您可以选择适合您的集成方法,为您的网站添加自定义智能功能。

Q & A

自定义GPT集成到网站一步一步指南无编程经验自定义知识库
如何构建安全合规的内容管理平台?如何优化您的博客以增加谷歌搜索流量?

About Us

Heichat is dedicated to enhancing customer service experience through AI technology. By learning about your store's products/policies, it can efficiently handle customer service tasks, reducing your burden and boosting your sales.

Affiliate Program

Join Friends of HeiChat and receive a 30% commission on all payments within the first 12 months.🎉🤝

Sign Up

Contact Info

heicarbook@gmail.com

Follow Us

@Heicarbook All rights reserved