掘金 人工智能 02月14日
一分钟用Taro接入DeepSeek
index_new5.html
../../../zaker_core/zaker_tpl_static/wap/tpl_guoji1.html

 

本文介绍了如何在腾讯云开发的小程序中集成 DeepSeek 大模型。首先,通过腾讯云官方示例代码和云开发内置的 AI 大模型功能,无需额外库即可在小程序中使用 AI 能力。接着,初始化 Taro 项目,并获取云开发环境 ID。然后,封装 utils 文件,创建 DeepSeek 模型,并调用生成文本大模型,接收用户消息并返回内容。最后,在首页初始化并调用 DeepSeek 模型,实现快速的消息发送和接收功能,体验 AI 在小程序中的应用。

🚀 腾讯云小程序现已集成 DeepSeek,无需繁琐配置即可体验强大的 AI 能力,元宝也同步接入,为开发者提供更便捷的 AI 接口选择。

🛠️ 通过腾讯云开发官方示例,开发者可以快速上手,利用云开发内置的 AI 大模型功能,省去安装额外库的步骤,极大地简化了小程序集成 AI 的流程。

📝 文章详细展示了 Taro 项目的初始化过程,包括安装 Taro 脚手架、初始化模版、安装依赖等步骤,为开发者提供了清晰的操作指南。

💡 封装了 utils 文件,方便在不同地方调用 DeepSeek 模型,通过创建文本大模型,实现接收用户消息并生成内容返回的功能,简化了代码调用过程。

⚡️ 实际测试表明,集成 DeepSeek 后的小程序消息发送和接收速度非常快,为用户带来了流畅的 AI 交互体验。

昨天一大早发现腾讯官方的小程序集成了DeepSeek,元宝也接入了DeepSeek,之前一直想接入DeepSeek的api,但是官方服务器一直繁忙,这次终于来了个靠谱的,赶紧试用一下一、查看官方文档1、来到腾讯云官方,官方已经给了示例代码tcb.cloud.tencent.com/dev?envId=c…2、而且云开发官方直接内置了AI大模型功能,这下只要开通了云开发就能直接在小程序里使用,不需要安装其他多余的库了,非常棒!!!二、初始化Taro项目来到Taro官方,按这里指引就可以创建了,不多赘述了执行命令,先安装 taro脚手架,npm install -g @tarojs/cli ,当然也可以用npx更简单然后初始化模版 taro init myApp接着快速安装一下依赖然后就可以起项目了,用vscode打开,终端输入命令npm run dev:weapp,用微信开发者功能打开dist三、获取云开发的环境Id点击左上角云开发,如果是灰色,需要自行开通复制拿到云开发id,接着开始代码部分四、接入DeepSeek我准备了一个非常简陋的模版做试用,上面一个简单的输入框,点击下方按钮发送消息,然后接收发来的消息,测试过了,速度非常快这是模版代码<View> <View> {messages.map((message, index) => ( <View key={index} className={message.role === "user" ? "user" : "assistant"} > <Text>-{message.role}:</Text> <Text>{message.content}</Text> </View> ))} </View> <Input type="text" value={inputValue} placeholder="请输入内容" onInput={(e) => setInputValue(e.detail.value)} /> <Button onClick={handleSend}>Send</Button> </View>3. 这里我封装了一个utils文件,方便之后在别的地方调用因为官方的typescript还没有更新extend,所以按照官方的方法会报类型错误,所以这里直接把Taro.cloud声明为any,当然按照官方也没有问题,类型报错不影响运行接着我们创建DeepSeek模型,简单的调用一下生成文本大模型,接收用户消息,然后生成内容返回混元模型也是同样的,这里是完整的util代码import Taro from "@tarojs/taro";export const initAIModel: any = (modelName = "hunyuan-exp") => { Taro.cloud.init({ env: "cloud1-xxxx", }); const cloud = Taro.cloud as any; console.log("initAI", cloud.extend); const AI = cloud.extend.AI; return AI.createModel(modelName); }export const HyAIModel = initAIModel();export const getHyText = async ({content}:{content: string}) => { const res = await HyAIModel.generateText({ model: "hunyuan-lite", messages: [{ role: "user", content }], }); console.log(res); return res.choices[0].message};export const DsAIModel = initAIModel("deepseek");export const getDsText = async ({content}:{content: string}) => { const res = await DsAIModel.generateText({ model: "deepseek-r1", messages: [{ role: "user", content }], }); console.log(res); return res.choices[0].message};7. 然后我们来到首页,先初始化,然后调用import { DsAIModel, getDsText } from "@/utils/aiUtil";import { Button, Input, Text, View } from "@tarojs/components";import { useEffect, useState } from "react";function TxaiChat() { const [messages, setMessages] = useState<any>([]); const [inputValue, setInputValue] = useState(""); useEffect(() => { console.log("DsAIModel", DsAIModel); }, []); const handleSend = () => { if (inputValue.trim()) { setMessages([...messages, { content: inputValue, role: "user" }]); setInputValue(""); getDsText({ content: inputValue }).then((res) => { console.log("getHyText", res); setMessages([ ...messages, { content: inputValue, role: "user" }, { ...res }, ]); console.log("messages", messages); }); } }; return ( <View> <View> {messages.map((message, index) => ( <View key={index} className={message.role === "user" ? "user" : "assistant"} > <Text>-{message.role}:</Text> <Text>{message.content}</Text> </View> ))} </View> <Input type="text" value={inputValue} placeholder="请输入内容" onInput={(e) => setInputValue(e.detail.value)} /> <Button onClick={handleSend}>Send</Button> </View> );}export default TxaiChat;8. 最后我们测试一波,速度还是比较快的

Fish AI Reader

Fish AI Reader

AI辅助创作,多种专业模板,深度分析,高质量内容生成。从观点提取到深度思考,FishAI为您提供全方位的创作支持。新版本引入自定义参数,让您的创作更加个性化和精准。

FishAI

FishAI

鱼阅,AI 时代的下一个智能信息助手,助你摆脱信息焦虑

联系邮箱 441953276@qq.com

相关标签

DeepSeek 小程序 腾讯云开发 AI集成 Taro
相关文章