Java SpringBoot调用大模型AI构建AI应用

本文是一个用springboot 结合spring mvc 和spring ai alibaba 调用国产大模型通义千问的具体例子,按照这个做能够快速的搞定Java应用的调用。

然后就可以把这类应用泛化到所有的涉及到非结构化数据结构化的场景中。

Spring AI:简化Java中大模型调用的框架

当前,在Java springboot 中调用大模型时,缺乏优秀的AI应用框架是一个常见问题。

作为老牌的Java应用框架提供商,Spring 在springboot之外提出了解决方案—Spring AI,它借鉴了langchain的核心理念,并结合了Java面向对象编程的特点。

Spring AI最核心的优势在于提供了统一接口,使得开发者能够编写一次代码后仅通过更改配置即可轻松切换不同的AI实现。

此外,得益于专门团队的支持与维护,Spring AI保证了稳定性和持续更新。以本次样例中的Spring AI Alibaba接入阿里云通义大模型为例,用户在完成初步集成后,同样可以方便地更换为自己所需的其他大模型实现。

这种设计极大简化了开发流程,提高了效率,让Java开发者能更专注于业务逻辑本身而非复杂的AI集成工作。

Spring AI Alibaba功能介绍及应用示例

Spring AI Alibaba是Spring AI的一个实现,它基于Spring AI的API完成了阿里云百炼系列云产品的大模型接入。

与Spring Cloud Alibaba一样,Spring AI Alibaba整合了阿里巴巴的最佳实践,是国内最好的Spring AI实现之一。

Spring AI Alibaba提供了一系列强大的功能和能力,包括但不限于模型调用、Prompt模板、RAG(检索增强生成)、文生图以及图像识别等。

通过使用Spring AI Alibaba,开发者可以轻松地开发基于阿里云通义提供的聊天、图片或语音生成AI应用。

框架还提供了诸如OutputParser、Prompt Template、Stuff等实用工具,帮助简化开发流程。本文将以Prompt模板和模型调用两个能力为例,展示如何接入Spring AI Alibaba,以便为项目增添更多AI功能。

通义千问Qwen在MMLU等测试中超越Llama 3 70B,登顶Hugging Face开源模型榜

通义千问Qwen在MMLU、TheoremQA、GPQA等基准测评中表现出色,超越了Llama 3 70B ,在85+分数,与gpt和claude等同属 第一梯队 ,并在Hugging Face开源大模型排行榜Open LLM Leaderboard上荣登榜首。

MMLU 和 GPQA都是 目前客观评分中最公认的两个评测标准,客观评分来说这俩是最好的。

另外,在真人参与评测的arena里面,它不仅在思南平台 上仅次于国际知名的GPT和Claude系列,还在 Hugging Face的视觉模型竞技场 中稳居中国首位。

基于SpringBoot集成Spring AI Alibaba构建对话模型

为了基于SpringBoot集成Spring AI Alibaba完成一个简单的对话模型,并构建一个支持prompt的流返回接口的项目,我们需要按照以下步骤进行操作。首先,确保您的环境满足前置条件,然后通过阿里云申请必要的API Key,接着在项目中添加相应的依赖和配置,最后实现Controller层逻辑以提供所需功能。

前置要求

  • 确保您的JDK版本不低于17。
  • 使用Spring Boot 3.3.x或以上版本。
  • 已经从阿里云申请到了通义千问(Qwen)的API Key。

步骤一:获取并配置API Key

  1. 登录阿里云百炼页面,开通“百炼大模型推理”服务。
  1. 创建新的API Key并记录下来。
  1. 将API Key作为环境变量导出:
export AI_DASHSCOPE_API_KEY=这里替换为你的实际API Key
  1. application.properties文件中设置API Key:
spring.ai.dashscope.api-key=${AI_DASHSCOPE_API_KEY}

步骤二:添加Spring仓库及项目依赖

由于Spring AI Alibaba目前尚未发布到Maven中央仓库,您需要手动添加Spring的仓库配置来获取相关依赖。请在pom.xml文件中的<repositories>标签下加入以下内容:

<repositories>
    <repository>
      <id>sonatype-snapshots</id>

      <url>https://oss.sonatype.org/content/repositories/snapshots</url>

      <snapshots>
        <enabled>true</enabled>

      </snapshots>

    </repository>

    <repository>
      <id>spring-milestones</id>

      <name>Spring Milestones</name>

      <url>https://repo.spring.io/milestone</url>

      <snapshots>
        <enabled>false</enabled>

      </snapshots>

    </repository>

    <repository>
      <id>spring-snapshots</id>

      <name>Spring Snapshots</name>

      <url>https://repo.spring.io/snapshot</url>

      <releases>
        <enabled>false</enabled>

      </releases>

    </repository>

</repositories>

接着,在<dependencies>部分增加对spring-ai-alibaba-starter的引用:

