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

SpringBoot项目集成ONLYOFFICE

ONLYOFFICE 文档8.2版本已发布:PDF 协作编辑、改进界面、性能优化、表格中的 RTL 支持等更新

文章目录

  • 前言
  • ONLYOFFICE 产品简介
  • 功能与特点
  • Spring Boot 项目中集成 OnlyOffice
    • 1. 环境准备
    • 2. 部署OnlyOffice Document Server
    • 3. 配置Spring Boot项目
    • 4. 实现文档编辑功能
    • 5. 文档保存与版本控制
      • (1)配置文件 `application.properties`
      • (2)依赖管理 `pom.xml`
      • (3)控制器 `DocumentController.java`
      • (4)配置类 `OnlyOfficeConfig.java`
      • (5)文档服务类 `DocumentService.java`
      • (6)文档模型类 `Document.java`
      • (7)前端页面 `index.html`
      • (8)用户服务类 `UserService.java`(可选)
      • (9)修改控制器以添加权限验证 `DocumentController.java`
    • 6. 安全性和权限管理
  • 体验与测评
  • 8.2 版本的其他更新:
  • 结尾:ONLYOFFICE 项目介绍


前言

提示:这里可以添加本文要记录的大概内容:

随着互联网技术的发展,越来越多的企业和个人开始寻求高效的在线文档处理解决方案。传统的本地文档编辑软件虽然功能强大,但在多用户协同工作方面存在诸多不便。为了满足这一需求,市场上涌现出了许多优秀的在线文档编辑工具,其中OnlyOffice因其出色的性能和灵活的集成能力而受到广泛好评。本文将详细介绍如何在Spring Boot项目中集成OnlyOffice,实现文档的在线编辑功能,并分享OnlyOffice的产品特点和用户体验。

ONLYOFFICE 产品简介

OnlyOffice是一套完整的开源办公套件,旨在为企业和个人提供高效的文档处理解决方案。它包含文字处理、电子表格和演示文稿三种类型的文档编辑器,支持多种文档格式的读取和编辑。OnlyOffice不仅提供了丰富的桌面应用程序,还拥有强大的Web版编辑器——OnlyOffice Document Server,后者可以方便地集成到各类Web应用中,实现文档的在线编辑和协作。

功能与特点

  • 全面的文档支持:支持DOCXXLSXPPTX等多种文档格式的编辑和转换。
  • 实时协作编辑:允许多个用户同时编辑同一文档,所有更改实时同步。
  • 权限管理:提供细粒度的文档访问权限控制,确保文档的安全性。
  • 版本管理:自动记录文档的历史版本,便于追踪修改记录和恢复早期版本。
  • 插件扩展:支持通过插件扩展编辑器的功能,满足更多个性化需求。
  • API接口丰富:提供RESTful APIJavaScript API,方便开发者集成到现有系统中。

Spring Boot 项目中集成 OnlyOffice

1. 环境准备

  • Java环境:确保已经安装了Java环境(建议JDK 1.8及以上版本)。
    在这里插入图片描述

  • 构建工具:安装MavenGradle作为项目的构建工具。
    在这里插入图片描述

  • Spring Boot项目:可以通过Spring Initializr快速创建一个Spring Boot项目基础框架。
    在这里插入图片描述

2. 部署OnlyOffice Document Server

  • 安装OnlyOffice:可以选择在本地或云服务器上安装OnlyOffice Document Server。官方提供了详细的安装指南,可以根据自己的操作系统选择合适的安装方法。
    在这里插入图片描述

  • 检查安装:安装完成后,确保Document Server能够正常访问,通常可以通过浏览器访问http://<your_server_ip>:80来检查是否成功安装。
    在这里插入图片描述

3. 配置Spring Boot项目

