搜索
首页web前端js教程使用 JavaScript 和 Gemini AI 创建聊天机器人:创建后端

保存!哦

继续使用 Javascript 和 Gemini AI 创建我们的聊天机器人,我们将添加项目的“后端”。上次我们使用 HTML、CSS 和 Javascript 创建前端,我们保证用户界面将反映用户和聊天机器人之间的对话。

现在我们需要创建一个服务器,使用express.js配置路由来与Gemini API进行通信。我们走吧!

安装项目依赖项

好吧,我们需要express.js、Google Gemini SDK,为了保护我们的API密钥,我将安装dotenv来使用环境变量。

npm install @google/generative-ai express dotenv

现在我们准备好采用最佳实践创建服务器,例如使用本地环境变量来保护私有数据。

为此,我们将在项目根文件夹中创建一个名为 server.js 的文件。在此文件中,我们将首先导入依赖项并配置必要的资源。

const express = require("express");
require("dotenv").config();
const { GoogleGenerativeAI } = require("@google/generative-ai");

const app = express();
const port = 3000;

const genAI = new GoogleGenerativeAI(process.env.GOOGLE_GEMINI_API_KEY);

app.use(express.static("public"));

app.use(express.json());

此代码将 Express 配置为从“public”文件夹提供静态文件,并接受带有 JSON 负载的请求。这就是为什么我们将index.html、styles.css 和script.js 文件放在这个文件夹中。我们还将应用程序配置为在端口 3000 上运行。

我们使用 @google/generative-ai 库来集成 Gemini API,并使用存储在名为 GOOGLE_GEMINI_API_KEY 的环境变量中的密钥对其进行身份验证。

但是我们从哪里获得这个 API Key 呢?这就是我们现在要找出的。

双子座 API 密钥

获取密钥

要获取 Gemini API 密钥,我建议您登录“@gmail.com”帐户。之后,访问此链接,您将看到如下屏幕:

Criando um Chatbot com JavaScript e Gemini AI: criando o backend

单击“创建 API 密钥”按钮,指定您将在其中使用此密钥的项目,然后就完成了。您的密钥将显示在下方,您可以查看它,甚至可以复制它以进行下一步。

保护您的 API 密钥

现在在您的项目中,在项目的根文件夹中创建一个名为 .env.local 或仅 .env 的文件。在此文件中输入您的 API 密钥,如下所示:

GOOGLE_GEMINI_API_KEY="sua-chave-vai-aqui"

现在保存您的文件即可。如果您正确执行了上一步,您的 API 密钥将起作用。

PS:请注意您的 API 密钥中显示的计划。 Gemini 提供免费计划,您的钥匙可以返还有限数量的代币。如果您想要更多的代币,请考虑订阅付费计划。我们将使用免费计划,该计划虽然有限,但允许我们与聊天机器人交换一些消息。

创建 /chat 路由

现在配置了依赖项并掌握了 API 密钥,让我们打开人工智能的可能性之门。

在 server.js 文件中,我们将创建 /chat 路由:

npm install @google/generative-ai express dotenv

我们的路由是 POST 类型,因为您将在正文中收到一条消息,正是来自将与聊天交互的用户的消息。因此,对于此消息,我们使用了一些防御性编程(小心一点不会伤害任何人,哈哈)并检查我们是否没有收到消息。如果不这样做,则会返回一个错误作为响应,并抛出一条消息。

如果我们有消息,那么我们会将其作为我们选择的模型的提示发送,如下所示:

const express = require("express");
require("dotenv").config();
const { GoogleGenerativeAI } = require("@google/generative-ai");

const app = express();
const port = 3000;

const genAI = new GoogleGenerativeAI(process.env.GOOGLE_GEMINI_API_KEY);

app.use(express.static("public"));

app.use(express.json());

由于此通信是一个异步过程,因此我们将使用 try/catch 来处理响应。首先,我定义将使用的 Gemini 模型(您可以在此链接中查看模型列表)。在这种情况下,我选择了gemini-1.5-flash。

第二步是开始聊天。因此,通过 model.startChat() 我可以开始与 Gemini 通信,配置我想要在响应中的最大令牌数(在本例中每个响应 100 个令牌)。

现在,我们在使用 chat.sendMessage(message) 将消息发送到模型后等待此响应。当我们收到响应时,我们会将其返回给发出请求的人,并将模型返回的文本格式转换为 JSON。

最后但并非最不重要的一点是,如果我们遇到错误,我们可以在 catch 中使用它在控制台中抛出此错误,并返回状态 500,使使用此“迷你 api”的客户端的生活更轻松。美丽?

现在我们只需要使用下面的代码片段来指示我们的“mini api”将在哪里运行:

GOOGLE_GEMINI_API_KEY="sua-chave-vai-aqui"

我们的 api 将在我们一开始指定的端口上运行。完整的server.js代码如下所示:

app.post("/chat", async (req, res) => {
  const { message } = req.body;

  if (!message) {
    return res.status(400).json({ error: "Mensagem não pode estar vazia." });
  }

  //...
});

测试聊天机器人

现在最期待的时刻到了,测试我们的聊天机器人。为此,我们打开终端并输入以下命令:

try {
    const model = genAI.getGenerativeModel({
      model: "gemini-1.5-flash",
    });

    const chat = model.startChat({
      history: [],
      generationConfig: { maxOutputTokens: 100 },
    });

    const result = await chat.sendMessage(message);
    res.json({ response: result.response.text() });
  } catch (error) {
    console.error(error);
    res.status(500).json({ error: "Erro ao processar mensagem." });
  }

