[HTML] AudioContext 折腾笔记 01

前天尝试了一波那个什么 MediaSourceExtension,结果发现那套API目前限制蛮大的,而且对我来说没什么帮助(audio/x-wav 完全不正常支持,audio/mpeg 也只能在 Chrome 上使用)于是只能放弃折腾了 QAQ

昨天突然想起之前写 nanoPlayer 的时候,使用了一个叫 Audio Context 的接口,nanoPlayer 用了这个 API 里的 createAnalyser 方法,来获得音频的频率数据,进而实现了一个频谱可视化功能。之前就注意到了这个接口中有个自定义 AudioBufferSource 的方法,可以指定若干 Float32Array 并交给浏览器播放,应该是蛮有意思的。

这里就实现一个可制定频率的正弦波音频吧,如果这个实现起来没有什么难度的话,就准备试试浏览器端解码 WAV 音频。

继续阅读[HTML] AudioContext 折腾笔记 01

[HTML] MediaSource 折腾笔记 01

MediaSource 是 HTML5 中的一个实验性特性,用于给 `HTMLMediaElement` 对象提供数据源。这里的数据源通常是使用 `XMLHttpRequest` 获得的数据。在 XHR 取得数据后,我们可以使用 JavaScript 对数据进行一些操作,比如提取 ID3、修改封装类型等等。 某 bilibili 开源的 Flv.js 就是使用这个特性实现的在 HTML5 环境下播放 H264 + AAC 格式的 FLV 视频。

最近在写 `Nano Player` 的时候遇到了两个比较尴尬的问题:1、ID3 信息必须手动指定;2、网易云音乐上下载的 MP3 由于某些原因必须缓冲 2MB 才能播放(详见MP3缓冲2MB才开始播放的解决方法)。于是想到是不是可以用这个 MediaSource 来暴改 MP3 呢?我也不知道

不管怎样,要用这个 MSE 来解决问题,首先就是要用它来播放文件(如果获得的数据直接喂给 MSE 都不能播放那还讨论个什么鬼)

继续阅读[HTML] MediaSource 折腾笔记 01

没事儿干写了个新的 Blog 框架

JavaScript 自己也看了一段时间了,Node.js 相关的内容也随手糊过一点了,但是总是没有一个像样的作品,这样是不行的。

所以就必须想点办法,搞个大新闻,把脑子里的知识运用一番,顺带学学新的姿势,提高自己的水平。不编了好吧我承认是自己在家无聊了QAQ

在基佬集线器上逛逛的话,会发现很多人都自己撸过一个简单的 Blog 框架,毕竟这种简单的网页应用逻辑简单,同时实现的参考啊也很多,比如 PHP 就有 WordPress, Node.js 就有 Hexo,等等。所以我也就学着做个玩玩咯~

花了大概一天吧,撸出了现在的这个最简单的 Blog Framework,虽然还没想到取什么名字。前段框架使用了 Vue.js,并且才用了 Materialize 提供的部分样式和组件。后端使用了 Express.js,数据存储则按照国际惯例选择了 MySQL(MariaDB)。全站数据使用 Ajax 获得,并完全在浏览器端渲染,同时除了博客名称以外没有任何触发刷新的组件。整体风格自认为是极简风格,实际上是自己没本事搞出什么好看的设计。

现在这个框架准确的说还在开发阶段,需要解决的问题是评论以及管理页面。当然部分代码需要优化优化,写得实在是太随性了。

样例页面可以在这里查看,里面的内容大多是从这里搬运过去的。源代码则可以前往GitHub来查看(顺便请允许我无耻的求个 Star QwQ)。

卧槽我这个 Framework 国内访问速度真他喵快啊