URL Encoding 编码解码

免费在线 URL Encoding 编码解码 工具。100% 本地计算,数据不离开您的设备,隐私安全有保障。

输出

结果将显示在这里...

输入 编码

使用指南

关于 URL 编码

URL 编码(URL Encoding,也称为 百分号编码 Percent Encoding,定义于 RFC 3986)是一种将 URL 中的特殊字符转换为安全字符的编码方法。URL 只允许使用 ASCII 字符集中的一部分字符(字母、数字和少数特殊字符),其他字符(如空格、中文、特殊符号)必须编码后才能在 URL 中使用。URL 编码将每个字节转换为 %XX 格式,其中 XX 是该字节的 十六进制表示。URL 编码是 Web 开发的基础,广泛应用于 URL 参数、表单提交、HTTP 请求等场景。

Web 开发必备:URL 编码是 Web 开发中最常用的编码方式之一,用于在 URL 中传递参数、处理表单提交、构建 HTTP 请求等。它确保特殊字符(如空格、&、=、中文)能够安全地在 URL 中传输。推荐作为 URL 参数处理的首选

使用步骤

URL 编码和解码非常简单:

1. 编码输入包含特殊字符的文本,点击「编码」按钮,获得 URL 安全的编码字符串
2. 解码输入 URL 编码字符串,点击「解码」按钮,恢复原始文本
3. 复制结果点击「复制」按钮获取编码或解码后的结果
隐私保护:所有计算在浏览器本地高速完成,数据不会上传服务器,完全离线处理。

编码规则

URL 编码遵循以下规则:

保留字符字母(A-Z, a-z)、数字(0-9)、连字符(-)、下划线(_)、点(.)、波浪号(~)不编码
空格空格编码为 %20 或 +(在查询字符串中)
特殊字符其他字符(如 &、=、?、#、中文)编码为 %XX 格式
UTF-8非 ASCII 字符(如中文)先转换为 UTF-8 字节,再编码为 %XX
注意:URL 的不同部分有不同的编码规则。查询字符串(?后面)中的空格通常编码为 +,而路径部分的空格编码为 %20。使用 JavaScript 的 encodeURIComponent() 可以正确处理大多数情况。

常见编码示例

以下是一些常见字符的 URL 编码:

空格%20 或 +(查询字符串中)
&%26
=%3D
?%3F
#%23
中文「你好」%E4%BD%A0%E5%A5%BD

应用场景

URL 编码广泛应用于 Web 开发的各个场景:

URL 参数在 URL 查询字符串中传递参数(如 ?name=张三&age=20)
表单提交HTML 表单使用 application/x-www-form-urlencoded 编码提交数据
HTTP 请求构建 GET/POST 请求时编码参数
RESTful API在 URL 路径中传递包含特殊字符的资源标识
OAuthOAuth 认证流程中的 redirect_uri 等参数需要编码
搜索引擎搜索关键词在 URL 中传递时需要编码

常见问题

Q: URL 编码和 Base64 有什么区别?

A: URL 编码和 Base64 都用于处理特殊字符,但用途不同。URL 编码:1)目的:使特殊字符能在 URL 中安全传输。2)格式:%XX(如 %20)。3)场景:URL 参数、表单提交。Base64:1)目的:将二进制数据转换为文本格式。2)格式:A-Z, a-z, 0-9, +, /。3)场景:嵌入图片、JWT、邮件附件。选择建议:1)URL 参数:使用 URL 编码。2)二进制数据:使用 Base64。3)两者可以结合使用(如 Base64 编码后再 URL 编码)。

Q: 空格应该编码为 %20 还是 +?

A: 空格的编码取决于 URL 的位置。%20:1)用于 URL 路径部分(如 /path/hello%20world)。2)用于 Fragment(# 后面)。3)encodeURIComponent() 将空格编码为 %20。+:1)用于查询字符串(? 后面,如 ?q=hello+world)。2)application/x-www-form-urlencoded 格式使用 +。推荐:使用 encodeURIComponent() 统一编码为 %20,服务端会自动处理 + 和 %20。

Q: 如何在 JavaScript 中使用 URL 编码?

A: JavaScript 提供了三个 URL 编码函数,用途不同。encodeURIComponent():编码 URI 组件(参数值),推荐使用。编码所有特殊字符(除了 A-Z, a-z, 0-9, -, _, ., ~)。encodeURI():编码完整 URI,保留 URI 结构字符(如 :, /, ?, &)。适合编码完整 URL。escape():已废弃,不推荐使用。示例
// 编码参数值(推荐) encodeURIComponent('你好 世界'); // '%E4%BD%A0%E5%A5%BD%20%E4%B8%96%E7%95%8C' // 编码完整 URL encodeURI('https://example.com/你好'); // 'https://example.com/%E4%BD%A0%E5%A5%BD'
解码:使用 decodeURIComponent()decodeURI()

Q: 中文字符如何 URL 编码?

A: 中文字符需要先转换为 UTF-8 字节,再编码为 %XX 格式。示例:“你好” → UTF-8 字节:E4 BD A0 E5 A5 BD → URL 编码:%E4%BD%A0%E5%A5%BDJavaScriptencodeURIComponent('你好') 自动处理 UTF-8 转换。注意:1)不同编码(如 GBK)会产生不同的结果。2)服务端需要正确解码 UTF-8。3)现代 Web 应用统一使用 UTF-8 编码。

Q: URL 编码会增加数据大小吗?

