Let's implement the password reset functionality for your Blog with CMS project. This is an important feature that will allow users to recover their accounts if they forget their passwords. ### Step-by-Step Implementation #### 1. Add Required Fields to User Model First, we need to add fields to store the password reset token and its expiry time in the User model. ```javascript // models/User.js const userSchema = new mongoose.Schema({ // ... other fields ... resetToken: { type: String, required: false }, resetTokenExpiry: { type: Date, required: false } }); ``` #### 2. Create Utility Function for Password Reset Create a utility function that will handle generating the reset token and sending the email. ```javascript // utils/auth.utils.js const crypto = require('crypto'); const nodemailer = require('nodemailer'); require('dotenv').config(); const transport = nodemailer.createTransport({ service: 'gmail', host: 'smtp.gmail.com', auth: { user: process.env.EMAIL_USERNAME, pass: process.env.EMAIL_PASSWORD } }); const generateResetToken = () => { return crypto.randomBytes(32).toString('hex'); }; const sendResetLink = async (email, resetToken, resetUrl) => { try { await transport.sendMail({ from: process.env.EMAIL_USERNAME, to: email, subject: 'Password Reset Request', html: `

Password Reset Request

Click the link below to reset your password:

${resetUrl} ` }); } catch (error) { console.error('Error sending password reset email:', error); throw error; } }; module.exports = { generateResetToken, sendResetLink }; ``` #### 3. Create Routes for Password Reset Add the routes for handling password reset requests and the reset process. ```javascript // routes/auth.routes.js const express = require('express'); const router = express.Router(); const { generateResetToken, sendResetLink } = require('../utils/auth.utils'); const { User } = require('../models/User'); router.post('/forgot-password', async (req, res) => { try { const { email } = req.body; // Find user by email const user = await User.findOne({ email }); if (!user) { return res.status(404).json({ error: 'User not found' }); } // Generate reset token const resetToken = generateResetToken(); const resetTokenExpiry = Date.now() + 30 * 60 * 1000; // 30 minutes // Update user with reset token and expiry user.resetToken = resetToken; user.resetTokenExpiry = resetTokenExpiry; await user.save(); // Generate reset URL const resetUrl = `${req.headers.origin}/reset-password?token=${resetToken}`; // Send reset link via email await sendResetLink(user.email, resetToken, resetUrl); res.json({ message: 'Password reset link sent to your email' }); } catch (error) { console.error('Error in forgot password:', error); res.status(500).json({ error: 'Internal server error' }); } }); router.post('/reset-password', async (req, res) => { try { const { token, newPassword } = req.body; // Find user by reset token const user = await User.findOne({ resetToken: token, resetTokenExpiry: { $gt: Date.now() } }); if (!user) { return res.status(404).json({ error: 'Invalid or expired token' }); } // Validate new password if (!newPassword || newPassword.length < 8) { return res.status(400).json({ error: 'Password must be at least 8 characters' }); } // Update user's password user.password = await bcrypt.hash(newPassword, 10); user.resetToken = undefined; user.resetTokenExpiry = undefined; await user.save(); res.json({ message: 'Password reset successfully' }); } catch (error) { console.error('Error in reset password:', error); res.status(500).json({ error: 'Internal server error' }); } }); module.exports = router; ``` #### 4. Update Frontend Create a simple form in the frontend for users to enter their email and receive the reset link. ```javascript // components/ForgotPassword.js import React, { useState } from 'react'; import axios from 'axios'; const ForgotPassword = () => { const [email, setEmail] = useState(''); const [message, setMessage] = useState(null); const handleSubmit = async (e) => { e.preventDefault(); try { const response = await axios.post('/api/auth/forgot-password', { email }); setMessage({ type: 'success', text: response.data.message }); } catch (error) { setMessage({ type: 'error', text: error.response?.data?.error || 'An error occurred' }); } }; return (

Forgot Password

{message && (

{message.text}

)}

); }; export default ForgotPassword; ``` #### 5. Add Password Reset Form Create another form where users can enter their new password after clicking the reset link. ```javascript // components/ResetPassword.js import React, { useState, useEffect } from 'react'; import axios from 'axios'; import { useParams } from 'react-router-dom'; const ResetPassword = () => { const [password, setPassword] = useState(''); const [message, setMessage] = useState(null); const { token } = useParams(); const handleSubmit = async (e) => { e.preventDefault(); try { const response = await axios.post('/api/auth/reset-password', { token, newPassword: password }); setMessage({ type: 'success', text: response.data.message }); } catch (error) { setMessage({ type: 'error', text: error.response?.data?.error || 'An error occurred' }); } }; return (

Reset Password

{message && (

{message.text}

)}

); }; export default ResetPassword; ``` #### 6. Add Routes in Frontend Add the routes for these components in your main routing configuration. ```javascript // App.js import { BrowserRouter as Router, Route, Switch } from 'react-router-dom'; import ForgotPassword from './components/ForgotPassword'; import ResetPassword from './components/ResetPassword'; function App() { return ( {/* Other routes */} ); } export default App; ``` ### Security Considerations 1. **Email Configuration**: Make sure to configure your email settings properly in the environment variables. 2. **Token Expiry**: The reset token should expire after a reasonable time (we've set it to 30 minutes in this example). 3. **Password Hashing**: Always hash the new password before storing it in the database. 4. **Rate Limiting**: Consider adding rate limiting to prevent abuse of the password reset functionality. 5. **HTTPS**: Make sure your application uses HTTPS in production to secure the communication between client and server. ### Testing 1. Test the entire flow from requesting a password reset to successfully changing the password. 2. Verify that the reset token expires after the specified time. 3. Test error cases such as invalid email, expired token, and weak password. ### Next Steps After implementing the password reset functionality, you can move on to implementing role-based access control and protecting API routes with JWT. ### Further Reading - [Password Reset Best Practices](https://auth0.com/blog/password-reset-via-email/) - [Node.js Email Sending with Nodemailer](https://nodemailer.com/about/) - [JWT Token Expiry Handling](https://jwt.io/introduction/) This implementation provides a secure and user-friendly way to handle password resets in your Blog with CMS application.