当前位置: 首页 > news >正文

调用DeepSeek官方的API接口

效果

前端样式体验链接:https://livequeen.top/deepseekshow

准备工作

1、注册deepseek官网账号

地址:DeepSeek

点击进入右上角【API开放平台】,并进行账号注册。

 

2、注册完成后,依次点击【API keys】-【生成API key】,记住自己保存好API keys,他只会显示一次,如果忘了,就要重新生成了!

然后点击【接口文档】,就可以看到官方API文档了!

3、在接口文档中,点击【首次调用API】,然后选择对应的语言,就可以看到示例代码了

代码示例

这里用vue+node.js做一个上面效果动态图简单示例

一、后端

1、 引入依赖,在终端中输入如下指令

npm install openai

2、新建一个工具类【deepseek.js】,用于执行deepseek的API并返回结果,如下(可直接复制):

// Please install OpenAI SDK first: `npm install openai`
const OpenAI = require('openai')// api参数配置
const openai = new OpenAI({baseURL: 'https://api.deepseek.com',apiKey: 'sk-c63c***********************e1e0b70'
})/*** message 消息列表*    role 角色*    content 对话内容*    name 某个角色的参与者,用于区分相同角色(选填)* model   模型 [deepseek-chat, deepseek-reasoner] deepseek-chat 模型已全面升级为 DeepSeek-V3。*/
async function deepSeekChat (contents) {// 执行获取结果const completion = await openai.chat.completions.create({messages: [{role: 'system',content: contents}],model: 'deepseek-chat'})// 返回结果return completion.choices[0].message.content
}module.exports = {deepSeekChat
}

3、在你自己的后端接口中通过异步调用的方式,来传参调用上面工具类里面的deepSeekChat()方法 ,如下:

// 引用前面deepseek工具类的方法
const {deepSeekChat} = require('../utils/deepseek')// 后端接口(异步)
router.post('/deepseek', async (req, res) => {// 调用前面deepseek工具类的方法let data = await deepSeekChat(req.body.contents)// 返回结果res.end(JSON.stringify({traceId: req.traceId,code: 200,data: data}))
})

 二、前端

1、h5布局

<template><div class="mess_dialog" v-loading="isloading"><!-- 对话框头部 --><div class="dlog_header"><h1>DeepSeek对话</h1></div><!-- 对话框内容 --><div id="content_overflow" class="dlog_content" ref="scrollContainer" @scroll="handleScroll"><div v-for="(item, index) in messnowList" :key="index" class="dlog_content_item" style="margin-left: 5px;"><!-- AI消息展示 --><div v-if="item.role === 'system'" class="content_other"><!-- 头像 --><div><el-avatar :size="35" :src="require('../../../assets/image/ai.png')" style="margin-top: 5px;"></el-avatar></div><div class="mess_other"><!-- 发送时间 --><div><span style="font-size: 8px;">{{item.date}}</span></div><!-- 发送内容 --><div class="content_other_bgd"><span class="mess_content_msg">{{item.content}}</span></div><!-- 复制按钮 --><div class="iconCopy" @click="onCopy(item.content)"><i class="el-icon-copy-document"></i></div></div></div><!--本用户的消息展示--><div v-else-if="item.role === 'user'" class="content_me"><div class="mess_me"><!-- 发送时间 --><div><span style="font-size: 8px;">{{item.date}}</span></div><!-- 发送内容 --><div class="content_me_bgd"><span class="mess_content_msg">{{item.content}}</span></div></div><!-- 头像 --><div><el-avatar :size="35" :src="userAvatar" style="margin-top: 5px;"></el-avatar></div></div></div></div><!--对话框底部--><div class="dlog_footer"><div class="footer_content"><el-input type="textarea" :rows="4" v-model="mess" maxlength="500" show-word-limit @keydown.enter.native="keyDown"></el-input><el-button type="primary" @click="Wssendmess()" style="float: right;margin-top: 5px;">发送</el-button></div></div></div>
</template>

2、css样式

