接口联调传参数
前端开发小陈在联调登录接口时,后端要求密码字段必须经过 RFC 3986 规范编码,否则签名验签会失败。小陈用本工具将密码中的特殊字符(如 @、#、空格)一键转换为 %40、%23、%20,避免了因手动转义漏掉某个字符导致的 401 反复报错,联调时间从半天缩短到 10 分钟。
编码加密 · URL / HTML 编码
encodeURIComponent/encodeURI/RFC 3986
写前端代码时,一个包含中文或特殊符号的 URL 传给后端,返回 400 错误,多半是没做编码。这个工具将字符串按 RFC 3986 转为百分号编码(%XX),区分 encodeURIComponent(完整转义)与 encodeURI(保留 #?/ 等字符),粘贴即转。编码在浏览器内完成,字符不离开本地——调试接口、拼 API 参数时随手用,不必再开控制台试错。
前端开发小陈在联调登录接口时,后端要求密码字段必须经过 RFC 3986 规范编码,否则签名验签会失败。小陈用本工具将密码中的特殊字符(如 @、#、空格)一键转换为 %40、%23、%20,避免了因手动转义漏掉某个字符导致的 401 反复报错,联调时间从半天缩短到 10 分钟。
独立开发者老张在接入微信 OAuth 2.0 时,需要将回调地址 https://example.com/callback?source=app 作为 query 参数传给授权服务器。直接拼接会导致 ?source=app 被解释为外层 URL 的参数,而非回调地址的一部分。老张用本工具对整个回调 URL 进行 encodeURIComponent 编码,确保内层参数被正确传递,授权流程一次跑通。
数据采集员小林从电商页面复制了一串商品链接,里面包含中文分类名「男装/外套」和 emoji 表情。直接发起请求时,服务器返回 400 错误。小林将链接粘贴到本工具,选择 encodeURI 模式,仅对中文和 emoji 进行编码,保留已有的斜杠和冒号结构,清洗后的 URL 请求成功返回 200,采集任务按时完成。
市场运营小周在编辑EDM邮件时,需要在「点击查看详情」按钮后拼接 utm_source=newsletter&utm_campaign=春季促销 等跟踪参数。邮件客户端对未编码的 & 和 = 处理不一致,导致部分用户点击后跳转到错误页面。小周用本工具将参数字符串整体编码后嵌入链接,各邮箱客户端打开均正常跳转,活动点击率数据准确记录。
技术写作者小王在编写 RESTful API 文档时,需要提供包含中文、空格和特殊符号的 GET 请求示例。手动转义容易遗漏,且不同浏览器编码结果可能不一致。小王用本工具生成标准示例参数,同时对照 encodeURI 和 encodeURIComponent 的差异,在文档中清晰标注了两种模式的适用场景,开发者调用时减少了 80% 的编码相关工单咨询。
| 输入 | 输出 | 说明 |
|---|---|---|
| https://example.com/path?name=张三&age=20 | https%3A%2F%2Fexample.com%2Fpath%3Fname%3D%E5%BC%A0%E4%B8%89%26age%3D20 | 常规:完整 URL 编码,展示 encodeURIComponent 对冒号、斜杠、问号、& 号、中文均编码的特性 |
| Hello World! | Hello%20World%21 | 常规:空格转 %20,感叹号转 %21,验证 ASCII 特殊字符的编码规则 |
| 边界:空字符串输入,工具应返回空字符串而非 null 或 undefined | ||
| a | a | 边界:单字符且为字母,验证未保留字符(A-Z a-z 0-9 - _ . ~)不被编码 |
| 100% | 100%25 | 边界:百分号本身需编码为 %25,验证 % 字符的转义处理 |
| 你好,世界! | %E4%BD%A0%E5%A5%BD%EF%BC%8C%E4%B8%96%E7%95%8C%EF%BC%81 | 易错:全角中文和标点(逗号、感叹号)均被编码,与 encodeURI 不同(encodeURI 不编码中文但编码标点) |
| a b c | a%20b%20c | 易错:多个连续空格每个独立编码为 %20,不会合并为单个 %20 |
1.混淆 encodeURIComponent 与 encodeURI
encodeURI('https://example.com/path?name=张三&age=20')encodeURIComponent('张三') 单独编码参数值,再用 encodeURI 编码整个 URLencodeURI 不编码保留字符(如 ? & #),适合编码整个 URL 路径;encodeURIComponent 编码所有非字母数字字符(包括 ? &),适合编码查询参数值。RFC 3986 规定参数值中的 ? & 必须转义。
2.手动拼接 URL 参数时漏掉编码
const url = 'https://example.com/search?q=' + userInput;const url = 'https://example.com/search?q=' + encodeURIComponent(userInput);用户输入可能包含 & = # 等 URL 保留字符,直接拼接会破坏 URL 结构。encodeURIComponent 将这些字符转义为 % 加十六进制值,确保参数值被正确传递。
3.误解空格编码:%20 与 + 的区别
decodeURIComponent('a+b') 期望得到 'a b'decodeURIComponent('a%20b') 得到 'a b';application/x-www-form-urlencoded 中 + 才表示空格RFC 3986 规定空格应编码为 %20,+ 号在 URI 中表示字面加号。只有 HTML 表单的 application/x-www-form-urlencoded 编码才用 + 表示空格。JavaScript 的 decodeURIComponent 不会将 + 解码为空格。
4.对完整 URL 使用 encodeURIComponent
encodeURIComponent('https://example.com/path?name=test')encodeURI('https://example.com/path?name=test')encodeURIComponent 会编码 : / ? # 等 URL 结构字符,导致 URL 不可用。正确做法:对 URL 整体用 encodeURI,只对参数值用 encodeURIComponent。
5.忘记解码后再使用数据
从 URL 参数中读取 '%E4%B8%AD%E6%96%87' 直接显示给用户decodeURIComponent('%E4%B8%AD%E6%96%87') 得到 '中文' 再显示URL 编码后的字符串是 ASCII 安全的传输格式,不是人类可读的。所有从 URL 参数获取的数据,在展示或处理前必须用 decodeURIComponent 还原。
6.对非字符串类型调用编码函数
encodeURIComponent(12345) 或 encodeURIComponent({key:'value'})encodeURIComponent(String(12345)) 或 encodeURIComponent(JSON.stringify({key:'value'}))JavaScript 的 encodeURIComponent 会隐式调用 toString(),数字变成 '12345' 没问题,但对象变成 '[object Object]' 完全无意义。应显式转换为字符串或 JSON。
7.多次编码导致数据损坏
encodeURIComponent(encodeURIComponent('中文')) 得到 '%25E4%25B8%25AD%25E6%2596%2587'只编码一次:encodeURIComponent('中文') 得到 '%E4%B8%AD%E6%96%87'第二次编码会将第一次产生的 % 编码为 %25,导致原始数据无法通过一次 decodeURIComponent 恢复。除非明确知道接收方会解码两次,否则永远只编码一次。
8.忽略 UTF-8 编码前提
在非 UTF-8 页面中使用 escape() 编码中文,再用 encodeURIComponent 解码统一使用 UTF-8 编码:encodeURIComponent 默认使用 UTF-8 编码字符encodeURIComponent 严格遵循 RFC 3986,将字符按 UTF-8 编码后再转 %xx。如果页面或服务端使用其他编码(如 GBK),会导致编码结果不匹配。现代 Web 应统一使用 UTF-8。
encoded = % + hex(byte) 对每个非保留字符
encoded编码后的百分号加两位十六进制byte字符的 UTF-8 字节值,0–255字符 '中' 的 UTF-8 编码为 0xE4 0xB8 0xAD,三个字节分别转为 %E4 %B8 %AD,最终结果为 %E4%B8%AD。
正常。URL 编码就是把非 ASCII 字符(中文、日文、特殊符号等)转换成 % 后跟两位十六进制数的形式,这是 HTTP 协议的标准要求。比如“中”会变成 %E4%B8%AD。本工具默认使用 encodeURIComponent 算法(RFC 3986 标准),所有非保留字符都会被编码。如果看到 % 后不是两位字母数字,那可能是数据本身有问题或混入了其他编码结果。
不一样。浏览器地址栏对 URL 的编码用的是 encodeURI,它不会编码 URL 中具有特殊含义的字符(如 #、?、&、/ 等),目的是保持 URL 结构完整。而本工具默认使用 encodeURIComponent,它会编码所有非字母数字字符,包括 #、?、& 等。如果拿本工具的结果直接拼到 URL 参数里,是正确的;如果拿去替换整个 URL 的路径部分,应该用 encodeURI 模式。
乱码通常是编码和解码使用的字符集不一致造成的。本工具解码时默认按 UTF-8 处理,如果原文本是用 GBK 或 ISO-8859-1 编码后再进行 URL 编码的,用 UTF-8 解码就会显示乱码。解决办法是确认原始文本的编码方式。本工具目前只支持 UTF-8 编码的编解码,如果遇到非 UTF-8 的编码数据,请先用其他工具转换编码后再处理。
本工具使用 encodeURIComponent,空格会被编码为 %20。部分旧标准(如 application/x-www-form-urlencoded)会把空格编码为 +,但 RFC 3986 标准要求使用 %20。如果你对接的接口要求 + 号(比如某些旧版表单提交),本工具的结果可能不兼容。遇到这种情况,可以在结果中手动将 %20 替换为 +,或选择其他支持 + 号编码的工具。
本工具完全在浏览器本地运行,所有编解码操作由 JavaScript 的 encodeURIComponent 和 decodeURIComponent 函数完成,不会将任何输入数据发送到服务器。即使断网也能正常使用。可以放心处理含密码、Token、个人信息等敏感内容的 URL 编码需求,数据不会离开当前设备。
理论上没有长度限制,实际受浏览器内存和 JavaScript 字符串最大长度限制(约 2^28 字符,即 2.68 亿字符)。但建议单次输入不超过几万字符,因为浏览器处理超大字符串时可能出现卡顿或假死。如果 JSON 特别大,建议分段编码,或使用支持流式处理的工具。本工具界面也没有设置字数计数,超大输入时无法预估处理进度。
简单判断:如果编码的是整个 URL 的路径或域名部分,用 encodeURI,因为它会保留 /、?、# 等结构字符。如果编码的是 URL 中某个参数的值(比如 ?key=value 里的 value),必须用 encodeURIComponent,否则参数里的 & 或 = 会破坏 URL 结构。举例:value 是 a&b,用 encodeURI 得到 a&b,拼接后 ?key=a&b 会导致歧义;用 encodeURIComponent 得到 a%26b,拼接后 ?key=a%26b 才是正确的。本工具默认 encodeURIComponent,也提供 encodeURI 选项。
微信内置浏览器对 URL 编码的处理可能不标准,尤其是对 UTF-8 编码的中文。如果编码结果在微信里打开乱码,尝试以下方案:1)确认微信页面声明了正确的 charset(<meta charset='UTF-8'>);2)某些微信版本对 % 号有特殊处理,可以检查 URL 是否被微信自动截断或修改;3)部分旧版微信不支持某些 Unicode 字符的编码,建议升级微信版本。本工具编码结果是标准的,兼容绝大多数现代浏览器。
隐私保证所有计算与处理均在你的浏览器本地完成,输入数据不会上传服务器,也不会保存或共享。