运行此命令后,您应该在终端中收到以下消息:

app.listen(port, () => {
  console.log(`Servidor rodando em http://localhost:${port}`);
});

现在,通过访问 URL http://localhost:3000 并在输入中写入消息并按发送按钮,AI 会回复您的消息并将其显示在屏幕上。

Criando um Chatbot com JavaScript e Gemini AI: criando o backend

非常酷,对吧?

结论

至此,我们使用 JavaScript 和 Google Gemini API 完成了聊天机器人的创建。我们了解了如何从头开始创建前端、应用样式、操作 DOM。我们使用express.js创建了一个服务器,使用了Gemini API,配置了一条POST路由来与应用程序客户端通信,并能够通过我们自己开发的接口与AI对话。


但这并不是您能做的全部。我们可以为不同的任务定制和配置这个聊天机器人,从语言助理,到回答你的数学或编程问题的虚拟老师,这将取决于你的创造力。

将人工智能转变为个性化助手需要训练模型,更多的是关于你希望它响应和表现的方式,而不是代码本身。

我们将在以后的文章中探讨其中的一些内容。

到时候见!

以上是使用 JavaScript 和 Gemini AI 创建聊天机器人:创建后端的详细内容。更多信息请关注PHP中文网其他相关文章!

声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
JavaScript数据类型:浏览器和nodejs之间是否有区别?JavaScript数据类型:浏览器和nodejs之间是否有区别?May 14, 2025 am 12:15 AM

JavaScript核心数据类型在浏览器和Node.js中一致,但处理方式和额外类型有所不同。1)全局对象在浏览器中为window,在Node.js中为global。2)Node.js独有Buffer对象,用于处理二进制数据。3)性能和时间处理在两者间也有差异,需根据环境调整代码。

JavaScript评论:使用//和 / * * / * / * /JavaScript评论:使用//和 / * * / * / * /May 13, 2025 pm 03:49 PM

JavaScriptusestwotypesofcomments:single-line(//)andmulti-line(//).1)Use//forquicknotesorsingle-lineexplanations.2)Use//forlongerexplanationsorcommentingoutblocksofcode.Commentsshouldexplainthe'why',notthe'what',andbeplacedabovetherelevantcodeforclari

Python vs. JavaScript:开发人员的比较分析Python vs. JavaScript:开发人员的比较分析May 09, 2025 am 12:22 AM

Python和JavaScript的主要区别在于类型系统和应用场景。1.Python使用动态类型,适合科学计算和数据分析。2.JavaScript采用弱类型,广泛用于前端和全栈开发。两者在异步编程和性能优化上各有优势,选择时应根据项目需求决定。

Python vs. JavaScript:选择合适的工具Python vs. JavaScript:选择合适的工具May 08, 2025 am 12:10 AM

选择Python还是JavaScript取决于项目类型:1)数据科学和自动化任务选择Python;2)前端和全栈开发选择JavaScript。Python因其在数据处理和自动化方面的强大库而备受青睐,而JavaScript则因其在网页交互和全栈开发中的优势而不可或缺。

Python和JavaScript:了解每个的优势Python和JavaScript:了解每个的优势May 06, 2025 am 12:15 AM

Python和JavaScript各有优势,选择取决于项目需求和个人偏好。1.Python易学,语法简洁,适用于数据科学和后端开发,但执行速度较慢。2.JavaScript在前端开发中无处不在,异步编程能力强,Node.js使其适用于全栈开发,但语法可能复杂且易出错。

JavaScript的核心:它是在C还是C上构建的?JavaScript的核心:它是在C还是C上构建的?May 05, 2025 am 12:07 AM

javascriptisnotbuiltoncorc; saninterpretedlanguagethatrunsonenginesoftenwritteninc.1)javascriptwasdesignedAsalightweight,解释edganguageforwebbrowsers.2)Enginesevolvedfromsimpleterterterpretpreterterterpretertestojitcompilerers,典型地提示。

JavaScript应用程序:从前端到后端JavaScript应用程序:从前端到后端May 04, 2025 am 12:12 AM

JavaScript可用于前端和后端开发。前端通过DOM操作增强用户体验,后端通过Node.js处理服务器任务。1.前端示例:改变网页文本内容。2.后端示例:创建Node.js服务器。

Python vs. JavaScript:您应该学到哪种语言?Python vs. JavaScript:您应该学到哪种语言?May 03, 2025 am 12:10 AM

选择Python还是JavaScript应基于职业发展、学习曲线和生态系统:1)职业发展:Python适合数据科学和后端开发,JavaScript适合前端和全栈开发。2)学习曲线:Python语法简洁,适合初学者;JavaScript语法灵活。3)生态系统:Python有丰富的科学计算库,JavaScript有强大的前端框架。

See all articles

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

Video Face Swap

Video Face Swap

使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热门文章

热工具

安全考试浏览器

安全考试浏览器

Safe Exam Browser是一个安全的浏览器环境,用于安全地进行在线考试。该软件将任何计算机变成一个安全的工作站。它控制对任何实用工具的访问,并防止学生使用未经授权的资源。

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

功能强大的PHP集成开发环境

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

DVWA

DVWA

Damn Vulnerable Web App (DVWA) 是一个PHP/MySQL的Web应用程序,非常容易受到攻击。它的主要目标是成为安全专业人员在合法环境中测试自己的技能和工具的辅助工具,帮助Web开发人员更好地理解保护Web应用程序的过程,并帮助教师/学生在课堂环境中教授/学习Web应用程序安全。DVWA的目标是通过简单直接的界面练习一些最常见的Web漏洞,难度各不相同。请注意,该软件中