<style scoped>
.mess_dialog {height: 100%;width: 100%;max-width: 800px;position: relative;margin: 0 auto;display: flex;flex-direction: column; /* 垂直排列 */
}
.dlog_header {display: flex;justify-content: center;flex: 1;
}
.dlog_content {flex: 7;overflow-y: auto;overflow-x: hidden;
}
.content_other{width: 80%;display: flex;justify-content: flex-start;margin: 11px 18px;
}
.mess_other{text-align: left;margin-left: 10px;
}
.content_me{width: 80%;display: flex;justify-content: flex-end;float: right;margin: 11px 18px;
}
.mess_me{text-align: right;margin-right: 10px;
}
.mess_content_msg{font-size: 16px;font-weight: 300;margin: 2px;
}
/*其他用户的气泡*/
.content_other_bgd {border-radius: 6px;position: relative;display: inline-block;padding: 0px 6px;width: auto;height: auto;line-height: 34px;background: #e3e1e1;z-index: 0;
}
/*气泡前的小三角指向*/
.content_other_bgd::before {border-style: solid;border-width: 0 11px 11px 0;border-color: transparent #e3e1e1 transparent transparent;content: "";position: absolute;top: 10px; left: -8px;margin-top: -9px;display: block;width: 0px;height: 0px;z-index: 0;
}
/*我方的气泡*/
.content_me_bgd {border-radius: 6px;position: relative;display: inline-block;padding: 0px 6px;width: auto;height: auto;line-height: 34px;background: #95ec69;z-index: 0;text-align: left;
}
.content_me_bgd::after {border-style: solid;border-width: 0 0 11px 11px;border-color: transparent transparent transparent #95ec69;content: "";position: absolute;top: 10px; right: -8px;margin-top: -10px;display: block;width: 0px;height: 0px;z-index: -1;
}
.iconCopy{padding: 7px;margin-top: 3px;width: 20px;border-radius: 5px;display: flex;justify-content: center;
}
.el-icon-copy-document{color: #a2a2a2;
}
.iconCopy:hover {background-color: #ecebeb;
}
.iconCopy:hover  .el-icon-copy-document{color: #3d9aff;
}
.iconCopy:active {background-color: #dedede;
}
.iconCopy:active  .el-icon-copy-document{color: #0b7bf5;
}
.dlog_footer{width: 100%;flex: 2;padding: 10px 0;
}
</style>

3、js函数