<dependencies>
  <!-- 其他已存在的依赖项 -->
  <dependency>
    <groupId>com.alibaba.cloud.ai</groupId>

    <artifactId>spring-ai-alibaba-starter</artifactId>

    <version>1.0.0-M2</version>

  </dependency>

  <!-- Spring Boot Starter Web 用于HTTP请求处理 -->
  <dependency>
    <groupId>org.springframework.boot</groupId>

    <artifactId>spring-boot-starter-web</artifactId>

  </dependency>

  <!-- Spring Boot Starter Test 测试库 -->
  <dependency>
    <groupId>org.springframework.boot</groupId>

    <artifactId>spring-boot-starter-test</artifactId>

    <scope>test</scope>

  </dependency>

</dependencies>

步骤三:创建Chat Controller

在您的Spring Boot应用中,创建一个新的Controller类,该类将负责处理来自客户端的GET请求,利用ChatClient实例发送prompt给AI模型,并返回一个Flux<String>类型的响应。这允许数据以流的形式异步地发送回客户端。

下面是一个示例代码:

@RestController
@RequestMapping("/ai")
@CrossOrigin(origins = "*")  // 启用CORS跨域支持
public class ChatController {

  private final ChatClient chatClient;

  public ChatController(ChatClient.Builder builder) {
    this.chatClient = builder.build();
  }

  @GetMapping("/steamChat")
  public Flux<String> steamChat(@RequestParam String input) {
    return this.chatClient.prompt().user(input).stream().content();
  }
}

解释

  • @RestController注解表明这是一个RESTful风格的控制器。
  • @RequestMapping("/ai")定义了所有映射到此类的方法都将使用/ai作为其URL路径前缀。
  • @CrossOrigin(origins = "*")启用跨源资源共享(CORS),允许任何源访问此端点。
  • ChatController构造函数接收一个ChatClient.Builder实例,用来初始化ChatClient
  • @GetMapping("/steamChat")指定了一个GET请求映射至/steamChat路径,并接受名为input的查询参数。
  • 方法steamChat利用chatClient向AI发送用户提供的文本(即input),并通过stream()方法以Flux<String>形式输出AI生成的内容流。

这样,我们就成功搭建了一个基于Spring Boot的应用程序,它能够与阿里云通义千问大模型交互,并通过HTTP GET请求提供一个支持prompt能力的聊天接口。当用户访问http://localhost:8080/ai/steamChat?input=…时,他们将收到由AI模型生成的回答流。

创建React前端应用以支持流式数据输出

构建前端

要基于React构建一个支持流式数据输出的简单项目,你可以按照以下步骤进行。此项目将能够从前端向后端发送消息,并实时显示从后端接收的流式响应。这里假设你的后端已经准备好了一个URL地址http://localhost:8080/ai/steamChat?input=...用于处理请求并返回flux<String>格式的数据。

创建新的React应用

首先,你需要创建一个新的React应用并通过npm安装必要的依赖包。打开终端,运行以下命令:

npx create-react-app frontend
cd frontend
npm install

这将为你设置好一个基础的React项目结构。

修改基本文件配置

接下来,我们只需要对默认生成的一些文件做少量修改或添加自定义组件来实现我们的功能需求。

public/index.html

确保该文件内容如下,它定义了HTML文档的基本结构:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Stream Chat App</title>

</head>

<body>
  <div id="root"></div>

</body>

</html>

src/index.js

保持默认即可,这是React应用的入口点:

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';

ReactDOM.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
  document.getElementById('root')
);

src/App.js

在这个文件中,我们将导入并渲染ChatComponent组件,它是实际负责与用户交互的部分:

import React from 'react';
import ChatComponent from './components/ChatComponent';

function App() {
  return (
    <div className="App">
      <ChatComponent />
    </div>

  );
}

export default App;

src/components/ChatComponent.js

这是最关键的部分,在这里实现了输入框、发送按钮以及用来展示来自服务器的消息流的功能。请注意替换其中的URL以匹配你实际使用的后端服务地址:

import React, { useState } from 'react';

function ChatComponent() {
  const [input, setInput] = useState('');
  const [messages, setMessages] = useState('');

  const handleInputChange = (event) => {
    setInput(event.target.value);
  };

  const handleSendMessage = async () => {
    try {
      const response = await fetch(`http://localhost:8080/ai/steamChat?input=${input}`);
      const reader = response.body.getReader();
      const decoder = new TextDecoder('utf-8');
      let done = false;

      while (!done) {
        const { value, done: readerDone } = await reader.read();
        done = readerDone;
        const chunk = decoder.decode(value, { stream: true });
        setMessages((prevMessages) => prevMessages + chunk);
      }

      // 在每次请求完成后添加换行符
      setMessages((prevMessages) => prevMessages + '\n\n=============================\n\n');
    } catch (error) {
      console.error('Failed to fetch', error);
    }
  };

  const handleClearMessages = () => {
    setMessages('');
  };

  return (
    <div>
      <input
        type="text"
        value={input}
        onChange={handleInputChange}
        placeholder="Enter your message"
      />
      <button onClick={handleSendMessage}>Send</button>

      <button onClick={handleClearMessages}>Clear</button>

      <div>
        <h3>Messages:</h3>

        <pre>{messages}</pre>

      </div>

    </div>

  );
}

