bug就像灰太狼,总会对着你喊:我灰太狼又回来了 | 零宽度空格

879 阅读2分钟

滴~滴滴~~ 后端向你发起了更改弹窗需求,打开控制台第一眼,看到 Unexpected token in JSON at position 1 后,你是否想甩锅…

后端说弹窗不弹啊,快来更改一下啊

CV链接后

image.png

前端看到这里只想甩锅啊哈哈哈哈哈有木有

o_200720075135o_a.gif

秉着应付bug的态度,CV一下到 Json.cn

image.png

咦???难道是我的锅?

再三检查代码后,感叹道 ”不应该啊!“

难道又是上次遇到过的问题???

CV到控制台瞅一眼

果不其然 遇到第一次的时候这玩意仿佛就说了:我灰太狼一定会回来的

所以 这是遇到第二次了 就记录一下吧

这灰太狼的名字叫:零宽度空格

既然打算写文章了,那就先发一个朋友圈吧

1623054443.jpg

okok,不水了,开启正文篇幅~

嘛玩意是零宽度空格呢?

维基百科: 零宽空格(zero-width space, ZWSP)是一种不可打印的Unicode字符,用于可能需要换行处。

嗯…让我们转向案例

CV复制到控制台后,如下图:

image.png

真相只有一个!

对,这个红点,就是它,它就是真凶!

好了,接下来的问题就好办了,replace即可,如下图。

image.png

看图里是不是啥也没啊,啊哈哈哈哈,其实是内有乾坤:复制了领宽度空格在replace的第一个引号里(即:regexp/substr)

在url中化身为 %EF%BB%BF

比如我在下图测试后添加这个零宽度空格

image.png

摁下回车,它就自己跑出来了~

这个去除方法同理

image.png

最后:在我写这篇文之前,后端重新新建了一个文件把代码复制过去了,从而此处问题解决。

有兴趣的可以自己去下面链接探究一番:

UTF-8文件的BOM头的来由及去除方法

你不知道的空格

如何发一条空白的朋友圈

看完上面的,或许你会跟我一样,发一条空白朋友圈~

最后放一个复制零宽度空格的url吧:零宽度空格字符获取 打开后复制内容到控制板就看到了