请求地址中含有特殊字符#时如何有效处理

　　今天在调试过程中发现当请求参数中含有特殊字符时，某些参数值传递到后端时已经发生了变化，例如在请求参数中含有#字符时，后端收到的参数值是没有#字符和其后面字符的内容，在Chrome浏览器中按下F12后在Network中可以看到请求的地址中针对含有#字符的请求参数，其#字符和后面的字符都被截断了，于是想到需要对这类请求参数进行编码处理。由于这个请求是编排器将Vue对象送给前端时created方法或computed方法自动调用的，所以要想在前端做修改是不太可能的了，只能在后端处理，但是后端处理后也是供前端调用的。那在后端哪里处理比较合适呢？应该有个拼接请求地址的地方吧，我们就从那里着手处理吧，这样就可以对所有的某一类参数值进行设置。由于这个拼接的地址是要供前端调用的，所以在使用编码方法时是能符合前端JS调用的才可以。这里想到了前端两个编码函数：encodeURI和encodeURIComponent，下面分别添加这两个函数对请求参数进行编码处理，看看效果。

（1）encodeURI函数

后端这样拼接地址，例如：'http' + '//IP:port/targetAddress?param='+encodeURI(value)，其中value是含有#字符的值

浏览器中结果显示：#字符和其后面的字符依旧被截断了

（2）encodeURIComponent函数

后端这样拼接地址，例如：'http' + '//IP:port/targetAddress?param='+encodeURIComponent(value)，其中value是含有#字符的值

浏览器中结果显示：#字符和其后面的字符被编码了，整个value值是被编码后的字符串了，保留在请求参数中了。

从这两个函数的编码效果可以看出：在前端JS中encodeURIComponent函数可以对#字符进行编码，而encodeURI函数不能对#字符进行编码，依旧保留#字符原样。延伸一下：encodeURI() 用于编码整个URI，因为URI中的合法字符都不会被编码转换；而encodeURIComponent方法在编码单个URIComponent（指请求参数）应当是最常用的，它可以将参数中的中文、特殊字符进行转义，而不会影响整个URL。

　　虽然通过encodeURIComponent函数解决了#字符为请求参数时#字符和其后的字符都被截断的问题，但是是为什么会被截断呢？这是因为#字符对URI来说，它的作用是指向一个锚点，例如：xx?param=wb#gg，那么这URL实际上是定位到xx?param=wb这个页面中的ID为gg的元素位置。所以自然而然地请求参数中就不会包含#字符和其后面的字符了，因为其特殊的含义决定了其作用。

      要是不想主动调用encodeURIComponent函数对请求参数进行编码，那么可以将请求参数放在请求体，在ajax中可以将参数放在data属性中，这样会自动调用encodeURIComponent函数对data数据进行编码。

 

------20191202闪