export default ChatComponent;

以上代码片段提供了一个完整的聊天界面示例,用户可以输入文本然后点击“Send”按钮发送给服务器。收到的流式响应会被逐段追加到页面上显示出来。

启动应用程序

完成所有这些设置之后,现在可以启动你的React应用了。在项目根目录下执行:

npm start

这会开启开发服务器,默认情况下可以在浏览器访问http://localhost:3000查看效果。确保你的后端服务也已正确配置并且处于运行状态,这样前端就可以成功与其通信了。

通过上述步骤,你就建立了一个简单的基于React的支持流式数据传输的应用程序。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/906881.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

利用frp进行SSH端口转发(内网穿透同理)

题记 公司内网有一台设备&#xff0c;可以根据微步情报来对恶意服务器进行封禁。很不幸我的vps因为开着cs被标记为恶意了&#xff0c;导致我在公司网络连不上我的vps&#xff0c;每次连还要挂代理。于是我打算将我vps的22端口转发到我们公司的vps的10022端口上。本篇文章来自11…

Python基于TensorFlow实现双向循环神经网络GRU加注意力机制分类模型(BiGRU-Attention分类算法)项目实战

说明&#xff1a;这是一个机器学习实战项目&#xff08;附带数据代码文档视频讲解&#xff09;&#xff0c;如需数据代码文档视频讲解可以直接到文章最后关注获取。 1.项目背景 随着深度学习技术的发展&#xff0c;循环神经网络&#xff08;RNN&#xff09;及其变种如门控循环…

CSS、Less、Scss

CSS、Less和SCSS都是用于描述网页外观的样式表语言&#xff0c;但它们各自具有不同的特点和功能。以下是对这三者的详细阐述及区别对比&#xff1a; 详细阐述 CSS&#xff08;Cascading Style Sheets&#xff09; 定义&#xff1a;CSS是一种用来表现HTML或XML等文件样式的计算机…

parted 磁盘分区

目录 磁盘格式磁盘分区文件系统挂载使用扩展 - parted、fdisk、gdisk 区别 磁盘格式 parted /dev/vdcmklabel gpt # 设置磁盘格式为GPT p # 打印磁盘信息此时磁盘格式设置完成&#xff01; 磁盘分区 开始分区&#xff1a; mkpart data_mysql # 分区名&…

OpenCV视觉分析之目标跟踪(9)计算扩展相关系数computeECC()的使用

操作系统&#xff1a;ubuntu22.04 OpenCV版本&#xff1a;OpenCV4.9 IDE:Visual Studio Code 编程语言&#xff1a;C11 算法描述 计算两幅图像之间的增强相关系数值 78 Enhanced Correlation Coefficient (ECC)&#xff1a;增强相关系数是一种用于图像配准的技术&#xff0c…

ESP32-C3 入门笔记03:VScode + flash_download_tool 下载烧录程序(ESP-IDF + PlatformIO)

ESP32-C3 支持多种烧录方式&#xff0c;主要包括以下几种&#xff1a; VS Code 串口烧录&#xff1a;使用 VS Code 配合 PlatformIO 或 ESP-IDF 插件进行串口烧录。串口连接通常使用 UART 接口&#xff0c;通过 USB 转串口芯片与电脑连接。步骤大致如下&#xff1a; 配置 VS Co…

Java使用apache.commons.io框架下的FileUtils类实现文件的写入、读取、复制、删除

Apache Commons IO 是 Apache 开源基金组织提供的一组有关IO&#xff08;Input/Output&#xff09;操作的小框架&#xff0c;它是 Apache Commons 项目的一部分&#xff0c;专注于提供简单易用的 API&#xff0c;用于处理输入和输出操作。Apache Commons IO 是一个功能强大的 J…

Mac 电脑 使用sudo创建项目后,给了读写权限,仍报权限问题

问题&#xff1a;sudo创建的项目&#xff0c;都已经改成读写权限了&#xff0c;但是修改项目中的内容还是报没权限。 原因&#xff1a;当你使用 sudo 创建项目时。这是因为 sudo 会以 root 用户的身份创建文件和目录&#xff0c;这些文件和目录默认属于 root 用户&#xff0c;…

3. keil + vscode 进行stm32协同开发

