292018.9

怪异空格引发的血案

在整理博客的过程中发现博客内有部分地方没有对齐。于是赶紧打开devtool看下。结果发现了神秘而怪异的现象。明明没有打空格的地方,却出现了实体 真的是着了魔般,怎么都干不掉。

二维码和下面的文字没有对齐,查看后发现图片没对齐

第一反应是css出了问题,于是打开devtool试着调试css。结果,怎么搞都没办法。仔细去看HTML,发现出现了两个 。

可是我很清楚,这地方源码里面没有空格啊。于是想到自己的网页是经过ob content输出的,是不是php处理上出了什么问题,然后去翻开插件看,可是怎么读代码,都觉得应该不是这个问题。

于是又去看下网页源代码,怪异的事情发生了,明明网页源代码里面没有 啊。

难道是\t的问题?于是把源码中的这个地方删掉重新换行,结果,仍然还是这个问题。直到我开启了vscode的空格显示功能,才发现了异样。

你仔细看<img>前面的空格,发现这两个空格的宽度感觉很奇怪。于是删掉,自己打了两个空格,问题解决了。

正常的空格[ ],奇怪的空格[   ],请查看源码和在devtool中查看。

原来这两个空格是全角空格,也就是中文格式下的特殊字符。但是,这个空格在键盘上是打不出来的,要通过特殊的输入方式才能打出来,这是怎么产生的呢?我不可能写代码的时候,还这样去特意打两个全角空格吧。最后,看来是在不同的系统切换,不同的环境下,切换编辑时,留下的问题。

23:11:21 已有4条回复
  1. 你这个情况,我博客上也有,不过仅限 Mac 和部分 Windows 之间。
    比如我明明正常输入的一句话,在某些 Windows 下会看到句子里出现类似+号的奇怪字符。
    自己的Win 8.1 和 公司的 Win 10下会看到,但有的读者说他们并没有看到,所以也不知道是什么机制了。
    #612 Betty 2018-09-30 11:28 回复
  2. 上班时间逛博客,小同学,需求不包含啊😝
    #613 回复给#612 否子戈 2018-09-30 11:32 回复
  3. 上班时间回评论,大同学,你需求不包含啊

    我是今天休假了,要对自己好一点,哈哈哈
    #614 回复给#613 Betty 2018-09-30 11:36 回复
  4. 提前休假真爽啊,岂不是要出去浪了
    #615 回复给#614 否子戈 2018-09-30 11:44 回复
282018.9

网页特效:散动的blobs

192018.9

最新的 iPhone 屏幕分辨率大全

182018.9

一个可能摧毁微信的二维码

今天群里红了一个二维码,扫这个二维码之后,手机就会出现自动重启的极端情况。经过测试,只有iphone上的微信会出现这样的问题,而安卓微信则幸免于难。

会让微信崩溃,手机重启的二维码(想清楚再扫哦

瞬间这个二维码就在朋友圈儿红了,比如有人说这是个体验新产品的入口啦,有人说这是个幸运的抽奖啦,有人说这是个领红包的口令啦,等等,于是就开始有人试了,从此,两人恩断义绝,再无瓜葛……

作为有志向的程序员,当然要一探究竟了。先解码二维码,然后去看对应网页的源代码,于是呼撸,原来就是非常简单的嵌套黑洞。点击这里可以看源码的真正出处,放心,点进去没影响。

这是苹果给自己挖的坑。iOS用的网页排版引擎WebKit有个弱点,而这个引擎是苹果要求,所有app所有浏览器必须用的。只要在CSS的Backdrop-filter里嵌入大量元素,比如<div>标签,就可以耗尽设备的所有资源,造成内核错误(Kernel Panic) 。后果就是,关闭操作系统并重启,以避免设备受到伤害。只要在iOS上渲染了HTML,这15行代码就有效。

看完源代码,你懂了吗?

23:21:20 已有0条回复
142018.9

ng-scroll

angular没有自带ng-scroll,只能自己写个directive来代替:

module.exports = ['$parse', ($parse) => {
  'ngInject'

  return {
    restrict: 'A',
    link: (scope, element, attrs) => {
      element.on('scroll', () => {
        let scripts = attrs.ngScroll
        let parse = $parse(scripts)
        parse(scope)
        scope.$apply()
      })
    }
  }
}]
18:02:20 已有0条回复
132018.9

之前在谈体验的时候,更喜欢react,因为它更接近元编程,而vue则是在follow一套规则的前提下,像摆弄器件一样去组装出一个东西。但是经过一年多回头来看,虽然react更多体现在思想层面的先进,但在快速实现应用的需求中,vue更胜一筹。如果现在让我去选择,我会毫不犹豫的马上拿起vue开始撸,虽然让我写react也完全没问题。

顺带吐槽,苹果自带的中文输入法,联想能力真的弱到爆炸,错别字一堆一堆的!!

09:54:19 已有0条回复
092018.9

给博客改了字体,在mac上显示瘦瘦的,怎么说呢,其实现在这个字体也挺不怎么合我之意,有点太细了,不稳重。但是默认的字体实在是有点不能接受,要是有特别是中文字体,挺难求的,而且还要免费,也是……

01:45:51 已有0条回复
062018.9

前端录制麦克风音频

在前端去录制麦克风音频,听起来好简单啊,但是后来发现是个大坑。这个问题要分解:

  • 麦克风
  • 音频
  • 录制

获取麦克风输入比较简单,用webrtc的接口getUserMedia就可以实现了,但是怎么录制?getUserMedia得到的是stream,stream不是buffer,也不分chunks,所以你想要把stream转换为buffer,没办法,必须还得靠高级api。MediaRecorder本来可以用,但是safari不兼容,内心MMP。录制视频用canvas一帧一帧保存起来就行了,但是录制音频……最后找来找去,AudioContext这个api可以用,但是safari只有在11.2版本之后才支持webkitAudioContext,所以,只有用这货才能实现。

总结,在支持MediaRecorder的系统中使用MediaRecorder录制,在iOS中,最多兼容到使用webkitAudioContext去实现,有一个包可以用,就是audio-recorder-polyfill,想法真不错,赞一个。

13:06:34 已有0条回复