在这里插入图片描述

  • 添加配置:在Spring Boot项目的application.properties文件中添加OnlyOffice服务器的相关配置信息,如服务器地址等。
  onlyoffice.server.url=http://<your_server_ip>onlyoffice.server.secret=<your_secret_key>
  • 创建控制器:创建一个控制器(Controller)用于处理前端请求,调用OnlyOffice API进行文档的加载、保存等操作。
  @RestController@RequestMapping("/documents")public class DocumentController {@Value("${onlyoffice.server.url}")private String serverUrl;@Value("${onlyoffice.server.secret}")private String secretKey;@GetMapping("/{id}")public ResponseEntity<?> getDocument(@PathVariable String id) {// 调用OnlyOffice API获取文档编辑所需参数// ...}@PostMapping("/{id}")public ResponseEntity<?> saveDocument(@PathVariable String id, @RequestBody Document document) {// 处理文档保存逻辑// ...}}

4. 实现文档编辑功能

  • 前端集成:利用OnlyOffice提供的JavaScript API,在前端页面中嵌入文档编辑器。
  <div id="document-editor"></div><script src="https://<your_server_ip>/web-apps/apps/api/documents/api.js"></script><script>function onDocumentReady() {var docEditor = new DocsAPI.DocEditor("document-editor", {"document": {"fileType": "docx","key": "<document_id>","title": "Sample Document","url": "https://<your_server_ip>/documents/<document_id>"},"documentType": "word","editorConfig": {"callbackUrl": "https://<your_backend_url>/documents/<document_id>","mode": "edit","lang": "en"},"customization": {"actionBar": false,"chat": false}});}</script>

5. 文档保存与版本控制

  • 保存文档:当用户完成编辑并保存文档时,OnlyOffice会将更新后的文档发送回指定的回调URL。
  @PostMapping("/{id}")public ResponseEntity<?> saveDocument(@PathVariable String id, @RequestBody Document document) {// 将文档保存到数据库或文件系统中// 记录版本信息return ResponseEntity.ok().build();}
  • 版本管理:记录文档的历史版本,便于追踪修改记录和恢复早期版本。

以下是Spring Boot项目中集成OnlyOffice的完整代码部分:

(1)配置文件 application.properties

onlyoffice.server.url=http://<your_server_ip>
onlyoffice.server.secret=<your_secret_key>

(2)依赖管理 pom.xml

<dependencies><!-- Spring Boot Web Starter --><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-web</artifactId></dependency><!-- Spring Boot Thymeleaf Starter (可选,用于模板引擎) --><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-thymeleaf</artifactId></dependency><!-- Spring Boot Security Starter (可选,用于安全控制) --><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-security</artifactId></dependency><!-- JSON处理库 --><dependency><groupId>com.fasterxml.jackson.core</groupId><artifactId>jackson-databind</artifactId></dependency>
</dependencies>

(3)控制器 DocumentController.java

package com.example.onlyoffice.controller;import com.example.onlyoffice.config.OnlyOfficeConfig;
import com.example.onlyoffice.model.Document;
import com.example.onlyoffice.service.DocumentService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.ResponseEntity;
import org.springframework.web.bind.annotation.*;@RestController
@RequestMapping("/documents")
public class DocumentController {@Autowiredprivate OnlyOfficeConfig onlyOfficeConfig;@Autowiredprivate DocumentService documentService;@GetMapping("/{id}")public ResponseEntity<Document> getDocument(@PathVariable String id) {Document document = documentService.getDocumentById(id);if (document == null) {return ResponseEntity.notFound().build();}return ResponseEntity.ok(document);}@PostMapping("/{id}")public ResponseEntity<Void> saveDocument(@PathVariable String id, @RequestBody Document document) {documentService.saveDocument(id, document);return ResponseEntity.ok().build();}@GetMapping("/config/{id}")public ResponseEntity<Object> getConfig(@PathVariable String id) {return ResponseEntity.ok(onlyOfficeConfig.getConfig(id));}
}

(4)配置类 OnlyOfficeConfig.java

package com.example.onlyoffice.config;import org.springframework.beans.factory.annotation.Value;
import org.springframework.stereotype.Component;import java.util.HashMap;
import java.util.Map;@Component
public class OnlyOfficeConfig {@Value("${onlyoffice.server.url}")private String serverUrl;@Value("${onlyoffice.server.secret}")private String secretKey;public Map<String, Object> getConfig(String documentId) {Map<String, Object> config = new HashMap<>();config.put("document", Map.of("fileType", "docx","key", documentId,"title", "Sample Document","url", serverUrl + "/documents/" + documentId));config.put("documentType", "word");config.put("editorConfig", Map.of("callbackUrl", serverUrl + "/documents/" + documentId,"mode", "edit","lang", "en"));config.put("customization", Map.of("actionBar", false,"chat", false));return config;}
}

(5)文档服务类 DocumentService.java

package com.example.onlyoffice.service;import com.example.onlyoffice.model.Document;
import org.springframework.stereotype.Service;import java.util.HashMap;
import java.util.List;
import java.util.Map;
import java.util.ArrayList;
import java.util.Collections;@Service
public class DocumentService {private final Map<String, Document> documents = new HashMap<>();private final Map<String, List<Document>> history = new HashMap<>();public Document getDocumentById(String id) {return documents.get(id);}public void saveDocument(String id, Document document) {Document currentDocument = documents.get(id);if (currentDocument != null) {history.computeIfAbsent(id, k -> new ArrayList<>()).add(currentDocument);}documents.put(id, document);}public List<Document> getHistory(String id) {return history.getOrDefault(id, Collections.emptyList());}
}

(6)文档模型类 Document.java

package com.example.onlyoffice.model;import lombok.Data;@Data
public class Document {private String content;// 其他字段...
}

(7)前端页面 index.html

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>OnlyOffice Document Editor</title>
</head>
<body>
<div id="document-editor" style="height: 600px;"></div>
<script src="https://<your_server_ip>/web-apps/apps/api/documents/api.js"></script>
<script>async function loadDocumentEditor() {const response = await fetch('/documents/config/<document_id>');const config = await response.json();new DocsAPI.DocEditor("document-editor", config);}window.onload = loadDocumentEditor;
</script>
</body>
</html>

(8)用户服务类 UserService.java(可选)

package com.example.onlyoffice.service;import org.springframework.stereotype.Service;@Service
public class UserService {public boolean hasAccess(String username, String documentId) {// 这里实现具体的权限验证逻辑// 示例:假设所有用户都有访问权限return true;}
}

(9)修改控制器以添加权限验证 DocumentController.java

package com.example.onlyoffice.controller;import com.example.onlyoffice.config.OnlyOfficeConfig;
import com.example.onlyoffice.model.Document;
import com.example.onlyoffice.service.DocumentService;
import com.example.onlyoffice.service.UserService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.HttpStatus;
import org.springframework.http.ResponseEntity;
import org.springframework.security.core.annotation.AuthenticationPrincipal;
import org.springframework.security.core.userdetails.UserDetails;
import org.springframework.web.bind.annotation.*;@RestController
@RequestMapping("/documents")
public class DocumentController {@Autowiredprivate OnlyOfficeConfig onlyOfficeConfig;@Autowiredprivate DocumentService documentService;@Autowiredprivate UserService userService;@GetMapping("/{id}")public ResponseEntity<Document> getDocument(@PathVariable String id, @AuthenticationPrincipal UserDetails userDetails) {if (!userService.hasAccess(userDetails.getUsername(), id)) {return ResponseEntity.status(HttpStatus.FORBIDDEN).build();}Document document = documentService.getDocumentById(id);if (document == null) {return ResponseEntity.notFound().build();}return ResponseEntity.ok(document);}@PostMapping("/{id}")public ResponseEntity<Void> saveDocument(@PathVariable String id, @RequestBody Document document, @AuthenticationPrincipal UserDetails userDetails) {if (!userService.hasAccess(userDetails.getUsername(), id)) {return ResponseEntity.status(HttpStatus.FORBIDDEN).build();}documentService.saveDocument(id, document);return ResponseEntity.ok().build();}@GetMapping("/config/{id}")public ResponseEntity<Object> getConfig(@PathVariable String id, @AuthenticationPrincipal UserDetails userDetails) {if (!userService.hasAccess(userDetails.getUsername(), id)) {return ResponseEntity.status(HttpStatus.FORBIDDEN).build();}return ResponseEntity.ok(onlyOfficeConfig.getConfig(id));}
}

以上代码涵盖了从配置文件、依赖管理、控制器、配置类、服务类、模型类到前端页面的完整实现。希望这些代码能帮助你在Spring Boot项目中成功集成OnlyOffice。如果有任何问题或需要进一步的帮助,请随时提问。

6. 安全性和权限管理

  • 权限控制:通过OnlyOffice提供的API设置文档的访问权限,例如只读、编辑等。

  • 后端验证:在Spring Boot后端实现相应的权限验证逻辑,确保只有授权用户才能访问特定的文档。

体验与测评

在实际使用中,OnlyOffice的表现令人满意。其界面设计简洁直观,用户可以轻松上手;编辑器响应速度快,即使在网络条件不佳的情况下也能保持流畅的操作体验。OnlyOffice对中文文档的支持也相当不错,无论是字体显示还是排版布局都达到了较高的水平。

  • 更快的文件加载速度:为了加快编辑器的打开速度,我们优化了加载脚本。与之前的版本相比:

打开普通文件 – 最高提速 21%
打开演示文稿 – 最高提速 17%

Excel:
请添加图片描述
PPT:
请添加图片描述
PDF:
在这里插入图片描述

当然也有一些不足之处需要注意。部分高级功能需要购买商业许可证才能使用,这可能会增加企业的成本负担。另外与其他一些在线文档编辑工具相比,OnlyOffice的社区活跃度稍显不足,遇到问题时可能难以获得及时的帮助和支持。
在这里插入图片描述

8.2 版本的其他更新:

协作编辑 PDF 文件;

文本文档中的域代码;

从第三方来源插入文本;

预设阿拉伯语数字编号;

电子表格中的迭代计算;

电子表格编辑器中的丝滑滚动;

在幻灯片上绘图;

演示文稿中的随机切换效果;

所有语言的词典更新和拼写检查改进;

新的图表类型,如直方图、瀑布图、漏斗图等。

结尾:ONLYOFFICE 项目介绍

OnlyOffice不仅仅是一款文档编辑工具,它背后是一个充满活力的开源项目。该项目始于2009年,由Ascensio System SIA公司发起并维护。多年来,OnlyOffice不断发展壮大,形成了一个包括文档编辑器、邮件客户端、项目管理等多个子项目的生态系统。目前,OnlyOffice在全球范围内拥有数百万用户,得到了广泛的认可和好评。

ONLYOFFICE 官网

相关文章:

SpringBoot项目集成ONLYOFFICE

ONLYOFFICE 文档8.2版本已发布&#xff1a;PDF 协作编辑、改进界面、性能优化、表格中的 RTL 支持等更新 文章目录 前言ONLYOFFICE 产品简介功能与特点Spring Boot 项目中集成 OnlyOffice1. 环境准备2. 部署OnlyOffice Document Server3. 配置Spring Boot项目4. 实现文档编辑功…...

用于nodejs的开源违禁词检测工具 JavaScript node-word-detection

地址 : https://www.npmjs.com/package/node-word-detection github地址: https://github.com/xiaobaidadada/node-word-detection 非常节省内存的轻量级快速违禁词、词典库 检测工具 、 50万个词大约需要300MB内存、被检测的文本100字内结果在1毫秒左右。本项目没有提供词库请…...

FFmpeg 4.3 音视频-多路H265监控录放C++开发十二:在屏幕上显示多路视频播放,可以有不同的分辨率,格式和帧率。

上图是在安防领域的要求&#xff0c;一般都是一个屏幕上有显示多个摄像头捕捉到的画面&#xff0c;这一节&#xff0c;我们是从文件中读取多个文件&#xff0c;显示在屏幕上。...

Linux权限问题(账号切换,权限,粘滞位)

1.什么是权限&#xff1f; 在Linux下有两种用户&#xff0c;分别是超级用户&#xff08;root&#xff09;和普通用户。超级用户可以在Linux下做任何事情&#xff0c;几乎不受限制&#xff0c;而普通用户一般只能在自己的工作目录下&#xff08;/home/xxx&#xff09;工作&#…...

el-upload,上传文件,后端提示信息,前端需要再次重新上传(不用重新选择文件)

1.el-upload 上传附件&#xff1a; <el-uploadref"upload":action"upload.url ?updateSupport upload.updateSupport":auto-upload"false":disabled"upload.isUploading":headers"upload.headers":limit"1"…...

数字信号处理Python示例(5)使用实指数函数仿真PN结二极管的正向特性

文章目录 前言一、二极管的电流-电压关系——Shockley方程二、PN结二极管正向特性的Python仿真三、仿真结果分析写在后面的话 前言 使用Python代码仿真了描述二极管的电流-电压关系的Shockley方程&#xff0c;对仿真结果进行了分析&#xff0c;说明在正向偏置区域&#xff0c;…...

ctfshow(89,90,92,93)--PHP特性--intval函数

Web89 源代码&#xff1a; include("flag.php"); highlight_file(__FILE__);if(isset($_GET[num])){$num $_GET[num];if(preg_match("/[0-9]/", $num)){die("no no no!");}if(intval($num)){echo $flag;} }审计 GET传参num。 如果在参数num中…...

构建ubuntu22.04.4私有源服务以及配置ubuntu私有源

构建ubuntu22.04.4私有源服务以及配置ubuntu私有源 一、环境说明1.1 私有源服务器1.2 客户机二 、构建私有源服务2.1 服务构建2.2 发布新的deb包到源服务器1. 准备新的 `.deb` 包2. 将 `.deb` 包添加到仓库目录3. 更新 `Packages` 文件4. 更新仓库的发布文件(可选)5. 通知客户…...

模块功能的描述方法

目录 行为描述方法 语句块 过程赋值语句 高级程序语句 循环语句 数据流描述 结构描述 混合描述方法 module 模块名(端口列表); // 模块声明// 端口定义input [数据类型] [位宽] 输入端口列表; output [数据类型] [位宽] 输出端口列表; inout [数据类…...

【WPF】MatrixTransform类

【WPF】MatrixTransform类 主要特性使用场景示例 在WPF&#xff08;Windows Presentation Foundation&#xff09;中&#xff0c;MatrixTransform 类是用于表示一个仿射变换的类&#xff0c;它允许开发者通过一个矩阵来定义一个二维空间中的线性变换。这种变换可以包括平移&…...

【C++】继承的理解

1.继承的概念和定义 1.1继承的概念 继承 (inheritance) 机制是面向对象程序设计 使代码可以复用 的最重要的手段&#xff0c;它允许程序员在 保 持原有类特性的基础上进行扩展 &#xff0c;增加功能&#xff0c;这样产生新的类&#xff0c;称派生类。继承 呈现了面向对象 程序…...

day50 图论章节刷题Part02(99.岛屿数量 深搜、99.岛屿数量 广搜、100.岛屿的最大面积)

前言&#xff1a;前段时间论文开题落下了很多进度&#xff0c;今天开始会尽快赶上 99.岛屿数量 深搜 思路&#xff1a;对地图进行遍历遇到一个没有遍历过的陆地节点&#xff0c;计数器就1&#xff0c;并把该节点所能遍历到的陆地都标记上&#xff1b;遇到标记过的陆地节点和海…...

超详细从基准将VMware ESXi 升级到 vSphere 6.7U1教程

哈喽大家好&#xff0c;欢迎来到虚拟化时代君&#xff08;XNHCYL&#xff09;&#xff0c;收不到通知请将我点击星标&#xff01; “ 大家好&#xff0c;我是虚拟化时代君&#xff0c;一位潜心于互联网的技术宅男。这里每天为你分享各种你感兴趣的技术、教程、软件、资源、福…...

华为OD机试 - 打印机队列 - 优先队列(Java 2024 E卷 200分)

华为OD机试 2024E卷题库疯狂收录中&#xff0c;刷题点这里 专栏导读 本专栏收录于《华为OD机试&#xff08;JAVA&#xff09;真题&#xff08;E卷D卷A卷B卷C卷&#xff09;》。 刷的越多&#xff0c;抽中的概率越大&#xff0c;私信哪吒&#xff0c;备注华为OD&#xff0c;加…...

MatrixOne 助力西安天能替换MySQL+MongoDB+ES打造一体化物联网平台

物联网&#xff08;IoT&#xff09;时代&#xff0c;企业正以前所未有的速度加快数字化转型。西安天能软件科技有限责任公司&#xff08;Skyable&#xff09;作为工业物联网领域的领先企业&#xff0c;携手MatrixOne&#xff0c;共同构建新一代一体化物联网平台&#xff0c;实现…...

正则表达式---元字符

简介 正则表达式分为两种语法&#xff1a;POSIX标准的语法&#xff0c;Perl语法。 正则表达式的POSIX规范&#xff0c;分为基本型正则表达式&#xff08;Basic Regular Expression, BRE&#xff09;&#xff0c;扩展型正则表达式&#xff08;Extended Regular Expression&…...

数据库Redis篇

系列文章目录 第一章 C/C语言篇第二章 计算机网络篇第三章 操作系统篇第四章 数据库MySQL篇第五章 数据库Redis篇第六章 场景题/算法题第七篇 常见HR问题篇 本系列专栏&#xff1a;点击进入 后端开发面经 关注走一波 秋招阶段&#xff0c;面过很多大中小厂&#xff0c;积攒了…...

在区块链技术中,什么是权益证明(PoS)?

权益证明&#xff08;Proof of Stake, PoS&#xff09;是一种与工作量证明&#xff08;Proof of Work, PoW&#xff09;类似的共识机制&#xff0c;但它通过不同的方式来确保区块链网络的安全性和一致性。PoS的主要目标是解决PoW中存在的高能耗问题&#xff0c;并提高网络的扩展…...

Spring Boot——日志介绍和配置

1. 日志的介绍 在前面的学习中&#xff0c;控制台上打印出来的一大堆内容就是日志&#xff0c;可以帮助我们发现问题&#xff0c;分析问题&#xff0c;定位问题&#xff0c;除此之外&#xff0c;日志还可以进行系统的监控&#xff0c;数据采集等 2. 日志的使用 在程序中获取日…...

Python实现全国岗位招聘信息可视化分析(源码+论文+部署讲解)

项目源码&数据源获取 利用Python实现全国岗位招聘信息可视化分析 项目背景&#xff1a; 1.为企业招聘决策提供科学的依据和参考&#xff0c;可以帮助人力资源部门、招聘机构和求职者了解当前的就业形势、行业趋势和人才需求&#xff0c;从而做出更明智的招聘和求职决策。…...

Xshell远程连接Kali(默认 | 私钥)Note版

前言:xshell远程连接&#xff0c;私钥连接和常规默认连接 任务一 开启ssh服务 service ssh status //查看ssh服务状态 service ssh start //开启ssh服务 update-rc.d ssh enable //开启自启动ssh服务 任务二 修改配置文件 vi /etc/ssh/ssh_config //第一…...

盘古信息PCB行业解决方案:以全域场景重构,激活智造新未来

一、破局&#xff1a;PCB行业的时代之问 在数字经济蓬勃发展的浪潮中&#xff0c;PCB&#xff08;印制电路板&#xff09;作为 “电子产品之母”&#xff0c;其重要性愈发凸显。随着 5G、人工智能等新兴技术的加速渗透&#xff0c;PCB行业面临着前所未有的挑战与机遇。产品迭代…...

大型活动交通拥堵治理的视觉算法应用

大型活动下智慧交通的视觉分析应用 一、背景与挑战 大型活动&#xff08;如演唱会、马拉松赛事、高考中考等&#xff09;期间&#xff0c;城市交通面临瞬时人流车流激增、传统摄像头模糊、交通拥堵识别滞后等问题。以演唱会为例&#xff0c;暖城商圈曾因观众集中离场导致周边…...

Spring AI 入门:Java 开发者的生成式 AI 实践之路

一、Spring AI 简介 在人工智能技术快速迭代的今天&#xff0c;Spring AI 作为 Spring 生态系统的新生力量&#xff0c;正在成为 Java 开发者拥抱生成式 AI 的最佳选择。该框架通过模块化设计实现了与主流 AI 服务&#xff08;如 OpenAI、Anthropic&#xff09;的无缝对接&…...

优选算法第十二讲:队列 + 宽搜 优先级队列

优选算法第十二讲&#xff1a;队列 宽搜 && 优先级队列 1.N叉树的层序遍历2.二叉树的锯齿型层序遍历3.二叉树最大宽度4.在每个树行中找最大值5.优先级队列 -- 最后一块石头的重量6.数据流中的第K大元素7.前K个高频单词8.数据流的中位数 1.N叉树的层序遍历 2.二叉树的锯…...

CSS设置元素的宽度根据其内容自动调整

width: fit-content 是 CSS 中的一个属性值&#xff0c;用于设置元素的宽度根据其内容自动调整&#xff0c;确保宽度刚好容纳内容而不会超出。 效果对比 默认情况&#xff08;width: auto&#xff09;&#xff1a; 块级元素&#xff08;如 <div>&#xff09;会占满父容器…...

使用Spring AI和MCP协议构建图片搜索服务

目录 使用Spring AI和MCP协议构建图片搜索服务 引言 技术栈概览 项目架构设计 架构图 服务端开发 1. 创建Spring Boot项目 2. 实现图片搜索工具 3. 配置传输模式 Stdio模式&#xff08;本地调用&#xff09; SSE模式&#xff08;远程调用&#xff09; 4. 注册工具提…...

【电力电子】基于STM32F103C8T6单片机双极性SPWM逆变(硬件篇)

本项目是基于 STM32F103C8T6 微控制器的 SPWM(正弦脉宽调制)电源模块,能够生成可调频率和幅值的正弦波交流电源输出。该项目适用于逆变器、UPS电源、变频器等应用场景。 供电电源 输入电压采集 上图为本设计的电源电路,图中 D1 为二极管, 其目的是防止正负极电源反接, …...

【MATLAB代码】基于最大相关熵准则(MCC)的三维鲁棒卡尔曼滤波算法(MCC-KF),附源代码|订阅专栏后可直接查看

文章所述的代码实现了基于最大相关熵准则(MCC)的三维鲁棒卡尔曼滤波算法(MCC-KF),针对传感器观测数据中存在的脉冲型异常噪声问题,通过非线性加权机制提升滤波器的抗干扰能力。代码通过对比传统KF与MCC-KF在含异常值场景下的表现,验证了后者在状态估计鲁棒性方面的显著优…...

JS红宝书笔记 - 3.3 变量

要定义变量&#xff0c;可以使用var操作符&#xff0c;后跟变量名 ES实现变量初始化&#xff0c;因此可以同时定义变量并设置它的值 使用var操作符定义的变量会成为包含它的函数的局部变量。 在函数内定义变量时省略var操作符&#xff0c;可以创建一个全局变量 如果需要定义…...