HTML5实现DTMF（电话拨号按键信号）解码、编码，代码简单易于移植

目录

• 一、前言
  • 1.1 HTML5实现DTMF的一些动机
  • 1.2 一些有效场景
    • (1) 10086
    • (2) 软电话
    • (3) 小玩具
• 二、DTMF频率按键对照表
• 三、DTMF信号解码 得到按键值
  • 3.1 先学会手工解码
  • 3.2 了解一些原理
    • (1) 调整PCM采样率基本不会干扰到DTMF信号
    • (2) 降低采样率有利于识别DTMF信号
    • (3) 普通话音很难刚好凑成DTMF信号
  • 3.3 实现软件解码
    • (1) 降低PCM的采样率
    • (2) 如何找到那两条横线
    • (3) 用FFT将时域信号转成频率信号
    • (4) 粗暴的FFT扫荡模式：滑动窗口，不放过任何可能的信号
    • (5) 连续出现的相同信号即为有效按键
• 四、DTMF信号编码 生成按键PCM音频信号
  • 4.1 Mix：两个音频信号的混合
  • 4.2 生成单个按键信号
  • 4.3 连续多个按键信号混合到语音PCM流中

一、前言

1.1 HTML5实现DTMF的一些动机

我的GitHub开源库 Recorder 功能日渐丰富，最近又有项目可能会用到DTMF的解码功能，所以就用js实现了一下，本着易于移植的目的，相关代码都是简单的纯js代码，移植到别的语言非常方便。

涉及到三个源码，个个小巧：

1. FFT：lib.fft.js 111行（代码+空行+注释）
2. DTMF解码：dtmf.decode.js 192行（代码+空行+注释）
3. DTMF编码：dtmf.encode.js 191行（代码+空行+注释）

自评：高性能、准确度高、误识别率低；欢迎到 在线测试，下载别的一个软件 dtmf2num(命令行) 来对比伤害一下。

1.2 一些有效场景

(1) 10086

查话费请按1，嘟（你按了一个1），您的话费余额为9亿9千万……不能否认，这些能力的实现是建立在DTMF信号的编解码之上。

(2) 软电话

透过某些渠道，比如在你服务器上的程序拥有了自动拨打电话的能力，你希望通过用户按下某些按键后实现一些功能，比如输入密码，这样你的服务器端程序就需要带上DTMF解码功能。

(3) 小玩具

写一些小玩具把玩。嘿哈