Add captcha to contact

This commit is contained in:
Raven Scott 2024-09-19 08:30:19 -04:00
parent 18a427c7b0
commit 0066061a7b
3 changed files with 67 additions and 44 deletions

22
app.js
View File

@ -6,6 +6,7 @@ const { marked } = require('marked');
const nodemailer = require('nodemailer');
const hljs = require('highlight.js');
const { format } = require('date-fns'); // To format dates in a proper XML format
const axios = require('axios'); // Add axios for reCAPTCHA verification
const app = express();
@ -134,15 +135,26 @@ app.get('/contact', (req, res) => {
});
// Handle contact form submission
app.post('/contact', (req, res) => {
const { name, email, subject, message } = req.body;
app.post('/contact', async (req, res) => {
const { name, email, subject, message, 'g-recaptcha-response': captchaToken } = req.body;
// Validate form inputs (basic example)
if (!name || !email || !subject || !message) {
return res.render('contact', { title: 'Contact Raven Scott', msg: 'All fields are required.' });
}
// Create email content
// Verify the reCAPTCHA token
const captchaSecret = process.env.CAPTCHA_SECRET_KEY; // Your reCAPTCHA secret key
const captchaVerifyUrl = `https://www.google.com/recaptcha/api/siteverify?secret=${captchaSecret}&response=${captchaToken}`;
try {
const captchaResponse = await axios.post(captchaVerifyUrl);
if (!captchaResponse.data.success) {
return res.render('contact', { title: 'Contact Raven Scott', msg: 'Captcha verification failed. Please try again.' });
}
// CAPTCHA passed, proceed with sending email
const output = `
<p>You have a new contact request from <strong>${name}</strong>.</p>
<h3>Contact Details</h3>
@ -187,6 +199,10 @@ app.post('/contact', (req, res) => {
return res.render('contact', { title: 'Contact Raven Scott', msg: 'Your message has been sent successfully!' });
}
});
} catch (error) {
console.error('Error verifying CAPTCHA:', error);
return res.render('contact', { title: 'Contact Raven Scott', msg: 'An error occurred while verifying CAPTCHA. Please try again.' });
}
});
// Blog Post Route

View File

@ -10,6 +10,7 @@
"author": "",
"license": "ISC",
"dependencies": {
"axios": "^1.7.7",
"body-parser": "^1.20.3",
"bootstrap": "^5.3.3",
"date-fns": "^4.0.0",

View File

@ -12,6 +12,8 @@
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
<!-- Custom CSS -->
<link rel="stylesheet" href="/css/styles.css">
<!-- reCAPTCHA API -->
<script src="https://www.google.com/recaptcha/api.js" async defer></script>
</head>
<body class="bg-dark text-white">
@ -70,6 +72,10 @@
<label for="message" class="form-label">Your Message<span class="text-danger">*</span></label>
<textarea class="form-control bg-dark text-white border-secondary" id="message" name="message" rows="6" required></textarea>
</div>
<!-- reCAPTCHA -->
<div class="g-recaptcha" data-sitekey="6LcLN0kqAAAAAJtseh3ESCUtOWPcEB0y7PsMuimR"></div>
<button type="submit" class="btn btn-primary">Send Message</button>
</form>
</div>