news 2026/4/18 15:21:16

链接是如何生成二维码的?一文讲清背后的原理

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
链接是如何生成二维码的?一文讲清背后的原理

在日常生活中,我们早已习惯了“复制链接 → 生成二维码 → 扫一扫打开网页”这一套操作。
但你有没有想过一个问题:

一个看起来只是由黑白方块组成的图片,为什么能准确地打开某个网页?

本文将从工程和原理的角度,带你一步步拆解:链接生成二维码的底层逻辑


一、先说结论:二维码里到底存了什么?

很多人会下意识认为:

二维码里“存的是网页跳转逻辑”

但实际上并不是。

结论很简单:

二维码里存的,只是一段文本字符串。

比如:

https://example.com/article/123

二维码本身并不知道“网页”“浏览器”“跳转”这些概念,它只是把这段字符串,用一种规则编码成了图形。


二、二维码的本质:二维条形码

二维码(QR Code)属于一种二维条形码(2D Barcode)

和超市里常见的一维条码相比:

对比项一维条码二维码
存储方向横向横向 + 纵向
数据容量很小较大
常见用途商品编号链接、支付、文本

正因为二维码是“二维”的,它才能在有限面积内存下更多信息。


三、链接生成二维码的完整流程

从「输入一个链接」到「生成一张二维码图片」,中间大致会经历下面 6 个步骤。

1️⃣ 输入链接(原始数据)

最开始,二维码生成器拿到的只是一个普通字符串:

https://example.com

这一步不涉及网络,也不访问网页


2️⃣ 数据类型分析(选择编码模式)

二维码规范(ISO/IEC 18004)定义了多种编码模式:

  • 数字模式

  • 字母数字模式

  • Byte 模式(UTF-8)

URL 链接通常会使用Byte 模式,因为它最通用。


3️⃣ 字符串 → 二进制数据

接下来,字符串会被转成二进制比特流(简化示意):

h → 01101000 t → 01110100 t → 01110100 p → 01110000 ...

同时还会附加:

  • 模式指示符

  • 数据长度信息

这些都是为了让“扫码器”知道该如何正确解码。


4️⃣ 生成纠错码(二维码的灵魂)

这是二维码最关键、也最容易被忽略的一步。

二维码会使用Reed-Solomon 纠错算法,生成一定比例的冗余数据,用来:

  • 抵抗污损

  • 抵抗遮挡

  • 提高识别成功率

这也是为什么:

  • 二维码被挡住一角还能扫

  • 中间可以放 Logo


5️⃣ 填充成黑白模块矩阵

所有的二进制数据会被填充进一个正方形矩阵中:

  • 黑色方块 = 1

  • 白色方块 = 0

同时还会加入一些固定结构

  • 左上、右上、左下的定位符

  • 校正图形

  • 格式信息区

这些结构帮助扫码设备快速“定位”和“对齐”二维码。


6️⃣ 渲染成图片文件

最后一步只是绘图:

  • 把每个模块画成一个小方块

  • 导出成 PNG / SVG / Canvas

至此,一张二维码图片就生成了。


四、那为什么扫码后能“自动打开网页”?

这里有一个常见误解需要澄清:

二维码本身不会跳转网页。

真正发生的是:

  1. 扫码器识别并解码二维码

  2. 得到一段字符串

  3. 系统发现它符合 URL 规范(http://https://

  4. 自动调用浏览器打开

如果二维码里存的是普通文本,那扫码后只会显示文字,不会跳转。


五、一个很好用的心智模型

如果用一句话来理解二维码,可以这样记:

二维码 = 带纠错能力的文本编码图片

或者更通俗一点:

二维码不是链接的截图,而是链接的“编码版”。


六、为什么生成二维码这么容易?

你会发现:

  • 前端 JavaScript

  • 后端 Python / Java

  • 甚至离线工具

都能轻松生成二维码。

原因只有三个:

  1. 编码规则是公开标准

  2. 不需要联网

  3. 算法成熟、实现简单

这也是二维码能被广泛应用的重要原因之一。


七、写在最后

二维码看起来只是一些简单的黑白方块,但背后融合了:

  • 信息编码

  • 纠错算法

  • 工程设计的取舍

它的成功,并不在于“多复杂”,而在于——

把复杂技术,压缩成了一次“扫一扫”的体验。

版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/4/17 14:50:32

小白也能懂的Clawdbot+Qwen3-32B部署:Web网关实战教学

小白也能懂的ClawdbotQwen3-32B部署:Web网关实战教学 1. 这不是“又一个大模型教程”,而是你能立刻用上的方案 你是不是也遇到过这些情况: 看了一堆vLLM、Ollama、YaRN的文档,越看越晕,最后卡在“怎么让网页能直接对…

作者头像 李华
网站建设 2026/4/18 5:42:25

云存储提速工具:技术原理与实战应用指南

云存储提速工具:技术原理与实战应用指南 【免费下载链接】baidu-wangpan-parse 获取百度网盘分享文件的下载地址 项目地址: https://gitcode.com/gh_mirrors/ba/baidu-wangpan-parse 剖析速度瓶颈:云存储访问限制机制 云存储服务商普遍采用多层次…

作者头像 李华
网站建设 2026/4/18 11:57:19

AI助手个性化改造:基于Qwen2.5-7B的实践

AI助手个性化改造:基于Qwen2.5-7B的实践 你有没有想过,让一个大模型“记住自己是谁”?不是靠硬编码的系统提示词,也不是靠每次对话都重复强调——而是真正把它刻进模型的认知底层,让它在任何上下文中都能自然、稳定、…

作者头像 李华
网站建设 2026/4/18 8:24:55

Qwen3-TTS体验报告:97ms极速生成,10种语言自由切换

Qwen3-TTS体验报告:97ms极速生成,10种语言自由切换 你有没有试过,在输入“你好,今天天气不错”之后,还没来得及眨完一次眼,耳边就已经响起自然流畅的语音?这不是科幻电影——这是我在本地部署 …

作者头像 李华
网站建设 2026/4/18 8:20:03

EasyAnimateV5-7b-zh-InP惊艳案例:书法字帖→墨迹流动动画生成效果展示

EasyAnimateV5-7b-zh-InP惊艳案例:书法字帖→墨迹流动动画生成效果展示 1. 这不是“动图”,是会呼吸的墨韵 你有没有试过把一张静态的毛笔字帖,变成一段有生命感的视频?不是简单加个淡入淡出,也不是用AE做路径描边—…

作者头像 李华
网站建设 2026/4/18 12:58:50

RMBG-2.0开源大模型部署教程:魔搭社区模型本地化落地

RMBG-2.0开源大模型部署教程:魔搭社区模型本地化落地 1. 快速了解RMBG-2.0 RMBG-2.0是BRIA AI开源的新一代背景移除模型,采用BiRefNet架构设计。这个模型最厉害的地方在于它能实现发丝级精细分割,无论是人像、商品还是动物照片,…

作者头像 李华