后端生成二维码,前端请求接口生成二维码并展示,且多个参数后边的参数没有正常传输问题处理
一、后端代码
1、controller
@GetMapping("/generateQRCode/{url}")@ApiOperation(value = "生成url链接二维码",notes = "生成url链接二维码")public JsonResult<NewsQRCodeVo> generateQRCode(@PathVariable String url,HttpServletResponse servletResponse) {NewsQRCodeVo response=new NewsQRCodeVo();try {QRCodeUtil.createCodeToOutputStream(url,servletResponse.getOutputStream());}catch (Exception e){throw new InformationException("生成二维码失败", InformationErrCode.NORMAL_CODE.getErrCode());}return JsonResult.ok(response);}
2、NewsQRCodeVo
@Data
@ApiModel(description = "新闻二维码Vo")
public class NewsQRCodeVo {@ApiModelProperty(value = "newsId")private String newsId;@ApiModelProperty(value = "新闻二维码图片")private String newsQRCodePic;}
3、QRCodeUtil
import com.google.zxing.BarcodeFormat;
import com.google.zxing.EncodeHintType;
import com.google.zxing.MultiFormatWriter;
import com.google.zxing.WriterException;
import com.google.zxing.common.BitMatrix;
import com.google.zxing.qrcode.decoder.ErrorCorrectionLevel;
import lombok.extern.slf4j.Slf4j;
import org.apache.commons.lang3.StringUtils;import javax.imageio.ImageIO;
import javax.swing.filechooser.FileSystemView;
import java.awt.image.BufferedImage;
import java.io.File;
import java.io.OutputStream;
import java.util.HashMap;
import java.util.Map;/*** @author Created by wcg* @Date 2025/1/24 10:56*/
@Slf4j
public class QRCodeUtil {//CODE_WIDTH:二维码宽度,单位像素private static final int CODE_WIDTH = 400;//CODE_HEIGHT:二维码高度,单位像素private static final int CODE_HEIGHT = 400;//FRONT_COLOR:二维码前景色,0x000000 表示黑色private static final int FRONT_COLOR = 0x000000;//BACKGROUND_COLOR:二维码背景色,0xFFFFFF 表示白色//演示用 16 进制表示,和前端页面 CSS 的取色是一样的,注意前后景颜色应该对比明显,如常见的黑白private static final int BACKGROUND_COLOR = 0xFFFFFF;public static void createCodeToFile(String content, File codeImgFileSaveDir, String fileName) {try {if (StringUtils.isBlank(content) || StringUtils.isBlank(fileName)) {return;}content = content.trim();if (codeImgFileSaveDir==null || codeImgFileSaveDir.isFile()) {//二维码图片存在目录为空,默认放在桌面...codeImgFileSaveDir = FileSystemView.getFileSystemView().getHomeDirectory();}if (!codeImgFileSaveDir.exists()) {//二维码图片存在目录不存在,开始创建...codeImgFileSaveDir.mkdirs();}//核心代码-生成二维码BufferedImage bufferedImage = getBufferedImage(content);File codeImgFile = new File(codeImgFileSaveDir, fileName);ImageIO.write(bufferedImage, "png", codeImgFile);log.info("二维码图片生成成功:" + codeImgFile.getPath());} catch (Exception e) {e.printStackTrace();}}/*** 生成二维码并输出到输出流, 通常用于输出到网页上进行显示,输出到网页与输出到磁盘上的文件中,区别在于最后一句 ImageIO.write* write(RenderedImage im,String formatName,File output):写到文件中* write(RenderedImage im,String formatName,OutputStream output):输出到输出流中* @param content :二维码内容* @param outputStream :输出流,比如 HttpServletResponse 的 getOutputStream*/public static void createCodeToOutputStream(String content, OutputStream outputStream) {try {if (StringUtils.isBlank(content)) {return;}content = content.trim();//核心代码-生成二维码BufferedImage bufferedImage = getBufferedImage(content);//区别就是这一句,输出到输出流中,如果第三个参数是 File,则输出到文件中ImageIO.write(bufferedImage, "png", outputStream);log.info("二维码图片生成到输出流成功...");} catch (Exception e) {e.printStackTrace();}}//核心代码-生成二维码private static BufferedImage getBufferedImage(String content) throws WriterException {//com.google.zxing.EncodeHintType:编码提示类型,枚举类型Map<EncodeHintType, Object> hints = new HashMap();//EncodeHintType.CHARACTER_SET:设置字符编码类型hints.put(EncodeHintType.CHARACTER_SET, "UTF-8");//EncodeHintType.ERROR_CORRECTION:设置误差校正//ErrorCorrectionLevel:误差校正等级,L = ~7% correction、M = ~15% correction、Q = ~25% correction、H = ~30% correction//不设置时,默认为 L 等级,等级不一样,生成的图案不同,但扫描的结果是一样的hints.put(EncodeHintType.ERROR_CORRECTION, ErrorCorrectionLevel.M);//EncodeHintType.MARGIN:设置二维码边距,单位像素,值越小,二维码距离四周越近hints.put(EncodeHintType.MARGIN, 1);MultiFormatWriter multiFormatWriter = new MultiFormatWriter();BitMatrix bitMatrix = multiFormatWriter.encode(content, BarcodeFormat.QR_CODE, CODE_WIDTH, CODE_HEIGHT, hints);BufferedImage bufferedImage = new BufferedImage(CODE_WIDTH, CODE_HEIGHT, BufferedImage.TYPE_INT_BGR);for (int x = 0; x < CODE_WIDTH; x++) {for (int y = 0; y < CODE_HEIGHT; y++) {bufferedImage.setRGB(x, y, bitMatrix.get(x, y) ? FRONT_COLOR : BACKGROUND_COLOR);}}return bufferedImage;}}
4、pom依赖
<!-- zxing生成二维码 --><dependency><groupId>com.google.zxing</groupId><artifactId>core</artifactId><version>3.3.3</version></dependency>
这样前端传一个utl完整地址,就可以直接得到二维码图片流了,测试看一下;
http://localhost:19900/api/v1/spider/paramGenerateQRCode?url=https://blog.csdn.net/qq18346342939/article/details/140149193?spm=1001.2014.3001.5502
最后扫码就是我上边输入的那个地址,测试成功,然后我们可以前端如何处理:
二、前端
1、最开始我是这样处理的,二维码生成,但是过后发现我的页面链接是有2个参数的,第二个参数是&id=xxx,实际扫码的时候会少id这个参数
<span class="span_b"><div class="qr-code" id="qrCode"><img id="qrImage" src="http://localhost:19900/api/v1/spider/paramGenerateQRCode?url=${window.location.href}" alt="QR Code" style="width: 100%; height: 100%;"></div>
</span>
2、最后花费了不少时间处理,原来是传参对于&等这类符号会读取异常,后边是(+、&、^等)会无法传输,然后说用encodeURIComponent包裹一下就行好了,但是包裹方式如下图,结果才好使
附代码:
<span class="span_b"><div class="qr-code" id="qrCode"><img id="qrImage" src="http://localhost:19900/api/v1/spider/paramGenerateQRCode?url=${encodeURIComponent(window.location.href)}" alt="QR Code" style="width: 100%; height: 100%;"></div>
</span>/* 二维码容器的样式 */
.share_list i .share_bottom .bottom_text .span_b .qr-code {width: 120px;height: 120px;border: 1px solid #ddd;
}
最后这样才完全好使了!
相关文章:
后端生成二维码,前端请求接口生成二维码并展示,且多个参数后边的参数没有正常传输问题处理
一、后端代码 1、controller GetMapping("/generateQRCode/{url}")ApiOperation(value "生成url链接二维码",notes "生成url链接二维码")public JsonResult<NewsQRCodeVo> generateQRCode(PathVariable String url,HttpServletRespons…...
NBT群落物种级丰度鉴定新方法sylph
文章目录 简介为什么选择Sylph?Sylph的工作原理 Install使用解析成gtdb格式sylph 能做什么?sylph 不能做什么?ANI定义如何使用 sylph-utils 生成包含分类信息的配置文件耗时:66个样本耗时1h 转成easymicroplot可用数据 简介 Sylp…...
长视频生成、尝试性检索、任务推理 | Big Model Weekly 第56期
点击蓝字 关注我们 AI TIME欢迎每一位AI爱好者的加入! 01 COMAL:AConvergent Meta-Algorithm for Aligning LLMs with General Preferences 许多对齐方法,包括基于人类反馈的强化学习(RLHF),依赖于布拉德利-特里&#…...
使用右侧值现象来处理一个word导入登记表的需求
需求也简单,导word文件用户登记表,有各部门的十几个版本(为什么这么多?不知道)。这里说下谈下我的一些代码做法: 需求分析: 如果能解决java字段和各项填的值怎么配对的问题,那么就…...
FRRouting配置与OSPF介绍,配置,命令,bfd算法:
文章目录 1、frrouting的配置:2、ospf2.1、检测和维护邻居关系2.2、ospfDR和BDR2.3、odpf邻居表2.4、ospf常用命令2.5、bfd配置 1、frrouting的配置: sudo service zebra start sudo service ospfd start telnet localhost 2604 en configure termina…...
基于ThinkPHP 5~8兼容的推荐算法类实现,
在现代推荐系统中,随着用户量和物品量的增长,传统的推荐算法可能会面临性能瓶颈。本文将介绍如何基于 ThinkPHP 实现一个高性能的推荐系统,结合显性反馈(如兴趣选择)、隐性反馈(如观看时长、评论、点赞、搜…...
使用Python爬虫实时监控行业新闻案例
目录 背景环境准备请求网页数据解析网页数据定时任务综合代码使用代理IP提升稳定性运行截图与完整代码总结 在互联网时代,新闻的实时性和时效性变得尤为重要。很多行业、技术、商业等领域的新闻都可以为公司或者个人发展提供有价值的信息。如果你有一项需求是要实时…...
kong身份认证插件详解之Basic Auth插件
1.3、Basic Authentication 支持基于用户名和密码的基本认证,通常用于简单的身份验证场景。 1.3.1、环境准备 1.3.1.1、创建一个服务,basic-auth-service curl -i -s -X POST http://localhost:8001/services \--data namebasic-auth-service \--dat…...
Copilot基于企业PPT模板生成演示文稿
关于copilot创建PPT,咱们写过较多文章了: Copilot for PowerPoint通过文件创建PPT Copilot如何将word文稿一键转为PPT Copilot一键将PDF转为PPT,治好了我的精神内耗 测评Copilot和ChatGPT-4o从PDF创建PPT功能 Copilot for PPT全新功能&a…...
用React实现一个登录界面
使用React来创建一个简单的登录表单。以下是一个基本的React登录界面示例: 1. 设置React项目 如果你还没有一个React项目,你可以使用Create React App来创建一个。按照之前的步骤安装Create React App,然后创建一个新项目。 2. 创建登录组…...
前端布局的方式有哪些
前端布局的方式有哪些 在前端开发里,布局就像是装修房子,把不同的东西合理地摆放在合适的位置,让整个空间既美观又实用。下面给你介绍几种常见的前端布局方式: 1. 普通流布局(标准文档流布局) 这就像是按…...
seata集成nacos
#nacos集成nacos并配置mysql数据源 1. 所需依赖 <!--seata 分布式事务--><dependency><groupId>com.alibaba.cloud</groupId><artifactId>spring-cloud-starter-alibaba-seata</artifactId></dependency> 2. 打开seata目录ÿ…...
第29篇 基于ARM A9处理器用C语言实现中断<五>
Q:怎样设计基于ARM A9处理器的C语言程序使用定时器中断实现实时时钟? A:在上一期的程序中添加A9 Private Timer作为第三个中断源,配置该定时器使其每隔0.01秒产生一次中断。使用该定时器使全局变量time的值递增,并将…...
deepseek多列数据对比,联想到excel的高级筛选功能
目录 1 业务背景 2 deepseek提示词输入 3 联想分析 4 EXCEL高级搜索 1 业务背景 系统上线的时候经常会遇到一个问题,系统导入的数据和线下的EXCEL数据是否一致,如果不一致,如何快速找到差异值,原来脑海第一反应就是使用公…...
C 程序多线程拆分文件
C 程序多线程拆分文件 在C语言中,实现多线程来拆分文件通常需要借助多线程库,比如 POSIX 线程库(pthread)或者 Windows 的线程库(CreateThread 或类似的函数)。下面我将分别展示在 Linux 和 Windows 环境下…...
mysql 使用 CONCAT、GROUP_CONCAT 嵌套查询出 json 格式数据
tb_factory表由 factory_code 和 factory_name 字段,查询出如下所示效果: {"factory_0001": "工厂1","factory_0002": "工厂2",... } select sql: SELECT CONCAT( "{",GROUP_CONCAT( C…...
Leetcode 2466. Count Ways To Build Good Strings
Problem Given the integers zero, one, low, and high, we can construct a string by starting with an empty string, and then at each step perform either of the following: Append the character ‘0’ zero times.Append the character ‘1’ one times. This can …...
分布式 IO 模块:食品罐装产线自动化与高效运行的推手
在当今竞争激烈的罐装视频生产行业,如何实现产线的自动化与连续性高效运行,成为了众多企业追求的核心目标。明达技术推出的MR30分布式 IO 模块作为一种先进的工业控制技术,正逐渐崭露头角,为食品罐装产线带来了前所未有的变革。 痛…...
rustdesk编译修改名字
最近,我用Rust重写了一个2W行C代码的linux内核模块。在此记录一点经验。我此前没写过内核模块,认识比较疏浅,有错误欢迎指正。 为什么要重写? 这个模块2W行代码量看起来不多,却在线上时常故障,永远改不完。…...
MySQL 窗口函数:功能、使用场景与性能优化
MySQL 8.0 引入了一个强大的新特性——**窗口函数(Window Functions)**。它为数据分析和复杂查询提供了极大的便利,但同时也可能带来性能问题。本文将带你快速了解窗口函数的功能、使用场景以及如何优化性能。 --- ## **什么是窗口函数&#…...
数据权限校验实践
数据权限控制实践 最近在实习中为公司项目完成一个文件数据权限校验代码的转换重构,写这篇博客来记录前后两种权限校验的实现方案与相关概念 原实现方案:RBAC-基于角色的访问控制 RBAC(Role-Based Access Control) RBAC 是一种常…...
spring boot对接clerk 实现用户信息获取
在现代Web应用中,用户身份验证和管理是一个关键的功能。Clerk是一个提供身份验证和用户管理的服务,可以帮助开发者快速集成这些功能。在本文中,我们将介绍如何使用Spring Boot对接Clerk,以实现用户信息的获取。 1.介绍 Clerk提供…...
公网远程家里局域网电脑过程详细记录,包含设置路由器。
由于从校内迁居小区,校内需要远程控制访问小区内个人电脑,于是早些时间刚好自己是电信宽带,可以申请公网ipv4不需要花钱,所以就打电话直接申请即可,申请成功后访问光猫设备管理界面192.168.1.1,输入用户名密码登录超管(密码是网上查下就有了)设置了光猫为桥接模式,然后…...
自制简单的图片查看器()
图片格式:支持常见的图片格式(JPG、PNG、BMP、GIF)。 import os import tkinter as tk from tkinter import filedialog, messagebox from PIL import Image, ImageTkclass ImageViewer:def __init__(self, root):self.root rootself.root.…...
25/2/17 <嵌入式笔记> 桌宠代码解析
这个寒假跟着做了一个开源的桌宠,我们来解析下代码,加深理解。 代码中有开源作者的名字。可以去B站搜着跟着做。 首先看下main代码 #include "stm32f10x.h" // Device header #include "Delay.h" #include &quo…...
Kafka偏移量管理全攻略:从基础概念到高级操作实战
#作者:猎人 文章目录 前言:概念剖析kafka的两种位移消费位移消息的位移位移的提交自动提交手动提交 1、使用--to-earliest重置消费组消费指定topic进度2、使用--to-offset重置消费offset3、使用--to-datetime策略指定时间重置offset4、使用--to-current…...
python中使用日期和时间差:datetime模块
datetime模块的表示时间的有 datetime.datetime #时间包含年月日时分秒毫秒 datetime.date #时间只包含年月日 datetime.time #只包含时分秒 获取当前时间 import datetime now datetime.datetime.now() print(now)得到 atetime中的年月日时分秒可以分别取出来 import da…...
申论对策建议类【2022江苏B卷第一题“如何开展网络直播”】
材料: 近年来,公安交管部门通过网络直播,将执法过程和执法细节以视频形式呈现在公众面前,吸引“围观”、组织点评,让执法过程变成一堂生动的法治公开课。 “各位网友,大家好!这里是‘全国交通…...
Blazor-父子组件传递任意参数
在我们从父组件传参数给子组件时,可以通过子组件定义的[Parameter]特性的公开属性进行传值,但是当我们需要传递多个值的时候,就需要通过[Parameter]特性定义多个属性,有没有更简便的方式? 我们可以使用定义 IDictionar…...
Python的那些事第二十三篇:Express(Node.js)与 Python:一场跨语言的浪漫邂逅
摘要 在当今的编程世界里,Node.js 和 Python 像是两个性格迥异的超级英雄,一个以速度和灵活性著称,另一个则以强大和优雅闻名。本文将探讨如何通过 Express 框架将 Node.js 和 Python 结合起来,打造出一个高效、有趣的 Web 应用。我们将通过一系列幽默风趣的实例和表格,展…...
win11安装wsl报错:无法解析服务器的名称或地址(启用wsl2)
1. 启用wsl报错如下 # 查看可安装的 wsl --install wsl --list --online此原因是因为没有开启DNS的原因,所以需要我们手动开启DNS。 2. 按照如下配置即可 Google的DNS(8.8.8.8和8.8.4.4) 全国通用DNS地址 (114.114.114.114) 3. 运行以下命令来重启 WSL…...
【设计模式】【结构型模式】桥接模式(Bridge)
👋hi,我不是一名外包公司的员工,也不会偷吃茶水间的零食,我的梦想是能写高端CRUD 🔥 2025本人正在沉淀中… 博客更新速度 👍 欢迎点赞、收藏、关注,跟上我的更新节奏 🎵 当你的天空突…...
1997-2019年各省进出口总额数据
1997-2019年各省进出口总额数据 1、时间:1997-2020年 2、来源:国家统计局、各省年鉴 3、指标:进出口总额 4、范围:31省 5、指标解释:进出口总额是指以货币表示的一定时期内一国实际进出口商品的总金额ÿ…...
AI前端开发效率革命:拥抱AI,开启前端开发新纪元
前端开发行业竞争日益激烈,项目交付周期不断缩短,对开发效率的要求也越来越高。在这种高压环境下,开发者们常常面临着巨大的压力。而近年来,人工智能技术的飞速发展,特别是AI写代码工具的出现,为前端开发带…...
Rust编程语言入门教程(一)安装Rust
目录 引言一、为什么要用 Rust?二、与其他语言比较三、Rust 特别擅长的领域四、Rust 与 Firefox五、Rust 的用户和案例六、Rust 的优缺点七、安装 Rust1、访问官网下载 Rust2、下载完成,执行exe文件 八、Rust 安装验证九、开发工具结束语 引言 在当今快…...
Kubernetes控制平面组件:Kubernetes如何使用etcd
云原生学习路线导航页(持续更新中) kubernetes学习系列快捷链接 Kubernetes架构原则和对象设计(一)Kubernetes架构原则和对象设计(二)Kubernetes架构原则和对象设计(三)Kubernetes控…...
2025年-G4-Lc78--121. 买卖股票的最佳时机--(java版)
1.题目描述 2.思路 思路1: 做两轮排序,第一轮排序找到最小的那个数,然后再判断最小的那个数之后还有其他数吗,如果有在进行排序,选出最大的那个数,然后值相减。 问题要点: (1)你需要…...
LabVIEW 中的 3dgraph.llb 库
3dgraph.llb 库位于 C:\Program Files (x86)\National Instruments\LabVIEW 2019\vi.lib\Platform 目录下,是 LabVIEW 系统中用于 3D 图形相关操作的重要库。它为 LabVIEW 用户提供了丰富的功能,能在应用程序中创建、显示和交互各种 3D 图形,…...
通过VSCode直接连接使用 GPT的编程助手
GPT的编程助手在VSC上可以直接使用 选择相应的版本都可以正常使用。每个月可以使用40条,超过限制要付费。 如下图对应的4o和claude3.5等模型都可以使用。VSC直接连接即可。 配置步骤如下: 安装VSCODE 直接,官网下载就行 https://code.vis…...
[LeetCode力扣hot100]-C++常用数据结构
0.Vector 1.Set-常用滑动窗口 set<char> ans;//根据类型定义,像vector ans.count()//检查某个元素是否在set里,1在0不在 ans.insert();//插入元素 ans.erase()//删除某个指定元素 2.栈 3.树 树是一种特殊的数据结构,力扣二叉树相…...
2-安装YIUI
YIUI框架:GitHub - LiShengYang-yiyi/YIUI: Unity3D UGUI Framework, 基于UI数据事件绑定为核心 数据驱动的UGUI框架, ETUI框架, ET框架官方推荐UI框架 ET框架:egametang/ET: Unity3D Client And C# Server Framework (github.com) 1 - 安装YIUI框架&a…...
16-使用QtChart创建动态图表:入门指南
QtChart是Qt框架中的一个强大模块,用于创建各种类型的图表,如折线图、柱状图、饼图等。它提供了丰富的API和灵活的配置选项,使得开发者能够轻松地将数据可视化集成到应用程序中。本文将介绍如何使用QtChart创建一个简单的动态折线图ÿ…...
蓝耘智算携手DeepSeek,共创AI未来
🌟 各位看官号,我是egoist2023! 🌍 种一棵树最好是十年前,其次是现在! 🚀 今天来学习如何通过蓝耘智算使用DeepSeek R1模型 👍 如果觉得这篇文章有帮助,欢迎您一键三连&a…...
具身智能在智能巡检机器人中的应用——以开关柜带电操作机器人为例
随着机器人技术和人工智能的迅速发展,具身智能在各行业的应用日益广泛,尤其是在电力行业中的智能巡检领域。传统的电力巡检和维护工作通常需要人工操作,存在着高温、高压、强电磁场等危险环境,且效率较低。开关柜带电操作机器人作…...
【第4章:循环神经网络(RNN)与长短时记忆网络(LSTM)— 4.6 RNN与LSTM的变体与发展趋势】
引言:时间序列的魔法钥匙 在时间的长河中,信息如同涓涓细流,绵延不绝。而如何在这无尽的数据流中捕捉、理解和预测,正是循环神经网络(RNN)及其变体长短时记忆网络(LSTM)所擅长的。今天,我们就来一场深度探索,揭开RNN与LSTM的神秘面纱,看看它们如何在时间序列的海洋…...
【R语言】回归分析与判别分析
一、线性回归分析 1、lm()函数 lm()函数是用于拟合线性模型(Linear Models)的主要函数。线性模型是一种统计方法,用于描述一个或多个自变量(预测变量、解释变量)与因变量(响应变量)之间的关系…...
git开发流程以及github社区企业版
常规开发流程 1、将仓库 clone 到本地,已经 clone 的要 fetch & pull,保证本地 master 分支已经更新到最新状态 2、在 master 最新分支的基础上 checkout 一个开发分支,分支命名要求规范,如带用户名、日期、bug id 等关键信…...
DeepSeek + Vue实战开发
利用DeepSeek V3模型、siliconflow大模型一站式云服务平台以及vue3.0实现一个在线人工智能客服对话系统。 因为deepseek官网的api密钥使用起来比较缓慢,所以可以使用第三方的,具体操作请自行查阅资料。 siliconflow官网 SiliconFlow, Accelerate AGI …...
从安装软件到flask框架搭建可视化大屏(二)——创建一个flask页面,搭建可视化大屏,零基础也可以学会
附录:所有文件的完整代码 models.py # models/models.py from flask_sqlalchemy import SQLAlchemydb SQLAlchemy()class User(db.Model):__tablename__ user # 显式指定表名为 userid db.Column(db.Integer, primary_keyTrue)username db.Column(db.String(…...
Python编程中,async/await/asyncio分别是干啥的?
在Python异步编程中,async、await和asyncio是三个核心概念。它们共同构成了Python处理高并发I/O密集型任务的解决方案。本文将通过代码实例解析它们的作用和用法。 一、异步编程基础 1.1 同步 vs 异步 同步编程:代码按顺序执行,遇到I/O操作(如网络请求、文件读写)时会阻塞…...