Meefik's Blog

Freedom and Open Source

DTMF generation and recognition in JavaScript

26 Apr 2018 | javascript

When the task appears to transmit some code by audio, the classic solution is DTMF codes. DTMF is a two-tone multi-frequency signal used to dial a phone number. However, the actual application of this technology is much wider.

The signal format is the sum of two sinusoidal signals of certain frequencies. DTMF symbols are encoded by the following frequencies:

  1209 Hz 1336 Hz 1477 Hz 1633 Hz
697 Hz 1 2 3 A
770 Hz 4 5 6 B
852 Hz 7 8 9 C
941 Hz * 0 # D

There are many examples of DTMF implementation, one of the most well-known DTMF detection algorithms is Goertzel algorithm. There is even its JavaScript implementation.

Code recognition occurs by frequency response, and by time response, noise filtering can be implemented.

JS library for working with DTMF

My version of the library DTMF.js is quite simple and uses the Web Audio API for both signal generation and recognition in the browser. Audio is captured from the microphone by the getUserMedia function.

Example of receiving and recognizing DTMF codes:

var receiver = new DTMF.Receiver();
navigator.getUserMedia({ audio: true }, function(stream) {
  receiver.start(stream, function(code) {
}, function(e) {

And here is an example of generating and reproducing DTMF codes:

var sender = new DTMF.Sender();'1234567890ABCD#*');

A small demonstration: