byte二维码在img中展示

发表于2022-01-07|更新于2026-02-24

|浏览量:

睡在哪里都是睡在黑夜里。——贾平凹《废都》

我们使用hutool的工具类生成二维码图片后，如果转为byte数组，返还给前端，我们要放入img中显示

@GetMapping("generateCode")
@ResponseBody
public byte[] generateCode() {
    return QrCodeUtil.generatePng("https://VampireAchao.github.io/", QrConfig.create().setImg(ImgUtil.getImage(URLUtil.url("/img/oss/2020-06-01/head.jpg"))));
}

直接放到src是不行的，需要在前面加一个data:image/jpeg;base64,

最终变成这样

效果图：

前端

相关推荐

2022-10-30

designMode

保持友谊的最好办法是不出卖朋友——米兹涅尔我们可以使用 1document.designMode = 'on' 来开启页面的编辑模式例如：

2020-08-28

js网页离开时标签栏闪烁效果

之前有朋友问我博客里浏览器标签栏闪烁效果怎么做的今天把代码贴出来吧 123456789101112131415161718192021222324252627282930313233343536373839// 使用message对象封装消息 var message = { time: 0, title: document.title, timer: null, // 显示新消息提示 show: function () { var title = message.title.replace("【　　　】", "").replace("【新消息】", ""); // 定时器，设置消息切换频率闪烁效果就此产生 message.timer = setTimeout(funct...

2020-08-27

安全密码正则

当你回首往事时，不因碌碌无为而悔恨，不为虚度年华而羞耻，那你就可以很骄傲地和自己讲，你不负此生! 今天分享一个密码的正则，密码必须包含大、小写字母、数字、特殊符号至少三种,且长度为8-20 1^(?![a-zA-Z]+$)(?![A-Z0-9]+$)(?![A-Z\W_!@#$%^&*`~()-+=]+$)(?![a-z0-9]+$)(?![a-z\W_!@#$%^&*`~()-+=]+$)(?![0-9\W_!@#$%^&*`~()-+=]+$)[a-zA-Z0-9\W_!@#$%^&*`~()-+=]{8,20}$ javascript代码 123if (!(/^(?![a-zA-Z]+$)(?![A-Z0-9]+$)(?![A-Z\W_!@#$%^&*`~()-+=]+$)(?![a-z0-9]+$)(?![a-z\W_!@#$%^&*`~()-+=]+$)(?![0-9\W_!@#$%^&*`~()-+=]+$)[a-zA-Z0-9\W_!@#$%^&*`~()-+=]{8...

2022-04-03

vue中特殊的prop和事件

懒惰等于将一个人活埋。——泰勒我们知道v-model可以用于input等标签，当做语法糖进行绑值对于我们自定义的组件，其实也可以使用官方文档例如此处我们可以让input改变值时，父组件绑定的值一并改变 1234567891011121314151617<template> <input type="checkbox" :checked="value" @change="$emit('input', $event.target.checked)" /></template><script> export default{ props:{ value:{ type:Boolean, default:()=>false } ...

2021-06-20

vue页面加载完毕之后执行

好奇心造就科学家和诗人。——法朗士当vue页面加载完成后触发我们在html开发中经常是使用window.onload实现 123window.onload = () => { } 但在vue中我们使用this.$nextTick 123this.$nextTick(() => { console.log("页面加载完啦~")}) 效果如下

2025-10-01

x402

人们宁愿去关心一个蹩脚电影演员的吃喝拉撒和鸡毛蒜皮，而不愿了解一个普通人波涛汹涌的内心世界。——路遥《平凡的世界》 x402：为互联网打造的下一代支付协议——Coinbase 的开放支付协议全解析在加密货币和 Web3 世界不断进化的今天，支付系统依然是“链上应用到现实世界”最核心的基础设施之一。Coinbase 推出的 x402 项目，正试图用开放协议的思路，重新定义互联网支付的连接方式。本文将带你深入了解 x402 的项目定位、技术亮点、典型用法和未来前景。一、项目概览项目地址：coinbase/x402 官网：https://x402.org 一句话描述：A payments protocol for the internet. Built on HTTP. 主语言：TypeScript 开源协议：Apache 2.0 Star：1825+，Fork：286+，Issue：104+，社区活跃二、x402 要解决什么问题？x402 的目标是：让任何 Web 服务都能像集成 HTTP 一样，快速、安全地集成加密支付/微支付能力。开放协议：...

阿超

我的名字叫阿超年龄25岁家在北京市职业是软件开发每天最晚也会在八点前回家不抽烟酒浅尝辄止晚上十二点上床保证睡足八个小时睡前写一篇博客再做二十分钟俯卧撑暖身然后再睡觉基本能熟睡到天亮像婴儿一样不留下任何疲劳和压力就这样迎来第二天的早晨健康检查结果也显示我很正常我想说明我是一个不论何时都追求内心平稳的人不拘泥于胜负不纠结于烦恼不树立使我夜不能寐的敌人这就是我在这社会的生活态度

数据加载中