<script>
import userAvatar from '@/assets/image/userAvatar.png'
import moment from 'moment/moment'
import cookie from '../../../utils/cookie'
import base from '../../../api/base'export default {name: 'Index',data () {return {mess: '', // 输入的信息userAvatar: userAvatar, // 默认用户头像autoScroll: true, // 是否需要自动滚动到底部messnowList: [], // 当前对话用户的-聊天内容列表isloading: false // 加载中,默认关闭}},watch: {// 监听当前消息列表,更新时,保持滚动条位于底部messnowList: {handler (newValue, oldValue) {this.scrollToBottom()},deep: true}},methods: {// 监听用户滑动情况,判断是否需要自动定位底部handleScroll () {// 绑定组件const container = this.$refs.scrollContainer// 判断用户是否手动向上滚动超过底部位置30pxif (container.scrollHeight - container.scrollTop - container.clientHeight > 50) {this.autoScroll = false // 用户手动滚动,停止自动滚动} else {this.autoScroll = true // 用户滚动到底部,恢复自动滚动}},// 定位到底部scrollToBottom () {this.$nextTick(() => {var message = document.getElementById('content_overflow')if (this.autoScroll) {// 滚动滑钮到滚动条顶部的距离=滚动条的高度message.scrollTop = message.scrollHeight}})},// enter发送消息,ctrl+enter换行keyDown (e) {if (e.ctrlKey && e.keyCode === 13) { // 用户点击了ctrl+enter触发this.mess += '\n'} else { // 用户点击了enter触发this.Wssendmess()e.preventDefault() // 阻止浏览器默认换行操作return false}},// 发送按钮Wssendmess () {var message = this.mess.trim()this.mess = ''// 开启加载this.isloading = true// 判断是否有字符输入if (message === null | message === '') {this.$notify({title: '提示',message: '发送内容不能为空!',type: 'warning'})// 关闭加载this.isloading = false} else {// 用户发言,恢复自动滚动this.autoScroll = true// 保存到数据集合中let date = moment().format('YYYY-MM-DD HH:mm:ss')let item = this.data_rule('user', message, date)this.messnowList.push(item)// 执行接口this.$api.deepseek(message).then(res => {// 关闭加载this.isloading = falseif (res.data.code === 200) {this.chatAI(res.data.data)} else {this.chatAI('服务器繁忙,请稍后重试!')}}).catch(err => {// 关闭加载this.isloading = falsethis.chatAI('服务器繁忙,请稍后重试!')console.log(err)})}},// 规范数据格式data_rule (role, content, date) {return {role: role,content: content,date: date}},/*** 模拟AI机器人打字效果* @param content 返回的全部文本*/chatAI (content) {// 获取返回结果let data = content// 临时储存结果(一个个字符)let dataTemp = data[0]let date = moment().format('YYYY-MM-DD HH:mm:ss')// 循环一个个字符赋予,模拟机器人打字效果let item2 = this.data_rule('system', dataTemp + '_', date)this.messnowList.push(item2)let nowSize = this.messnowList.length - 1if (data.length > 1) {for (let i = 1; i < data.length; i++) {setTimeout(() => {if (i === data.length - 1) {dataTemp = dataTemp + data[i]item2 = this.data_rule('system', dataTemp, date)} else {dataTemp = dataTemp + data[i]item2 = this.data_rule('system', dataTemp + '_', date)}this.messnowList[nowSize] = item2// 更新组件监听this.$forceUpdate()// 更新滚动条定位this.scrollToBottom()}, 100 * i)}}},// 复制按钮onCopy (content) {// 复制到粘贴板navigator.clipboard.writeText(content).then(() => {this.$message.success('复制成功')}).catch(err => {this.$message.error('复制失败,原因:' + err)})}}
}
</script>

相关文章:

调用DeepSeek官方的API接口

效果 前端样式体验链接&#xff1a;https://livequeen.top/deepseekshow 准备工作 1、注册deepseek官网账号 地址&#xff1a;DeepSeek 点击进入右上角【API开放平台】&#xff0c;并进行账号注册。 2、注册完成后&#xff0c;依次点击【API keys】-【生成API key】&#x…...

C++--iomanip库

目录 1. 设置字段宽度&#xff1a;std::setw() 2. 设置浮点数精度&#xff1a;std::setprecision() 3. 设置填充字符&#xff1a;std::setfill() 4. 控制对齐方式&#xff1a;std::left 和 std::right&#xff0c;std::internal 5. 控制进制输出&#xff1a;std::hex、std…...

程序诗篇里的灵动笔触:指针绘就数据的梦幻蓝图<8>

大家好啊&#xff0c;我是小象٩(๑ω๑)۶ 我的博客&#xff1a;Xiao Xiangζั͡ޓއއ 很高兴见到大家&#xff0c;希望能够和大家一起交流学习&#xff0c;共同进步。 今天我们复习前面学习的指针知识 目录 关于指针数组和数组指针的区别指针数组&#xff08;Array of Poi…...

redo和binlog区别

事务是数据库区别于文件系统的最重要功能&#xff0c;数据库事务支持ACID四个特性&#xff0c;其中I&#xff1a;隔离性是通过锁的方式实现的&#xff0c;剩下的A&#xff1a;原子性 C&#xff1a;一致性 D&#xff1a;持久性是通过redo日志、undo日志、binlog日志来实现的。 我…...

2.11学习记录

web——CTFHub XSS学习 学习资料&#xff1a;xss&#xff08;跨站攻击&#xff09; 原理 1.黑客发送带有xss恶意脚本的链接给用户 2.用户点击了恶意链接&#xff0c;访问了目标服务器&#xff08;正常的服务器&#xff09; 3.目标服务器&#xff08;正常的服务器&#xff09…...

Packer 手动修复安装腾讯云插件

文章目录 Packer [腾讯云插件文档](https://developer.hashicorp.com/packer/integrations/hashicorp/tencentcloud) 提供的版本&#xff1a;v1.2.0&#xff0c;目前 Packer 构建镜像时&#xff0c;不支持现有2种[硬盘类型](https://www.tencentcloud.com/zh/document/product/…...

【探索未来科技】2025年国际学术会议前瞻

【探索未来科技】2025年国际学术会议前瞻 【探索未来科技】2025年国际学术会议前瞻 文章目录 【探索未来科技】2025年国际学术会议前瞻前言1. 第四届电子信息工程、大数据与计算机技术国际学术会议&#xff08; EIBDCT 2025&#xff09;代码示例&#xff1a;机器学习中的线性回…...

【Elasticsearch】Bucket Count K-S Test 聚合

Bucket Count K-S Test是 Elasticsearch 中的一种兄弟管道聚合&#xff08;sibling pipeline aggregation&#xff09;&#xff0c;用于执行双样本柯尔莫哥洛夫-斯米尔诺夫检验&#xff08;Kolmogorov-Smirnov Test&#xff0c;简称 K-S 检验&#xff09;。这种聚合主要用于比较…...

LINUX——基础指令

引言 Linux 操作系统以其强大的命令行工具著称&#xff0c;掌握基础指令是高效使用 Linux 的必备技能。无论是文件管理、文本处理还是系统监控&#xff0c;命令行都能以极简的操作完成复杂任务。本文系统梳理 Linux 最核心的 30 基础指令&#xff0c;配合实际场景案例和进阶技…...

Expo运行模拟器失败错误解决(xcrun simctl )

根据你的描述&#xff0c;问题主要涉及两个方面&#xff1a;xcrun simctl 错误和 Expo 依赖版本不兼容。以下是针对这两个问题的解决方案&#xff1a; 解决 xcrun simctl 错误 错误代码 72 通常表明 simctl 工具未正确配置或路径未正确设置。以下是解决步骤&#xff1a; 确保 …...

Spring中常见的设计模式

Spring框架是一个庞大的生态系统&#xff0c;设计模式的应用广泛分布在其各个模块中。以下是针对你提到的设计模式&#xff0c;在Spring源码中的具体应用位置&#xff1a; 单例模式&#xff08;Singleton Pattern&#xff09;&#xff1a; 在org.springframework.beans.factory…...

502 Bad Gateway 错误详解:从表现推测原因,逐步排查直至解决

502 Bad Gateway 错误通常意味着服务器之间的通信失败&#xff0c;但导致的具体原因往往因场景而异。 场景一&#xff1a;高峰期频繁出现 502 错误 1.1 现象 在流量高峰期间&#xff08;如促销活动、直播发布等&#xff09;&#xff0c;页面访问变慢甚至出现 502 错误&#…...

【DeepSeek】deepseek可视化部署

目录 1 -> 前文 2 -> 部署可视化界面 1 -> 前文 【DeepSeek】DeepSeek概述 | 本地部署deepseek 通过前文可以将deepseek部署到本地使用&#xff0c;可是每次都需要winR输入cmd调出命令行进入到命令模式&#xff0c;输入命令ollama run deepseek-r1:latest。体验很…...

基于STM32的ADS1230驱动例程

自己在练手项目中用到了ADS1230&#xff0c;根据芯片手册自写的驱动代码&#xff0c;已测可用&#xff0c;希望对将要用到ADS1230芯片的人有所帮助。 芯片&#xff1a;STM32系列任意芯片、ADS1230 环境&#xff1a;使用STM32CubeMX配置引脚、KEIL 部分电路&#xff1a; 代码…...

计算机毕业设计springboot+vue.js就业数据采集分析平台 mybatis-plus(LW文档+PPT+讲解+代码安装)

温馨提示&#xff1a;文末有 CSDN 平台官方提供的学长联系方式的名片&#xff01; 温馨提示&#xff1a;文末有 CSDN 平台官方提供的学长联系方式的名片&#xff01; 温馨提示&#xff1a;文末有 CSDN 平台官方提供的学长联系方式的名片&#xff01; 作者简介&#xff1a;Java领…...

关于“#pragma arm section zidata = “mgr_buffer_section“的解析

#pragma arm section zidata “mgr_buffer_section” 是 ARM 编译器特有的指令&#xff0c;用于控制变量在内存中的分配位置。其作用如下&#xff1a; 核心解析 #pragma arm section 这是 ARM 编译器支持的编译指示&#xff08;pragma&#xff09;&#xff0c;用于指定代码或…...

【MySQL】InnoDB存储页的独立表空间

目录 1、背景2、独立表空间【1】表空间大小【2】区【3】组【4】段【5】区的类型【6】XDES Entry区结构【7】XDES Entry链表【8】XDES Entry链表基节点【9】INODE Entry段结构【10】FIL_PAGE_TYPE_FSP_HDR页类型【11】FIL_PAGE_IBUF_BITMAP页类型【12】FIL_PAGE_INODE页类型【13…...

RabbitMQ的死信队列的产生与处理

死信队列&#xff08;Dead Letter Queue, DLQ&#xff09; 1. 死信&#xff08;Dead Letter&#xff09;是怎么产生的&#xff1f; 在 RabbitMQ 中&#xff0c;消息会变成 死信&#xff08;Dead Letter&#xff09;的常见情况有以下几种&#xff1a; 消息被拒绝&#xff08;R…...

二分算法篇:二分答案法的巧妙应用

二分算法篇&#xff1a;二分答案法的巧妙应用 那么看到二分这两个字想必我们一定非常熟悉&#xff0c;那么在大学期间的c语言的教学中会专门讲解二分查找&#xff0c;那么我们来简单回顾一下二分查找算法&#xff0c;我们知道二分查找是在一个有序的序列中寻找一个数在这个序列…...

实现:多活的基础中间件

APIRouter &#xff1a; 路由分发服务 API Router 是一个 HTTP 反向代理和负载均衡器&#xff0c;部署在公有云中作为 HTTP API 流量的入口&#xff0c;它能识别 出流量的归属 shard &#xff0c;并根据 shard 将流量转发到对应的 ezone 。 API Router 支持多种路由键&am…...

【分布式理论9】分布式协同:分布式系统进程互斥与互斥算法

文章目录 一、互斥问题及分布式系统的特性二、分布式互斥算法1. 集中互斥算法调用流程优缺点 2. 基于许可的互斥算法&#xff08;Lamport 算法&#xff09;调用流程优缺点 3. 令牌环互斥算法调用流程优缺点 三、三种算法对比 在分布式系统中&#xff0c;多个应用服务可能会同时…...

百问网imx6ullpro调试记录(linux+qt)

调试记录 文章目录 调试记录进展1.开发板相关1.1百问网乌班图密码 1.2 换设备开发环境搭建串口调试网络互通nfs文件系统挂载 1.3网络问题1.4系统启动1.5进程操作 2.QT2.1tslib1.获取源码2.安装依赖文件3.编译 2.2qt移植1.获取qt源码2.配置编译器3.编译 2.3拷贝到开发板1.拷贝2.…...

微信小程序如何使用decimal计算金额

第三方库地址&#xff1a;GitHub - MikeMcl/decimal.js: An arbitrary-precision Decimal type for JavaScript 之前都是api接口走后端计算&#xff0c;偶尔发现这个库也不错&#xff0c;计算简单&#xff0c;目前发现比较准确 上代码 导入js import Decimal from ../../uti…...

win32汇编环境,对线程的创建与操作示例二

;运行效果 ;win32汇编环境,对线程的创建与操作示例二 ;本文主要是实现用CreateThread创建线程时,如何把参数传入进去 ;以下举3个例子说明,如何把数值、字符串和自定义结构传入线程之中 ;下面为asm文件 ;>>>>>>>>>>>>>>>>>…...

React(三)

动态控制显示和css import { useState } from "react"; import "./index.css"; const list [{ id: 1, username: "aaName", content: "一条评论", ctime: "10-18 08:15" },{ id: 2, username: "bbName", conten…...

GitHub Pages + Jekyll 博客搭建指南(静态网站搭建)

目录 &#x1f680; 静态网站及其生成工具指南&#x1f30d; 什么是静态网站&#xff1f;&#x1f4cc; 静态网站的优势⚖️ 静态网站 VS 动态网站 &#x1f680; 常见的静态网站生成器对比&#x1f6e0;️ 使用 GitHub Pages Jekyll 搭建个人博客&#x1f4cc; 1. 创建 GitHu…...

用Go实现 SSE 实时推送消息(消息通知)——思悟项目技术4

目录 简介 工作原理 例子 使用场景 简介 SSE&#xff08;Server - Sent Events&#xff09;是一种允许服务器向客户端实时推送更新的 Web 技术。是一种基于 HTTP 协议的单向通信机制&#xff0c;服务器可以在客户端建立连接后&#xff0c;持续不断地向客户端发送事件流。客…...

通过客户端Chatbox或OpenwebUI访问识别不到本地ollama中的模型等问题的解决

Chatbox和Open WebUI 等无法获取到 Ollama里的模型&#xff0c;主要是由以下原因导致&#xff1a; Ollama 服务未正确暴露给 Docker 容器或客户端模型未正确下载或名称不匹配网络配置或权限问题 排查以上问题的思路首先排查ollama服务是否启动&#xff0c;然后再看端口号 使…...

TfidfVectorizer

TF-IDF / Term Frequency - Inverse Document Frequency 作用&#xff1a;是自然语言处理NLP中常用的文本特征提取工具&#xff0c;用于将文本数据转换为数据向量。 核心思想&#xff1a;是通过统计词频和逆文档频率来量化词语在文本中的重要性。 T F − I D F ( t , d ) T F…...

如何评估云原生GenAI应用开发中的安全风险(下)

以上就是如何评估云原生GenAI应用开发中的安全风险系列中的上篇内容&#xff0c;在本篇中我们介绍了在云原生AI应用开发中不同层级的风险&#xff0c;并了解了如何定义AI系统的风险。在本系列下篇中我们会继续探索我们为我们的云原生AI应用评估风险的背景和意义&#xff0c;并且…...

Flink-序列化

一、概述 几乎每个Flink作业都必须在其运算符之间交换数据&#xff0c;由于这些记录不仅可以发送到同一JVM中的另一个实例&#xff0c;还可以发送到单独的进程&#xff0c;因此需要先将记录序列化为字节。类似地&#xff0c;Flink的堆外状态后端基于本地嵌入式RocksDB实例&…...

1064 - You have an error in your SQL syntax;

在创建数据库表建立外键是遇到了如下报错 1064 - You have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near position(position_id) ) at line 8 数据库表sql如下&#xff1a; --职位表 CR…...

团结引擎 Shader Graph:解锁图形创作新高度

Shader Graph 始终致力于为开发者提供直观且高效的着色器构建工具&#xff0c;持续推动图形渲染创作的创新与便捷。在团结引擎1.4.0中&#xff0c;Shader Graph 迎来了重大更新&#xff0c;新增多项强大功能并优化操作体验&#xff0c;助力开发者更轻松地实现高质量的渲染效果与…...

Spring Boot 配置 Mybatis 读写分离

JPA 的读写分离配置不能应用在 Mybatis 上, 所以 Mybatis 要单独处理 为了不影响原有代码, 使用了增加拦截器的方式, 在拦截器里根据 SQL 的 CRUD 来路由到不同的数据源 需要单独增加Mybatis的配置 Configuration public class MyBatisConfig {Beanpublic SqlSessionFactory…...

Redis 数据类型 List 列表

列表类型是⽤来存储多个有序的字符串&#xff0c;如下图所⽰&#xff0c;a、b、c、d、e 五个元素从左到右组成了⼀个有序的列表&#xff0c;列表中的每个字符串称为元素&#xff08;element&#xff09;&#xff0c;⼀个列表最多可以存储 2^32 - 1个元素。在 Redis 中&#xff…...

Hello Robot 推出Stretch 3移动操作机器人,赋能研究与商业应用

Hello Robot公司近日发布了其新一代开源移动操作机器人Stretch 3&#xff0c;这是一款高度灵活的机器人平台&#xff0c;专为机器人研究、教育实验和商业自动化设计。Stretch 3 结合了先进的移动机器人技术、灵巧操作能力和开源软件生态系统&#xff0c;为用户提供了一个功能强…...

有滚动条的时候,设置盒子的位置

<div class"AIBox mt-24" id"AIBox"><div v-for"(v, i) in AIs" :key"i" :class"v.role assistant ? mb-24 : "><div :class"v.role user ? fc-ac42f3 fw-600 font-16 : ">{{ v.content }}…...

律所录音证据归集工具:基于PyQt6与多线程的自动化音频管理解决方案

在律所日常工作中&#xff0c;音频证据的整理与归集是一个高频且复杂的任务。面对大量的案件录音文件&#xff0c;如何实现快速且准确的分类与存档&#xff0c;成为了律所提高效率、降低出错率的关键。本文将通过技术角度解析一款名为律所录音证据归集工具的项目&#xff0c;详…...

LogicFlow自定义节点:矩形、HTML(vue3)

效果&#xff1a; LogicFlow 内部是基于MVVM模式进行开发的&#xff0c;分别使用preact和mobx来处理 view 和 model&#xff0c;所以当我们自定义节点的时候&#xff0c;需要为这个节点定义view和model。 参考官方文档&#xff1a;节点 | LogicFlow 1、自定义矩形节点 custo…...

软件工程教育的革命:AI辅助学习与实践

软件工程教育正面临着巨大的挑战。传统的教学模式往往以理论讲解为主&#xff0c;实践机会不足&#xff0c;导致学生难以将理论知识转化为实际技能。此外&#xff0c;繁琐的代码编写和项目搭建过程也常常耗费学生大量时间和精力&#xff0c;影响学习效率。为了解决这些问题&…...

Office hour 1

涉及Python环境配置、深度学习框架安装、常用数据处理和分析库、以及Python IDE的选择等内容。 1. Anaconda 安装与配置 • Anaconda Individual Edition&#xff1a;Anaconda 是一个开源平台&#xff0c;旨在简化数据科学的工作流程&#xff0c;提供了 Python 和超过 150 个科…...

【魔法阵——广义Dijkstra,DP】

题目 代码 #include <bits/stdc.h> using namespace std; const int N 1010; const int inf 0x3f3f3f3f; int g[N][N], d[N][N]; bool st[N][N]; int n, k, m; struct Node {int v, c, i;bool operator < (const Node &y) const{return v > y.v;} }; priori…...

使用epoll与sqlite3进行注册登录

将 epoll 服务器 客户端拿来用 客户端&#xff1a;写一个界面&#xff0c;里面有注册登录 服务器&#xff1a;处理注册和登录逻辑&#xff0c;注册的话将注册的账号密码写入数据库&#xff0c;登录的话查询数据库中是否存在账号&#xff0c;并验证密码是否正确 额外功能&…...

vue3-01-初识vue3相对于vue2的提升与比较,使用vue-cli创建项目,使用vite构建工具创建项目

1.相对于vue2的提升 2.创建vue3项目-使用vue-cli创建 2.1 cmd查看版本号 vue-V 2.2进入创建项目 切换D盘 D: 指定自定义创建的项目 cd 文件名 创建项目 vue create 项目名称 成功创建项目 运行项目 3.使用vite(构建工具)创建前端项目 3.1创建项目 3.1.1 npm init vite-ap…...

持久性HTTPVS.非持久性HTTP

1. HTTP协议基础 HTTP&#xff08;HyperText Transfer Protocol&#xff09;是Web通信的核心协议&#xff0c;定义了客户端&#xff08;浏览器&#xff09;与服务器之间传输数据的规则。 在HTTP/1.0及之前的版本中&#xff0c;默认使用非持久性连接&#xff0c;而HTTP/1.1及更…...

Node.js怎么调用到打包的python文件呢

在 Node.js 中调用打包后的 Python 可执行文件&#xff08;如 PyInstaller 生成的 .exe 或二进制文件&#xff09;&#xff0c;可以通过以下步骤实现&#xff1a; 一、Python 打包准备 假设已有打包好的 Python 文件 your_script.exe&#xff08;以 Windows 为例&#xff09;&…...

C++,STL容器,map/multimap:映射/多重映射深入解析

文章目录 一、容器概览核心特性对比二、底层实现原理三、核心操作详解1. 容器初始化2. 元素插入操作3. 元素访问与查找4. 元素删除操作四、实战应用场景1. 高频数据统计2. 事件调度系统五、性能优化策略1. 键类型选择2. 内存管理优化六、注意事项与陷阱1. 迭代器失效问题2. 自定…...

【IDEA】2017版本的使用

目录 一、常识 二、安装 1. 下载IDEA2017.exe 2. 安装教程 三、基本配置 1. 自动更新关掉 2. 整合JDK环境 3. 隐藏.idea文件夹和.iml等文件 四、创建Java工程 1. 新建项目 2. 创建包结构&#xff0c;创建类&#xff0c;编写main主函数&#xff0c;在控制台输出内容。…...

理解Unity中的ExecuteInEditMode与ExecuteAlways

深入理解Unity中的[ExecuteInEditMode]与[ExecuteAlways] 一、引言 在开发Unity项目时,有时我们需要在编辑器模式下执行某些脚本逻辑,以实现即时反馈或特定的编辑功能。Unity提供了两种方式来满足这种需求:[ExecuteInEditMode]和[ExecuteAlways]。本文将详细介绍这两种特性…...

MybatisPlus常用增删改查

记录下MybatisPlus的简单的增删改查 接口概述 Service和Mapper区别 Mapper简化了单表的sql操作步骤&#xff08;CRUD&#xff09;&#xff0c;而Serivce则是对Mapper的功能增强。 Service虽然加入了数据库的操作&#xff0c;但还是以业务功能为主&#xff0c;而更加复杂的SQL…...