1. 为什么使用vscode 主要还是界面友好&#xff0c;使用习惯问题&#xff0c;vscode 从前端&#xff0c;js, c/c, qt, 仓颉&#xff0c;rust都有很好插件的支持&#xff0c;并且有romote&#xff0c; wsl 等很多插件可以提高效率&#xff0c; 唯一的问题就是要使用插件进行环境…

Spring MVC 完整生命周期和异常处理流程图

先要明白 // 1. 用户发来请求: localhost:8080/user/1// 2. 处理器映射器(HandlerMapping)的工作 // 它会找到对应的Controller和方法 GetMapping("/user/{id}") public User getUser(PathVariable Long id) {return userService.getById(id); }// 3. 处理器适配…

Hadoop生态圈框架部署(四)- Hadoop完全分布式部署

文章目录 前言一、Hadoop完全分布式部署&#xff08;手动部署&#xff09;1. 下载hadoop2. 上传安装包2. 解压hadoop安装包3. 配置hadoop配置文件3.1 虚拟机hadoop1修改hadoop配置文件3.1.1 修改 hadoop-env.sh 配置文件3.3.2 修改 core-site.xml 配置文件3.3.3 修改 hdfs-site…

【智能算法应用】天鹰优化算法求解二维路径规划问题

摘要 路径规划问题在机器人和无人机导航中起着关键作用。本文提出了一种基于天鹰优化算法的二维路径规划方法。天鹰优化算法&#xff08;Eagle Strategy Optimization, ESO&#xff09;通过模拟天鹰的捕猎行为&#xff0c;寻找最优路径。实验结果显示&#xff0c;该算法能够有…

数据结构之二叉树——堆 详解(含代码实现)

1.堆 如果有一个关键码的集合 K { &#xff0c; &#xff0c; &#xff0c; … &#xff0c;}&#xff0c;把它的所有元素按完全二叉树的顺序存储方式存储 在一个一维数组中&#xff0c;则称为小堆( 或大堆 ) 。将根节点最大的堆叫做最大堆或大根堆&#xff0c;根节点最小的…

【机器学习】25. 聚类-DBSCAN(density base)

聚类-DBSCAN-density base 1. 介绍2. 实现案例计算 3. K-dist4. 变化密度5. 优缺点 1. 介绍 DBSCAN – Density-Based Spatial Clustering of Applications with Noise 与K-Means查找圆形簇相比&#xff0c;DBSCAN可以查找任意形状和复杂形状的簇&#xff0c;如S形、椭圆、半圆…

MongoDB 8.0.3版本安装教程

MongoDB 8.0.3版本安装教程 一、下载安装 1.进入官网 2.选择社区版 3.点击下载 4.下载完成后点击安装 5.同意协议&#xff0c;下一步 6.选择第二个Custon&#xff0c;自定义安装 7.选择安装路径 &#xff01;记住安装路径 8.默认&#xff0c;下一步 9.取…

怎么做才能降低APP用户的卸载率?

常年困扰 App 开发者的始终是一个问题&#xff1a;怎么做才能降低用户卸载率呢&#xff1f; 不要慌&#xff0c;今天这篇文章里&#xff0c;你就会找到解决方案啦。首先请记住&#xff1a; 每个 App 都是有自己独立个性的&#xff0c;所以没有一个通用的公式能让大家套用。 还…

elasticsearch 8.x 插件安装(三)之拼音插件

elasticsearch 8.x 插件安装&#xff08;三&#xff09;之拼音插件 elasticsearch插件安装合集 elasticsearch插件安装&#xff08;一&#xff09;之ik分词器安装&#xff08;含MySQL更新&#xff09; elasticsearch 8.x插件&#xff08;二&#xff09;之同义词安装如何解决…

CSP-J2024入门级T3:小木棍

题目链接 CSP-J2024T3:小木棍 题目描述 小 S 喜欢收集小木棍。在收集了 n n n 根长度相等的小木棍之后,他闲来无事,便用它们拼起了数字。用小木棍拼每种数字的方法如下图所示。 现在小 S 希望拼出一个正整数,满足如下条件: 拼出这个数恰好使用

Python小游戏19——滑雪小游戏

运行效果 python代码 import pygame import random # 初始化Pygame pygame.init() # 设置屏幕尺寸 screen_width 800 screen_height 600 screen pygame.display.set_mode((screen_width, screen_height)) pygame.display.set_caption("滑雪小游戏") # 定义颜色 WH…

哪个牌子的宠物空气净化器好?口碑好的宠物空气净化器推荐!

哪个牌子的宠物空气净化器好&#xff1f;作为一名家电测评博主&#xff0c;我发现市面上宠物空气净化器的牌子越来越多了&#xff0c;很多厂家都看中了宠物行业的红利&#xff0c;想来分一杯羹&#xff0c;这就导致很多技术不成熟的产品流入了市场。今年我测试了50多台宠物空气…