前端为什么要对url进行编码
为什么要对url进行编码
- url有规范,在参数值中出现&字符会截断参数
- url中文的问题,编码客转换为英文
- 也是第一种情况,url中有个参数值是url,传输的时候会出现错误
例1
有这样一串参数: name1=value1&name2=value2
我们来说一下客户端到服务端的概念上解析过程, 上述字符串在计算机中用ASCII码表示为:
6E616D6531 3D 76616C756531 6E616D6532 3D 76616C756532
对应关系:
6E616D6531 --> name1
3D --> =
76616C756531 --> value1
26 --> &
6E616D6532 --> name2
3D --> =
76616C756532 --> value2
服务端在接收到该数据后就可以遍历该字节流,首先一个字节一个字节的吃,当吃到3D这字节后,服务端就知道前面吃得字节表示一个key,再想后吃,如果遇到,说明从刚才吃的3D到26子节之间的是上一个key的value,以此类推就可以解析出客户端传过来的参数。
现在有这样一个问题,如果我的参数值中就包含=或&这种特殊字符的时候该怎么办?
比如说“name1=value1”,其中value1的值是“va&lu=e1”字符串,那么实际在传输过程中就会变成这样“name1=va&lu=e1”。我们的本意是就只有一个键值对,但是服务端会解析成两个键值对,这样就产生了奇异。
如何解决上述问题带来的歧义呢?
解决的办法就是对参数进行URL编码
URL编码只是简单的在特殊字符的各个字节前加上%,例如,我们对上述会产生奇异的字符进行URL编码后结果:“name1=va%26lu%3D”,这样服务端会把紧跟在“%”后的字节当成普通的字节,就是不会把它当成各个参数或键值对的分隔符。
例2
一个接口,你传送过去时,需要带上你这边的回调地址,也是个url. 这样你不能url+url传送,需要一个urlencode把回调地址编码,防止发生问题
例如: 微信的一个接口
https://open.weixin.qq.com/connect/oauth2/authorize?appid=APPID&redirect_uri=REDIRECT_URI&response_type=code&scope=SCOPE&state=STATE#wechat_redirect
REDIRECT_URI 这裡应该填你的服务器回调地址.正常写法如 http://api.baidu.com/callback.php
那么生成的接口就是
https://open.weixin.qq.com/connect/oauth2/authorize?appid=APPID&redirect_uri=http://api.baidu.com/callback.php&response_type=code&scope=SCOPE&state=STATE#wechat_redirect
这样访问肯定出问题...
那么http://api.baidu.com/callback.php 这个回调地址, 就要转码后(encodeURIComponent)再放到地址中发送.
https://open.weixin.qq.com/connect/oauth2/authorize?appid=APPID&redirect_uri=http%3A%2F%2Fapi.baidu.com%2Fcallback.php&response_type=code&scope=SCOPE&state=STATE#wechat_redirect
文章参考:
http://blog.csdn.net/chanda_yang/article/details/52422575
https://segmentfault.com/q/1010000002991580
https://www.zhihu.com/question/19673368
前端为什么要对url进行编码的更多相关文章
- URL的编码和解码
URL的编码和解码 参考:阮一峰--关于URL编码 1 为什么要URL编码 在因特网上传送URL,只能采用ASCII字符集 也就是说URL只能使用英文字母.阿拉伯数字和某些标点符号,不能使用其他文字和 ...
- 【Web】URI和URL,及URL的编码
URI和URL是什么,以及他们的区别 URL,Uniform Resource Locator,统一资源定位符.用于表示网络上服务器的资源所在位置,比如我们输入浏览器的地址. URI,Uniform ...
- JS 和 Java 中URL特殊字符编码方式
前几天遇到url特殊字符编码的问题,在这里整理一下: JavaScript 1. 编码 escape(String) 其中某些字符被替换成了十六进制的转义序列. 解码 unescape(String ...
- html-----018----HTML Web Server/HTML URL 字符编码
HTML Web Server 如果希望向世界发布您的网站,那么您必须把它存放在 web 服务器上. 托管自己的网站 在自己的服务器上托管网站始终是一个选项.有几点需要考虑: 硬件支出 如果要运行“真 ...
- url在线编码和解码
在工作中,经常遇到encode之后的url.想查看里面的某个参数的时候,很不直观.今天在网上搜了一下对url在线编码和解码的网站.对我来说,使用起来很方便.而且这个网站里面,不仅仅有对url的编码和解 ...
- JS对url进行编码和解码(三种方式区别)
Javascript语言用于编码的函数,一共有三个,最古老的一个就是escape().虽然这个函数现在已经不提倡使用了,但是由于历史原因,很多地方还在使用它,所以有必要先从它讲起. escape 和 ...
- URL地址编码和解码
0. 参考 [整理]关于http(GET或POST)请求中的url地址的编码(encode)和解码(decode) python3中的urlopen对于中文url是如何处理的? 中文URL的编码问题 ...
- c# 对Url 解码编码
/// <summary> /// 对Url进行编码 /// </summary> /// <param name="url">url</ ...
- js 对url进行编码和解码的三种方式
一.escape 和 unescape escape 原理:对除 ASCII字母.数字.标点符号(@ * _ + - . /) 以外的字符进行编码 .编码的字符被替换成了十六进制的转义序列 不编码的字 ...
随机推荐
- SIG蓝牙mesh笔记2_mesh组成
目录 SIG 蓝牙 mesh 组成 mesh网络概述 网络和子网 设备和节点 devices & nodes 入网 mesh中的几个概念 智能插座例子 SIG 蓝牙 mesh 组成 mesh网 ...
- StreamSets小白踩过的一些坑
由于公司业务上的需求,需要实时监控mysql数据库的数据的增长,并将数据同步到另一个平台,所以就问老大使用什么工具比较好,老大推荐使用StreamSets,还说在测试环境都已经部署好了StreamSe ...
- 压力测试工具-webbench
简述 偶然情况下看到一款性能测试工具webbench,看着挺不错的记录一下安装过程,在以后项目上线过程中可以压一压一些页面的并发情况,对项目性能有个大致的了解. 原理 webbench首先fork出多 ...
- C语言实训——扑克牌洗牌程序
说明此程序本来是21点扑克程序的一个被调函数,在这里我单独将它拿出来作为一个小程序. #include<stdio.h> #include<time.h> #include&l ...
- 《梦断代码Dreaming In Code》阅读笔记(二)
这段时间一口气读了5章,所以想着现在一块写阅读笔记. 在阅读的这段时间,我一直是晚上进行阅读,很多时候都是读完一看已经一个小时了,效果还不错.闲话不表,说说阅读心得. 关于底层语言或是低级语言,我之前 ...
- SpringMVC拦截器实现登录认证(转发)
感谢原作者,转发自:http://blog.csdn.net/u014427391/article/details/51419521 以Demo的形式讲诉拦截器的使用 项目结构如图: 需要的jar:有 ...
- iOS- iOS 和 Android 的后台推送原理各是什么?有什么区别?
iOS 的推送iOS 在系统级别有一个推送服务程序使用 5223 端口.使用这个端口的协议源于 Jabber 后来发展为 XMPP ,被用于 Gtalk 等 IM 软件中.所以, iOS 的推送,可以 ...
- 微信小程序项目笔记以及openId体验版获取问题
公司一直说要搞小程序,说了几个月,最近才算落地,一个很小的项目,就结果来讲,勉强让自己窥得小程序门径. 下面总结一下,为了弄好小程序,所学到的知识,以及项目中遇到的问题以及解决的办法.纯属个人见解. ...
- Python使用ElementTree美化XML格式
Python中使用ElementTree可以很方便的处理XML,但是产生的XML文件内容会合并在一行,难以看清楚. 如下格式: <root><aa>aatext<cc&g ...
- vim map nmap(转)
转自:http://blog.csdn.net/taoshengyang/article/details/6319106 有五种映射存在 - 用于普通模式: 输入命令时. - 用于可视模式: 可视 ...