Spring有Spring AI这个项目,不过这里找到了另一个项目Deepseek4j,也是个Spring starter,提供了一个基础框架用来承接各种ds大模型,可以对接包括本地部署的Ollama r1,腾讯、硅基流动、阿里、火山引擎这些版本的R1模型或V3模型,比较方便。以下是一个简单实践。
前端ai.html --> 后端SpringBoot + Deepseek4j --> 阿里云大模型服务平台百炼上的Deepseek R1满血版
使用Deepseek4j接入阿里云百炼DeepSeek R1满血版
先去阿里云大模型服务平台“百炼”上进行注册,获得API_KEY
-
本地搭建SpringBoot + Deepseek4j
pom.xml 增加如下依赖,其他依赖略,SpringMVC项目或WebFlux都可以。
<dependency> <groupId>io.github.pig-mesh.ai</groupId> <artifactId>deepseek-spring-boot-starter</artifactId> <version>1.4.2</version> </dependency>
controller
import io.github.pigmesh.ai.deepseek.core.DeepSeekClient; import io.github.pigmesh.ai.deepseek.core.chat.ChatCompletionResponse; import lombok.extern.slf4j.Slf4j; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.http.MediaType; import org.springframework.web.bind.annotation.GetMapping; import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.bind.annotation.RestController; import reactor.core.publisher.Flux; @Slf4j @RestController @RequestMapping("ai") public class AiController { @Autowired private DeepSeekClient deepSeekClient; @GetMapping(value = "/chat", produces = MediaType.TEXT_EVENT_STREAM_VALUE) public Flux<ChatCompletionResponse> chat(String prompt) { return deepSeekClient.chatFluxCompletion(prompt); } }
application.properties文件
deepseek.base-url=https://dashscope.aliyuncs.com/compatible-mode/v1 deepseek.model=deepseek-r1 deepseek.api-key=百炼上申请的API_KEY deepseek.log-requests=true deepseek.log-responses=true deepseek.connect-timeout=10 deepseek.read-timeout=30 deepseek.call-timeout=60
-
写个测试问答api页面ai.html
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>AI 问答测试页面(优化版)</title> <style> body { font-family: Arial, sans-serif; margin: 20px; max-width: 800px; } textarea { width: 100%; height: 100px; margin: 10px 0; padding: 8px; box-sizing: border-box; } .response-area { border: 1px solid #ddd; border-radius: 4px; margin: 10px 0; padding: 10px; background-color: #f8f9fa; } #reasoning { background-color: #fff; max-height: 200px; overflow-y: auto; } #answer { white-space: pre-wrap; min-height: 100px; } .toggle-header { cursor: pointer; color: #666; padding: 5px; background-color: #f0f0f0; border-radius: 3px; margin: 5px 0; } button { padding: 10px 20px; background-color: #007bff; color: white; border: none; border-radius: 4px; cursor: pointer; } button:hover { background-color: #0056b3; } </style> </head> <body> <h1>AI 问答 API 测试</h1> <textarea id="prompt" placeholder="请输入问题..."></textarea><br> <button id="send">发送</button> <h2>回答结果:</h2> <div class="response-area" id="answer"></div> <details> <summary class="toggle-header">推理过程(点击展开)</summary> <div class="response-area" id="reasoning"></div> </details> <script> let eventSource = null; document.getElementById('send').addEventListener('click', function() { const prompt = document.getElementById('prompt').value; if (!prompt) { alert("请输入问题"); return; } // 关闭已有连接 if (eventSource) { eventSource.close(); } // 清空显示区域 document.getElementById('answer').textContent = ""; document.getElementById('reasoning').textContent = ""; const url = `/ai/chat?prompt=${encodeURIComponent(prompt)}`; eventSource = new EventSource(url); eventSource.onmessage = (e) => { try { const data = JSON.parse(e.data); const delta = data.choices[0].delta; // 处理推理内容 if (delta.reasoning_content !== undefined) { const reasoningElement = document.getElementById('reasoning'); reasoningElement.textContent += delta.reasoning_content; reasoningElement.scrollTop = reasoningElement.scrollHeight; } // 处理最终回答 if (delta.content !== undefined) { const answerElement = document.getElementById('answer'); answerElement.textContent += delta.content; answerElement.scrollTop = answerElement.scrollHeight; } } catch (err) { console.error('数据解析错误:', err); } }; eventSource.onerror = (e) => { console.error("SSE连接错误:", e); if (eventSource) { eventSource.close(); eventSource = null; } }; }); </script> </body> </html>
效果:
测试效果
参考和进一步阅读
前端如何与后端响应式类型API交互
https://blog.csdn.net/waiter456/article/details/141114447
https://www.ruanyifeng.com/blog/2017/05/server-sent_events.html
Spring AI整合
https://javaai.pig4cloud.com/deepseek/bailian
https://www.cnblogs.com/guoxiaoyu/p/18700826
通过阿里云百炼平台调用DeepSeek-R1 满血版 API
https://www.aliyun.com/solution/tech-solution/deepseek-r1-for-platforms