A: 是的,URL 编码会增加数据大小,增加幅度取决于字符类型。ASCII 字符:1)字母、数字:不编码,大小不变。2)特殊字符(如 &、=):编码为 3 字节(%XX),增加 200%。中文字符:1)UTF-8 编码:1 个中文字符 = 3 字节 = 9 字节编码(%XX%XX%XX),增加 200%。示例:“你好”(6 字节)→ %E4%BD%A0%E5%A5%BD(18 字节)。优化:1)使用 POST 请求传输大量数据。2)考虑使用 JSON 格式(不需要 URL 编码)。

Q: URL 编码和 HTML 实体编码有什么区别?

A: URL 编码和 HTML 实体编码用于不同的场景。URL 编码:1)用途:在 URL 中传输特殊字符。2)格式:%XX(如 %20)。3)场景:URL 参数、表单提交。HTML 实体编码:1)用途:在 HTML 中显示特殊字符。2)格式:&name;(如 &lt;)或 &#数字;(如 &#60;)。3)场景:HTML 内容、属性值。示例:< → URL 编码:%3C,HTML 实体:&lt;&#60;

使用场景

推荐:URL 查询参数

在 URL 查询字符串中传递参数是 URL 编码最常见的应用场景。查询字符串以 ? 开头,参数之间用 & 分隔,参数名和值用 = 连接。如果参数值包含特殊字符(如空格、&、=、中文),必须进行 URL 编码。使用 JavaScript 的 encodeURIComponent() 可以正确编码参数值。

推荐配置:
  • ✅ 使用 encodeURIComponent() 编码参数值
  • ✅ 使用 URLSearchParams API 构建查询字符串
  • ✅ 服务端使用相应的解码函数
  • ❌ 不要手动拼接 URL 参数
  • 💡 考虑使用 POST 请求传输大量数据
推荐:HTML 表单提交

HTML 表单使用 application/x-www-form-urlencoded 编码提交数据,这是 URL 编码的一种变体。表单数据以 key=value&key=value 格式提交,空格编码为 +,其他特殊字符编码为 %XX。现代浏览器会自动处理表单编码,开发者通常不需要手动编码。但在使用 JavaScript 构建表单数据时(如 Fetch API),需要手动编码。

推荐配置:
  • ✅ 使用 FormData API 自动处理编码
  • ✅ 使用 URLSearchParams 构建表单数据
  • ✅ 服务端正确解码表单数据
  • 💡 对于文件上传,使用 multipart/form-data
推荐:RESTful API 路径参数

在 RESTful API 中,资源标识可能包含特殊字符(如空格、斜杠、中文),需要进行 URL 编码。例如,/users/张三 应编码为 /users/%E5%BC%A0%E4%B8%89。使用 encodeURIComponent() 编码路径参数,确保 API 能够正确解析资源标识。

推荐配置:
  • ✅ 使用 encodeURIComponent() 编码路径参数
  • ✅ 服务端正确解码路径参数
  • ✅ 考虑使用 ID 而非名称作为资源标识
  • 💡 使用 URL 模板库(如 path-to-regexp)
推荐:OAuth 认证

OAuth 认证流程中的 redirect_uristate 等参数需要进行 URL 编码。例如,redirect_uri 通常是一个完整的 URL,包含查询参数,需要整体编码后作为参数值传递。使用 encodeURIComponent() 编码这些参数,确保 OAuth 服务器能够正确解析。

推荐配置:
  • ✅ 使用 encodeURIComponent() 编码 redirect_uri
  • ✅ 使用 encodeURIComponent() 编码 state 参数
  • ✅ 验证解码后的 redirect_uri 是否合法
  • 💡 使用 OAuth 库(如 Passport.js)自动处理
推荐:搜索引擎查询

搜索引擎的查询关键词在 URL 中传递时需要进行 URL 编码。例如,Google 搜索 “你好 世界” 的 URL 为 https://www.google.com/search?q=%E4%BD%A0%E5%A5%BD+%E4%B8%96%E7%95%8C。搜索引擎会自动处理 URL 编码,用户通常不需要手动编码。但在构建搜索 URL 时(如自动跳转),需要使用 encodeURIComponent() 编码查询关键词。

推荐配置:
  • ✅ 使用 encodeURIComponent() 编码搜索关键词
  • ✅ 处理多个关键词(用空格或 + 分隔)
  • ✅ 考虑使用搜索引擎的 API
  • 💡 使用 URLSearchParams 构建搜索 URL
推荐:短链接服务

短链接服务(如 bit.ly、t.cn)需要将长 URL 编码后存储和传输。长 URL 可能包含特殊字符(如查询参数),需要进行 URL 编码。使用 encodeURIComponent() 编码长 URL,确保短链接服务能够正确解析和还原。注意,短链接服务通常会对编码后的 URL 再次编码,因此解码时需要多次解码。

推荐配置:
  • ✅ 使用 encodeURIComponent() 编码长 URL
  • ✅ 验证解码后的 URL 是否合法
  • ✅ 处理多次编码的情况
  • 💡 使用短链接服务的 API

最佳实践建议

  • 使用 encodeURIComponent() 编码 URL 参数值,使用 encodeURI() 编码完整 URL。
  • 空格在查询字符串中编码为 +,在路径中编码为 %20,使用 encodeURIComponent() 统一编码为 %20。
  • 中文字符使用 UTF-8 编码,确保服务端正确解码。
  • 不要手动拼接 URL 参数,使用 URLSearchParams API 或 FormData API 自动处理编码。
  • URL 编码会增加数据大小,对于大量数据应使用 POST 请求或 JSON 格式。
  • 验证解码后的 URL 是否合法,防止 URL 注入攻击。

讨论与反馈

0 条评论