The recent research report highlights a potential cybersecurity vulnerability related to sound-based attacks on keyboard inputs during video conferencing calls like Zoom calls. The research conducted by experts from the University of Surrey, Durham University, and the Royal Holloway, University of London demonstrates the feasibility of an AI system accurately identifying keys being pressed on a laptop keyboard based on the sound of typing.
Here are some key takeaways and implications from this research:
So these are the key takeaways from the latest research report, but wondering how could it be prevented to safeguard your web apps and users from sound-based attacks? Here are a few well-working prevention measures to minimize the risks( Remember, complete prevention from such an ever-evolving attack is quite challenging, but combinations of the following methods will surely assist you in enhancing the security and integrity of your Web apps). To protect your web application from sound-based attacks or similar side-channel attacks, it is essential to have a multi-layered approach that addresses both the technical and user behavior aspects of cybersecurity.
Here are some steps you can take to mitigate the risk of such attacks:
✅Implement Two-Factor Authentication (2FA): It adds an extra layer of security as users require to provide a second piece of information (in addition to their password, like a code from an Authenticator app or Biometric login) to access their accounts. It involves sending a code to their mobile device or email and generating random codes in the authenticator app, which reduces the effectiveness of password-based attacks. Here is an example of a practical way to implement 2FA in your specific web app as per need.
This code demonstrates the flow for implementing multi-factor authentication with Firebase Authentication. Specifically, it focuses on phone number verification as the second factor. You would need to adapt this code for various purposes to fulfill your specific application's needs, handle other MFA options, and potentially integrate the TOTP (Time-based One-Time Password) MFA if required.
Remember to also handle potential security and user experience considerations when implementing multi-factor authentication.
✅Use Biometric Authentication: Biometric authentication methods (such as fingerprint or facial recognition) are harder to clone than passwords and can add an extra layer of protection against unauthorized access from attackers. Here, you can prefer a well-instructed guide for Web developers to implement biometric authentication for their web apps.
✅Noise Reduction Algorithms: Implement noise reduction algorithms in your web application to minimize the detectable sound produced by keystrokes. While this won't provide complete protection, it can make it more challenging for attackers to detect sound patterns accurately by using AI tools. It can be done as follows:
<head>
<title>Noise Reduction Web App</title>
</head>
<body>
<button id="startButton">Start Recording</button>
<button id="stopButton" disabled>Stop Recording</button>
<br>
<audio id="audioElement" controls></audio>
<script>
let audioContext, mediaStream, scriptProcessor;
const bufferSize = 2048, threshold = 0.05;
const startButton = document.getElementById('startButton');
const stopButton = document.getElementById('stopButton');
const audioElement = document.getElementById('audioElement');
startButton.addEventListener('click', startRecording);
stopButton.addEventListener('click', stopRecording);
function startRecording() {
navigator.mediaDevices.getUserMedia({ audio: true }).then(stream => {
audioContext = new (window.AudioContext || window.webkitAudioContext)();
mediaStream = stream;
scriptProcessor = audioContext.createScriptProcessor(bufferSize, 1, 1);
scriptProcessor.onaudioprocess = e => {
const inData = e.inputBuffer.getChannelData(0),
outData = e.outputBuffer.getChannelData(0);
for (let i = 0; i < bufferSize; i++) outData[i] = Math.abs(inData[i]) < threshold ? 0 : inData[i];
};
audioContext.createMediaStreamSource(mediaStream).connect(scriptProcessor);
scriptProcessor.connect(audioContext.destination);
startButton.disabled = true;
stopButton.disabled = false;
}).catch(error => console.error('Error accessing microphone:', error));
}
function stopRecording() {
if (audioContext) {
audioContext.close();
mediaStream.getTracks().forEach(track => track.stop());
scriptProcessor = audioContext = null;
startButton.disabled = false;
stopButton.disabled = true;
}
}
</script>
</body>
</html>
Here, the code demonstrates noise reduction using the Web Audio API, or you are also free to use different audio processing libraries like RNNoise, and SpeexDSP. Let’s see how it works. First, create an HTML file and open it in your web browser. You see the following screen once you’re done.
After that, click on “Start Recording” and grant microphone access permission in your web browser, then start typing and analyzing the randomized sound produced.
Please note that the Web Audio API provides a range of nodes and methods that can be used for more advanced audio processing tasks, and you’re free to use different audio libraries to experiment as per your web app’s needs.
✅Keyboard Layout Randomization: You can implement keyboard layout randomization, which rearranges the order of keys on the virtual keyboard by making it harder for an attacker to detect the typed content based solely on sound. This is the popular method that some financial institutions have already implemented to secure their users from sound-based attacks.
✅Randomized Key Press Timing: Randomize the timing of key presses. You can introduce variation in the time interval between keystrokes. So, it is more difficult for attackers to determine the specific keys being pressed. Here is an example of code how you can do this.
<head>
<title>Randomized Key Press Timing</title>
</head>
<body>
<input id="textInput" type="text">
<script>
const textInput = document.getElementById('textInput');
textInput.addEventListener('keydown', event => {
setTimeout(() => console.log('Key pressed:', event.key), Math.random() * 500);
});
</script>
</body>
</html>
Here you can see the key press randomization logic is applied to allow you to analyze how the simulated key presses occur with random timing delay. You can create an HTML file and open it in your web browser. You see an empty box and start to type some words.
Now, locate the output in the console of the web browser showing the pressed keys along with their randomized timing.
You’re free to modify this code to integrate it into your web app. Also, experiment with different key press actions to observe how the random timing affects the behaviour while typing the texts.
✅Educate Users: Raise awareness among your users about the potential risks of sound-based attacks and the importance of not typing sensitive information like passwords or personal data during video calls or in public settings. You can mandate your users to mix the different upper and lower cases letters, numbers, and symbols, such as #,$, %, *, etc., while typing the passwords for your web app.
✅Regular Security Audits: Conducting regular security audits and penetration testing on your web application can assist you in identifying and addressing vulnerabilities. It helps you to stay ahead of potential attacks, so implementation of necessary security measures could be even easier. Also, follow secure coding practices to prevent common vulnerabilities that could be exploited by attackers (such as SQL injection, cross-site scripting (XSS), and cross-site request forgery (CSRF)) while developing your web apps.
✅Privacy Settings for Microphone: If your web application requires microphone access, ensure that users are aware of the permissions they are granting and allow them to manage those permissions easily (You can adjust the Information Architecture for this purpose). Consider providing options to disable microphone access when not needed.
✅Multi-Layered Security: Implement multiple layers of security controls ( such as firewalls, intrusion detection systems (IDS), and security monitoring) to detect and respond to potential attacks in real time. Most of such security features are based on different plans and pricing. For example, a popular platform IONOS offers some security features as part of its hosting services, such as firewall protection, malware Scanning, SSL Certificates, DDoS Protection, and backup and restore. You can perform research for other services as well.
✅Encryption: Use strong encryption protocols to secure communication between the user's device and your web application. This helps protect data from eavesdropping and interception. In most cases, you need to have an SSL/TLS certificate from a trusted Certificate Authority (CA).
✅Regular Updates and Patches: Keep your web application and underlying supporting software components up to date with the latest security patches to prevent exploitation of known vulnerabilities.
✅User Guidelines: Provide users with guidelines and proper Information Architecture (IA) on safe usage (such as avoiding sensitive conversations while typing on a keyboard during video calls or using background noise to mask typing sounds).
As research suggests the AI-driven identification of keystrokes based on typing sounds, there are risks of unauthorized access to sensitive data. The researchers have emphasized the surge in threats due to widespread video conferencing use by using machine learning in attacks and urged discussions on AI governance.
Remember that no security measure is foolproof, and a tech-savvy attacker might still find ways to exploit vulnerabilities of web apps. It is recommended to make the combination of the above methods for your web app to reduce the potential risks of sound-based attacks. Not just sound-based attacks, attackers are also using evolving techniques like blockchain-enabled modular malware Glupteba. So, it is essential to stay up to date with the security news to enhance the security features of your web app.