CSC/ECE 517 Spring 2025 - E2518. Reimplement password resets (frontend + backend)
Overview
This project involves reimplementing Expertiza’s password reset functionality by replacing the temporary password system with a secure, token-based email workflow. The new implementation eliminates the need for temporary passwords and introduces a more secure password reset functionality. The solution includes both frontend (React) and backend (Ruby on Rails) components, following security best practices and DRY principles while improving user experience.
Background
Expertiza is an open-source learning management system built with Ruby on Rails. The framework allows instructors to create and edit assignments with a plethora of features.
- Students can form teams on the platform and collaborate on assignments.
- Students can peer review other students’ works while giving feedback to help peers improve.
- The platform also allows students to view their grades on completion of evaluation.
Problem Statement
The existing Expertiza system lacks a proper password reset mechanism. The current password reset system sends temporary passwords via emails requiring users to:
- Log in with the temporary password - Immediately reset their password after logging in
While this is a decent workflow it still exposes the system to security risks and usability challenges. It has usability and security concerns. The process is difficult to navigate, lacks clear feedback for users, and doesn't securely handle password reset tokens.
Our goal is to:
- Reimplement the password reset process to be more intuitive and secure.
- Allow users to request a password reset via email and securely reset their password.
- Ensure the token generation, validation, and expiration process follows best security practices.
- Create a simple frontend UI for a smoother, more accessible experience.
Current Implementations
The current system provides a mechanism for users to reset their passwords in case they forget them. When a user clicks on the "Forgot Password" option on the login page, they are redirected to a Forgot Password page, where they are prompted to enter the email address associated with their account.
Upon submitting their email, the system generates and sends a temporary password to the provided email address. The user can then use this temporary password to log in. Once the user successfully logs in with the temporary password, they are immediately prompted to set a new password, which updates their account credentials. This implementation ensures that users can regain access to their accounts securely while enforcing a password reset process to maintain security.
Requirements
I) Functional Requirements
- System sends email with a secure reset link. This link expires after a given time period.
- Users need to reset their password via the link.
- All emails are sent from expertizamailer@gmail.com
II) Non-Functional Requirements
- Secure token generation/validation
- Prevention of email enumeration attacks
- Responsive frontend design
- Comprehensive error handling
Reimplementation and Improvements
Frontend Components
I) Existing Design
The existing design only has one page where the user can input their email address in order to generate a temporary password.
II) Modified Design
- The new implemented design also has a similar page to the existing design in ForgotPassword.jsx. This component was created to allow users to submit their email for password reset requests.
- It also has the ResetPassword.jsx page which was developed to securely allow users to enter a new password, with a verification of the token's validity.
- ForgotPassword.tsx: initiates a password reset
- ResetPassword.tsx: validates token from URL, collects new password with confirmation, enforces minimum password length (i.e. 6 characters), updates password
- Added routes in App.tsx for password reset flow
- This is an example email when a user requests to reset the password.
III) Files Changed for this Modification
1. ForgotPassword.tsx
2. ResetPassword.jsx
2. App.tsx
IV) Rationale
The original password reset flow lacked clarity and visual feedback. By improving the UI, users can easily submit their requests and securely reset their passwords with proper validation and error handling, resulting in a smoother user experience.
Backend Components
I) Existing Design
The User model did not support password reset functionality without setting a temporary password.
II) Modified Design
- PasswordsController managed generating a token, sending mail to user and validating token and updating password.
- UserMailer sends reset password mail to user.
- User Model manages methods to generate and destroy tokens and to validate token expiry.
- The User model was updated to include two new attributes: reset_password_token and reset_password_sent_at.
- Implemented methods in the User model to generate, validate, and expire tokens. These methods ensure that tokens are securely created and invalidated after 24 hours.
III) Files Changed for this Modification
2. user.rb
IV) Rationale
By adding support for password reset tokens, users can securely reset their password using a unique token sent via email. This change also prevents unauthorized access by ensuring tokens expire after a set time.
API Endpoints
1. POST /api/v1/password_resets - Initiate password reset
2. GET /password_resets/:token - Validates the reset token
3. PUT /api/v1/password_resets/:token - Update password
Database Design
user model:
1. reset_password_token (string) - Unique token for password reset
2. reset_password_sent_at (datetime) - Timestamp when token was generated
Security Features
1. BCrypt Hashing
2. 24-hour token expiration (extended from original 2-hour plan)
3. Generic error messages
4. Rate limiting
Testing
I) Backend Testing
RSpec tests were written for the PasswordsController:
- Tests for sending password reset emails.
- Tests for verifying valid and expired tokens.
- Tests for updating the password.
- FactoryBot was used to create test users and password reset tokens.
II) Frontend Testing
Manual testing was done for:
- The ForgotPassword form submission and reset email handling.
- The ResetPassword form for handling valid and expired tokens.
- Ensured error handling and loading states were properly managed with React Context/Redux.
Functional Testing:
- Verified that the PasswordsController correctly handled the password reset flow, including token validation, expiration, and successful password update.
- Ensured users received the password reset email and could follow the provided link to reset their password.
III) Testing Instructions
The deployment doesn't allow creating new users. Hence for testing purposes we have setup an email id by manually added them into the database.
Steps for testing:
1) Go to http://152.7.177.227:3000/login and click on 'forget password' button.
2) Input the email address: testoodd1234@gmail.com and click on request password.
3) Open another tab and log into gmail using the following credentials:
email: testoodd1234@gmail.com pass: Test@1234
4) After logging in, you should be able to see the inbox and there should be an email from expertiza mailer. Open the email and click on the link to reset password.
5) Type in the new password and reset it. Then head back to http://152.7.177.227:3000/login and try logging in with the email and the new password that you setup.
Repository Links
FrontEnd
Pull Request(FrontEnd)
Project Mentor
Prathyusha Kodali (pkodali@ncsu.edu)
Team Members
Devang Saraogi (dsaraog@ncsu.edu)
Galav Sharma (gsharma3@ncsu.edu)
Jash Shah (jshah23@ncsu.edu)