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

vue预览和下载 pdf、ppt、word、excel文档,文件类型为链接或者base64格式或者文件流,

**

方法1:word、xls、ppt、pdf 这些文件, 如果预览的文件是链接可以直接打开,可用微软官方的预览地址

**

 <iframe width="100%" :src="textVisibleURl " id="myFramePPT" style="border: none;background: #f3f5f8"title="预览" height="100%"></iframe>
data(){return {textVisibleURl :''}
}//可用window.open新开页面 或者 iframe 嵌入
//src是你文件的链接,需要可以公网访问,内网不可用,如http://********.docxthis.textVisibleURl = `https://view.officeapps.live.com/op/embed.aspx?src=${src}`; //去掉头部一些不必要的按钮操作
window.open(this.textVisibleURl)

方法2:word、xls、ppt、pdf 这些文件, 如果预览的文件是类型是文件流或者base64格式

本次我的项目中后端返回的是base64格式,在预览中需要将base64格式转为文件流
在这里插入图片描述

methods:{
getCustomerPoolList() {this.$api.getCustomerPoolList({ cityName: this.cityName.toString(), homeId: this.homeInterViewSelected.map(item => 			 item.homeId).toString() }).then(res => {res.data.forEach(item => {//此处两个遍历和预览无关,为业务逻辑,主要区分出文档和图片item.mapImageObj = item.fileList.filter(file => {return file.fileType == '.png' || file.fileType == '.jpg' || file.fileType == '.jpeg'})[0] || {}item.annexFileList = item.fileList.filter(file => {return file.fileType !== '.png' && file.fileType !== '.jpg' && file.fileType !== '.jpeg'}) || {}//item.annexFileList为所有文档的数组item.annexFileList.forEach((i, index) => {//fileByte为base64格式,如上图,如果你的文件格式直接为文件流,此处 base64Str 到 byteArray 可跳过let base64Str = i.fileByte;const byteCharacters = atob(base64Str);const byteNumbers = new Array(byteCharacters.length);for (let i = 0; i < byteCharacters.length; i++) {byteNumbers[i] = byteCharacters.charCodeAt(i);}const byteArray = new Uint8Array(byteNumbers);//针对不同的文件添加不同的BlobType,此处转为文件流URL,文件为文件流可直接从此处开始//fileType 可以从fileName中截取,也可让后端返回if (i.fileType == '.pdf') {const blob = new Blob([byteArray], { type: 'application/pdf' });i.dialogImageUrl = URL.createObjectURL(blob);} else if (i.fileType == '.docx') {const blob = new Blob([byteArray], { type: 'application/msword' });i.dialogImageUrl = URL.createObjectURL(blob);} else if (i.fileType == '.ppt' || i.fileType == '.pptx') {const blob = new Blob([byteArray], { type: 'application/vnd.openxmlformats-officedocument.presentationml.presentation' });i.dialogImageUrl = URL.createObjectURL(blob);} else {//此处为excel文件,格式为".xlsx"const blob = new Blob([byteArray], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });i.dialogImageUrl = URL.createObjectURL(blob);return}})})this.customerPoolObj = JSON.parse(JSON.stringify(res.data))})},
}

处理完后的数据,dialogImageUrl 为对象URL,预览全靠这个URL!!!
在这里插入图片描述
开始页面渲染

文件列表展示
![在这里插入图片描述](https://i-blog.csdnimg.cn/direct/1e0494fa39264352982a21793adb8597.png

预览所需的插件

#docx文档预览组件方法1
npm install @vue-office/docx vue-demi#docx文档预览组件方法2,本文没有使用此插件预览docx
npm install mammoth#excel文档预览组件
npm install @vue-office/excel vue-demi#pdf文档预览组件 ,本文中没有使用此插件预览PDF 
npm install @vue-office/pdf vue-demi

将两个文件复制到public目录下
在这里插入图片描述
在这里插入图片描述

ppt iframe的index.html代码,可适配移动端,pc端可删除适配移动端代码
下面的fileUrl:就是 上面处理完后的 dialogImageUrl

图片中的代码如下

	let currentUrl = window.location.href;function getUrlParams(url) {const paramsRegex = /[?&]+([^=&]+)=([^&]*)/gi;const params = {};let match;while ((match = paramsRegex.exec(url))) {params[match[1]] = match[2];}return params;}let fileUrl = getUrlParams(currentUrl).fileUrl;console.log("fileUrl-->", fileUrl);//fileUrl:就是dialogImageUrl // #pptx div的id$("#pptx").pptxToHtml({pptxFileUrl: fileUrl,pptxFileName: "fileName",slidesScale: "100%",slideMode: false,keyBoardShortCut: false,});// 适配移动端!!let timer = setInterval(() => {const $slides = $(".slides");if ($slides.children().length) {const slidesWidth = Math.max(...Array.from($slides.children()).map((s) => s.offsetWidth));const $wrapper = $("#pptx");const wrapperWidth = window.innerWidth;const wrapperHeight = window.innerHeight - 55;$wrapper.css({transform: `scale(${wrapperWidth / slidesWidth})`,"transform-origin": "top left",height: wrapperHeight * (1 / (wrapperWidth / slidesWidth)) + "px",});clearInterval(timer);}}, 100);

ppt/index.html中获取vue页面传进来的src链接获取到

	  <div class="pdfBox1" v-show="fileObj.show"><div class="_head"><h5>{{ fileObj.fileName }}</h5><i @click="closeLook" class="el-icon-arrow-left"></i></div><div class="word-wrap"><!-- 预览pdf --><iframe :src="'./pdf/web/viewer.html?file=' + fileObj.url" height="100%" width="100%" id="iframe" title="预览"v-show="fileObj.type === '.pdf'" /><!-- 预览excel --><vue-office-excel v-if="fileObj.type === '.xlsx'" :src="fileObj.url" @rendered="rendered"style="width: 100%; height: 100%" /><!-- 无适配图片,预览Docx  --><VueOfficeDocx :src="fileObj.url" v-if="fileObj.type === '.docx'"></VueOfficeDocx><!-- 预览ppt  --><iframe width="100%" :src="pptSrc" id="myFramePPT" v-if="fileObj.type === '.pptx' || fileObj.type === '.ppt'"style="border: none;background: #f3f5f8" title="预览" height="100%"></iframe></div></div>

文件列表的点击事件调用toFileBlob

<script>import VueOfficePdf from "@vue-office/pdf";import VueOfficeDocx from '@vue-office/docx'import VueOfficeExcel from "@vue-office/excel";import "@vue-office/docx/lib/index.css";import "@vue-office/excel/lib/index.css";export default {//val为文件列表的对象,主要参数为data(){return{fileObj: {dialogImageUrl:'',fileByte:'',fileName:'',fileType:'',url :'',},pptSrc :''}}toFileBlob(val) {console.log('aaa', val)this.fileObj.show = true;this.fileObj.fileName = val.fileName;this.fileObj.type = val.fileTypethis.fileObj.fileByte = val.fileBytethis.fileObj.url = val.dialogImageUrlif (val.fileType === '.ppt' || val.fileType === '.pptx') {//传入到iframe中this.pptSrc = `/ppt/index.html?fileUrl=${val.dialogImageUrl}`;}else if (val.fileType === '.docx') {//预览word的第二种方法// let base64Str = val.fileByte;// const byteCharacters = atob(base64Str);// const byteNumbers = new Array(byteCharacters.length);// for (let i = 0; i < byteCharacters.length; i++) {//     byteNumbers[i] = byteCharacters.charCodeAt(i);// }/*  mammoth.convertToHtml({arrayBuffer: new Uint8Array(byteNumbers)}).then((resultObject) => {this.$nextTick(() => {this.wordText = resultObject.value;});}); */}}     </script> 

下载base64类型和文件流文件

  downloadGO(data, reportName) {if (!data) {return}let base64Str = data;const byteCharacters = atob(base64Str);const byteNumbers = new Array(byteCharacters.length);for (let i = 0; i < byteCharacters.length; i++) {byteNumbers[i] = byteCharacters.charCodeAt(i);}const byteArray = new Uint8Array(byteNumbers);//文件流省略上述步骤,直接下述开始,byteArray为文件流let url = window.URL.createObjectURL(new Blob([byteArray]))let link = document.createElement('a')link.style.display = 'none'link.href = urllink.download = reportName //文件名document.body.appendChild(link)link.click()},

相关文章:

vue预览和下载 pdf、ppt、word、excel文档,文件类型为链接或者base64格式或者文件流,

** 方法1&#xff1a;word、xls、ppt、pdf 这些文件&#xff0c; 如果预览的文件是链接可以直接打开&#xff0c;可用微软官方的预览地址 ** <iframe width"100%" :src"textVisibleURl " id"myFramePPT" style"border: none;backgroun…...

GIS 文件格式 及 常规应用总结

文章目录 GIS 中常见的文件格式 以及 再次打开注意事项资源网站应用地图瓦片数据地形数据倾斜模型 QGS 应用矢量数据格式栅格数据格式数据库格式更改图层样式更改图层范围导出为不同分辨率图片导出矢量文件直接保存图层通过打印布局导出使用插件导出 tiff 图片前端处理方式 GIS…...

《Pytorch框架CV开发-从入门到实战》

目录 1.环境部署2.自动梯度计算张量 tensor3.线性回归4.逻辑回归6.人工神经网络的基本概念6.1 感知器6.2 激活函数6.3多层感知器6.4 反向传播算法——前向传播6.5 反向传播算法——反向传播6.6 反向传播算法——训练方法7.Pytorch基础数据集8.手写数字识别人工神经网络训练8.1 …...

element-ui的el-select多选同时获取label与value值

直接上代码&#xff1a; <!DOCTYPE html> <html><head><meta charset"utf-8"><!-- 引入 Element UI 的 CSS --><link rel"stylesheet" href"https://unpkg.com/element-ui/lib/theme-chalk/index.css"><…...

跨站请求伪造之基本介绍

一.基本概念 1.定义 跨站请求伪造&#xff08;Cross - Site Request Forgery&#xff0c;缩写为 CSRF&#xff09;漏洞是一种网络安全漏洞。它是指攻击者通过诱导用户访问一个恶意网站&#xff0c;利用用户在被信任网站&#xff08;如银行网站、社交网站等&#xff09;的登录状…...

干部大数据分析系统如何助力构建选人用人的逻辑框架

在当今信息化快速发展的时代&#xff0c;干部大数据分析系统作为一种创新的管理工具&#xff0c;正在逐步改变传统的选人用人方式。这一系统融合了大数据、人工智能等现代信息技术&#xff0c;为组织部门提供了一个强大的辅助决策工具&#xff0c;有助于构建更加科学、准确和公…...

今天最新早上好问候语精选大全,每天问候,相互牵挂,彼此祝福

1、朋友相伴&#xff0c;友谊真诚永不变&#xff01;彼此扶持绿树荫&#xff0c;共度快乐雨后天&#xff01;一同分享的表情&#xff0c;愿我们友情长存&#xff0c;一生相伴永相连&#xff01; 2、人生几十年&#xff0c;苦累伴酸甜&#xff0c;风华不再茂&#xff0c;雄心非当…...

Android开发环境搭建和编译系统

1 工具使用 1.1 将dos格式的文件转换为unix格式文件 直接执行 dos2unix file 例如&#xff1a; dos2unix InotifyMon/AndroidManifest.xml 1.2 Linux Shell FTP使用 ftp <IP addr> 输入ID和password prompt off // 下载文件到本地 mget * 1.3 Linux sed 1.3.1 Linux命令之…...

autMan奥特曼机器人-autMan的PHP环境

直装版请自行安装php环境。 docker版本预置了php环境&#xff0c;如下图&#xff1a; 如果使用插件"test php"测试环境时&#xff0c;实时日志有报错如下&#xff1a; 可进入终端&#xff0c;输入两条命令 apk add curl apk add php-curl...

路径规划之启发式算法之二十:麻雀搜索算法(Sparrow Search Algorithm,SSA)

麻雀搜索算法(Sparrow Search Algorithm,SSA)是一种受麻雀觅食和反捕食行为启发的新型的群智能优化算法,它模拟了麻雀种群的觅食行为和反捕食行为的生物学群体特征。该算法由薛建凯在2020年首次提出,旨在解决全局优化问题,具有求解精度高、效率高等特点。 一、算法原理 S…...

Vue+element 回车查询页面刷新

问题描述&#xff1a; form 表单出查询条件需要实现 input 输入完成后键盘回车查询&#xff1a;keyup.enter“handleQuery”&#xff0c;如果 form 里只有一个input&#xff0c;回车没有触发事件&#xff0c;而是刷新页面&#xff0c;放两个input就没问题 问题原因&#xff1…...

为何页面搜索应避免左模糊和全模糊查询???

前言 在构建高效且可扩展的Web应用程序时&#xff0c;数据库查询的性能是影响用户体验的关键因素之一。特别是对于涉及大量数据的页面搜索功能&#xff0c;选择正确的查询方式不仅可以提升应用的速度&#xff0c;还能显著改善用户交互体验。 B-Tree索引与最左前缀匹配特性 1…...

源码分析之Openlayers中ZoomSlider滑块缩放控件

概述 ZoomSlider滑块缩放控件就是Zoom缩放控件的异形体&#xff0c;通过滑块的拖动或者点击滑槽&#xff0c;实现地图的缩放&#xff1b;另外其他方式控制地图缩放时&#xff0c;也会引起滑块在滑槽中的位置改变&#xff1b;即ZoomSlider滑块缩放控件会监听地图的缩放级别&…...

Cherno C++学习笔记 P46 箭头运算符

这一篇文章我们讲一下箭头运算符的使用。在之前的一些场景下&#xff0c;我们已经使用到了箭头运算符&#xff0c;这次我们可以更深入的聊一下箭头运算符应该如何使用&#xff0c;以及我们如何实现自己的箭头指针。 我们还是以一个最简单的Entity类举例&#xff1a; class En…...

项目转换微服务架构

文章目录 1.sun-dependencies引入SpringCloud的版本2. 创建sun-cloud-home微服务1.创建maven项目2.目录概览3.pom.xml4.application.yml5.application-prod.yml6.HomeApplicaion.java7.HomeController.java8.测试访问9.打包测试 3.创建sun-cloud-sku微服务1.磁盘将这个sun-clou…...

WebRTC搭建与应用(五)-Coturn踩坑记

WebRTC搭建与应用(五)-Coturn踩坑记 近期由于项目需要在研究前端WebGL渲染转为云渲染&#xff0c;借此机会对WebRTC等有了初步了解&#xff0c;在此记录一下&#xff0c;以防遗忘。 第五章 WebRTC搭建与应用(五)-Coturn踩坑记 文章目录 WebRTC搭建与应用(五)-Coturn踩坑记前…...

Uniapp 手机基座调试App 打包成Apk文件,并上传到应用商店

1.Uniapp手机基座调试App。 1.1 以下是我另一篇文章 讲解 uniapp连接手机基座调试App、 Hbuildx使用SUB运行到手机基座测试_hbuilder基座-CSDN博客 2.打包本地的uniapp项目为apk文件。 打包的方式有很多种&#xff0c;我们可以选择本地打包和远程云端打包两种方式。 我们在打包…...

【AI日记】24.12.24 kaggle 比赛 2-12

【AI论文解读】【AI知识点】【AI小项目】【AI战略思考】【AI日记】 工作 参加&#xff1a;kaggle 比赛 Regression with an Insurance Dataset时间&#xff1a;3 小时 读书 书名&#xff1a;我们能做什么 : 胡适与中国青年最真诚的分享时间&#xff1a;2 小时 律己 工作时…...

教师如何打造专属私密成绩查询系统?

期末的校园&#xff0c;被一种特殊的氛围所笼罩。老师们如同辛勤的工匠&#xff0c;精心打磨着每一个教学环节。复习阶段&#xff0c;他们在知识的宝库中精挑细选&#xff0c;把一学期的重点内容一一梳理&#xff0c;为学生们打造出系统的复习框架。课堂上&#xff0c;他们激情…...

【linux】NFS实验

NFS服务 NFS是Network File System&#xff08;网络文件系统&#xff09;的缩写。它是一种用于在计算机网络中共享文件和目录的协议。NFS允许计算机上的用户访问和操作远程计算机上的文件&#xff0c;就像访问本地文件一样。它使用客户端-服务端模型&#xff0c;其中客户端机器…...

ubuntu22.04安装PaddleX3

PaddleOCR 安装过程可以参考PaddleX本地安装教程 我的电脑环境配置&#xff1a; ubuntu22.04 cuda11.8&#xff08;之前安装的是12.4没有匹配的paddle-gpu;这里改成11.8&#xff09; 一、安装基础环境 1、 conda create -n ppx1 python3.10 2、 conda activate ppx1 3、…...

无标记动作捕捉系统如何赋能体育运动分析,推动体育科学发展?

随着技术的不断发展与社会的需要&#xff0c;健康、科学运动成为了大众关注的一个热词。在韩国首尔的中央大学&#xff0c;其生物运动临床康复实验室和运动训练中心就致力于通过生物力学分析来研究与运动相关的伤害&#xff0c;并通过定制科学的训练计划来帮助运动员改进他们的…...

JavaScript 标准内置对象——Array

1、构造函数 2、静态方法 // 从可迭代或类数组对象创建一个新的浅拷贝的数组实例 // arrayLike 想要转换成数组的类数组或可迭代对象 Array.from(arrayLike, mapFn, thisArg) Array.fromAsync(arrayLike, mapFn, thisArg) // 异步Array.isArray(value) // 判断传递的值是否是一…...

Python超能力:高级技巧让你的代码飞起来

文章一览 前言一、with1.1 基本用法1.2 示例自定义上下文管理器 二、条件表达式三、列表式推导式与 zip 结合 四、map() 函数&#xff08;内置函数&#xff09;map用于数据清洗1. 数据清洗&#xff1a;字母大小写规范2. filter() 函数 五、匿名函数 lambda5.1 lambda的参数&…...

move生态

move生态 Move 生态主要围绕着 Move 编程语言及其相关的区块链平台构建&#xff0c;这些平台旨在提供更高的安全性、可扩展性和开发者友好性。以下是关于 Move 生态的一些关键点&#xff1a; 1. 核心区块链平台 Aptos&#xff1a;Aptos 是一个 Layer 1 区块链&#xff0c;专注…...

使用插件时要注意

在使用插件时&#xff0c;需要注意一些关键事项&#xff0c;确保插件能够稳定、安全地工作&#xff0c;并且不会给系统带来风险或负担。以下是使用插件时需要注意的几个重要方面&#xff1a; 1. 插件来源与信任度 官方渠道与可靠来源&#xff1a;总是选择来自官方网站、知名平…...

JVM对象分配内存如何保证线程安全?

大家好&#xff0c;我是锋哥。今天分享关于【JVM对象分配内存如何保证线程安全&#xff1f;】面试题。希望对大家有帮助&#xff1b; JVM对象分配内存如何保证线程安全&#xff1f; 1000道 互联网大厂Java工程师 精选面试题-Java资源分享网 在JVM中&#xff0c;对象的内存分配…...

ApacheStruts2 目录遍历与文件上传漏洞复现(CVE-2024-53677,S2-067)(附脚本)

0x01 产品描述: Apache Struts 2 是一个用于JAVA的MVC框架,它用于快速开发web应用。它的设计目标是使得开发者能够更容易的处理web应用的展现层,数据层,和业务层。0x02 漏洞描述: CVE-2024-53677 漏洞的根本原因是 Struts 框架中不安全的文件上传处理机制。攻击者利用 CVE…...

Scala字符串连接方法—mkString—用法详解

Scala字符串连接方法—mkString—用法详解 在 Scala 中&#xff0c;mkString 是集合&#xff08;如数组、列表、字符串等&#xff09;的一种方法&#xff0c;用于将集合中的元素连接成一个字符串。 def mkString(sep: String): Stringdef mkString(start: String, sep: String…...

[实战]Spring Boot启动卡在Root WebApplicationContext initialization completed in

Spring Boot启动 打印Root WebApplicationContext: initialization completed in…这行日志完成后需要等很长时间才能真正启动完成。 分析一下发现是连接某个机器的MySQL就会出现这种情况。使用客户端软件连接MySQL时也很慢&#xff0c;但连接完成后执行MySQL各种语句非常看。…...

什么样的LabVIEW控制算自动控制?

自动控制是指系统通过预先设计的算法和逻辑&#xff0c;在无人工干预的情况下对被控对象的状态进行实时监测、决策和调整&#xff0c;达到预期目标的过程。LabVIEW作为一种图形化编程工具&#xff0c;非常适合开发自动控制系统。那么&#xff0c;什么样的LabVIEW控制算作“自动…...

xshell下载和安装(超详细)

参考:https://blog.csdn.net/hffh123/article/details/135885175 一、xshell官网下载 下载官网&#xff1a;https://www.xshell.com/zh/free-for-home-school/ 二、安装步骤 &#xff08;一&#xff09;、直接打开.exe文件 &#xff08;二&#xff09;、点击下一步&#xff…...

NS3学习——tcpVegas算法代码详解(2)

NS3学习——tcpVegas算法代码详解&#xff08;1&#xff09;-CSDN博客 目录 4.TcpVegas类中成员函数 (5) CongestionStateSet函数 (6) IncreaseWindow函数 1.检查是否启用 Vgas 2.判断是否完成了一个“Vegas 周期” 2.1--if&#xff1a;判断RTT样本数量是否足够 2.2--e…...

PyTorch 神经网络回归(Regression)任务:关系拟合与优化过程

PyTorch 神经网络回归&#xff08;Regression&#xff09;任务&#xff1a;关系拟合与优化过程 本教程介绍了如何使用 PyTorch 构建一个简单的神经网络来实现关系拟合&#xff0c;具体演示了从数据准备到模型训练和可视化的完整过程。首先&#xff0c;利用一维线性空间生成带噪…...

链原生 Web3 AI 网络 Chainbase 推出 AVS 主网, 拓展 EigenLayer AVS 场景

在 12 月 4 日&#xff0c;链原生的 Web3 AI 数据网络 Chainbase 正式启动了 Chainbase AVS 主网&#xff0c;同时发布了首批 20 个 AVS 节点运营商名单。Chainbase AVS 是 EigenLayer AVS 中首个以数据智能为应用导向的主网 AVS&#xff0c;其采用四层网络架构&#xff0c;其中…...

es 3期 第18节-分页查询使用避坑的一些事

#### 1.Elasticsearch是数据库&#xff0c;不是普通的Java应用程序&#xff0c;传统数据库需要的硬件资源同样需要&#xff0c;提升性能最有效的就是升级硬件。 #### 2.Elasticsearch是文档型数据库&#xff0c;不是关系型数据库&#xff0c;不具备严格的ACID事务特性&#xff…...

linux检测硬盘

通过fdisk 查看显示所有磁盘或闪存的信息 fdisk -l /dev/sd*使用 badlocks检查 linux 硬盘上的坏道/坏块。也可以修复坏道&#xff0c;但仅限于逻辑坏道&#xff0c;物理坏道只能更换硬盘 badblocks -s -v /dev/vdb1 > /badblocks-vdb1.txt tail -f badblocks-vdb1.txt #检…...

Unity3d 基于UGUI和VideoPlayer 实现一个多功能视频播放器功能(含源码)

前言 随着Unity3d引擎在数字沙盘、智慧工厂、数字孪生等场景的广泛应用&#xff0c;视频已成为系统程序中展示时&#xff0c;不可或缺的一部分。在 Unity3d 中&#xff0c;我们可以通过强大的 VideoPlayer 组件和灵活的 UGUI 系统&#xff0c;将视频播放功能无缝集成到用户界面…...

Ubuntu22.04 LTS 安装nvidia显卡驱动

准备跑老师给定的Github上的多模态源码,但是用了这么久ubuntu还没有尝试过安装nvidia驱动,好在也是一次成功,于是记录下来。 借鉴的是Ubuntu22.04安装显卡驱动(高速、避错版)-CSDN博客这篇文章,按照流程来基本没有问题,不过个人觉得有些步骤比较冗余,所以记录下来 主要…...

Linux编程(清华大学出版社2019年1月第1版)第5章课后作业

5.1 对于执行在时间上有重叠的逻辑流&#xff0c;称为并发流&#xff0c;并发流是并发的 并发不并发并发 5.2 几个箭头几个状态转换关系&#xff0c;箭头上写了可能原因。 在就绪状态不会执行指令&#xff0c;不会有IO请求或主动wait的情况&#xff0c;不会有从就绪状态到阻…...

相机雷达外参标定综述“Automatic targetless LiDAR–camera calibration: a survey“

相机雷达外参标定综述--Automatic targetless LiDAR–camera calibration: a survey 前言1 Introduction2 Background3 Automatic targetless LiDAR–camera calibration3.1 Information theory based method(信息论方法)3.1.1 Pairs of point cloud and image attributes(属性…...

JSON 系列之1:将 JSON 数据存储在 Oracle 数据库中

本文为Oracle数据库JSON学习系列的第一篇&#xff0c;讲述如何将JSON文档存储到数据库中&#xff0c;包括了版本为19c和23ai的情形。 19c中的JSON 先来看一下数据库版本为19c时的情形。 创建表colortab&#xff0c;其中color列的长度设为4000。若color的长度需要设为32767&a…...

分布式专题(10)之ShardingSphere分库分表实战指南

一、ShardingSphere产品介绍 Apache ShardingSphere 是一款分布式的数据库生态系统&#xff0c; 可以将任意数据库转换为分布式数据库&#xff0c;并通过数据分片、弹性伸缩、加密等能力对原有数据库进行增强。Apache ShardingSphere 设计哲学为 Database Plus&#xff0c;旨在…...

支付宝订单码支付

1.订单码支付&#xff0c;首先下载官方网站提供的sdk包到你的项目中。 2.选择控制器复制官方文档的获取二维码相关的代码示例。打开sdk包中v2的index.php文件&#xff0c;这个才是你选择语言的具体代码。 3.引用里面所需要的类文件&#xff0c;文件下载到你的项目中后&#xf…...

使用 Django 和 AWS ECR 实现容器化应用的管理

在现代云原生应用的开发和部署中,容器化技术已经成为主流。Amazon Elastic Container Registry (ECR) 是一种完全管理的 Docker 容器注册表服务,可以与 Amazon ECS、EKS 和其他容器服务无缝集成。在这篇文章中,我们将介绍如何使用 Django 和 AWS ECR 实现集成管理,包括创建、更…...

DeepWalk 原理详解

概述&#xff1a; DeepWalk 是一种流行的图嵌入方法&#xff0c;用于学习图结构数据中节点的低维表示。它通过将图的节点视作序列数据&#xff0c;利用自然语言处理中的技术&#xff08;类似于word2vec算法&#xff09;来捕捉节点间的关系&#xff0c;可以帮助我们理解和利用图…...

深入理解批量归一化(BN):原理、缺陷与跨小批量归一化(CmBN)

在训练深度神经网络时&#xff0c;批量归一化&#xff08;Batch Normalization&#xff0c;简称BN&#xff09;是一种常用且有效的技术&#xff0c;它帮助解决了深度学习中训练过程中的梯度消失、梯度爆炸和训练不稳定等。然而&#xff0c;BN也有一些局限性&#xff0c;特别是在…...

基于Spring Boot的雅苑小区管理系统

一、系统背景与意义 随着信息化技术的快速发展&#xff0c;传统的小区物业管理方式已经难以满足现代居民对于高效、便捷服务的需求。因此&#xff0c;开发一款基于Spring Boot的小区管理系统显得尤为重要。该系统旨在通过信息化手段&#xff0c;实现小区物业管理的智能化、自动…...

物理层知识要点

文章目录 物理层接口的四大特性通信基础编码和调制&#xff08;1&#xff09;数字数据编码为数字信号&#xff08;2&#xff09;模拟数据编码为数字信号&#xff08;3&#xff09;常见调制方式&#xff08;3&#xff09;信道的极限容量 多路复用技术数据传输方式物理层下的传输…...

项目里用到了哪些设计模式是怎么使用的?

在软件开发项目中&#xff0c;设计模式是解决特定问题的通用模板或最佳实践。它们提供了一种经过验证的方式来组织代码&#xff0c;使其更易于理解、维护和扩展。下面我将详细介绍一些常见的设计模式及其在项目中的应用方式。 1. 单例模式&#xff08;Singleton Pattern&#…...