/QRAuthentication

QR Authentication Node.js example

Primary LanguageHTML

QR Code Authentication App

This is a simple web application that allows users to scan a QR code using an authenticator app (such as Google Authenticator) and verify authentication by entering the generated code.

Features

  • Generates a unique QR code that can be scanned with a compatible authenticator app.
  • Verifies the user's token input for validity.
  • Provides feedback on whether the authentication is successful or not.

Technology Stack

  • Backend: Node.js, Express.js, Speakeasy for generating and verifying TOTP, QRCode for generating the QR code.
  • Frontend: HTML, JavaScript, Axios for making HTTP requests.

Getting Started

Prerequisites

  • Node.js installed on your local machine.

Installation

  1. Clone the repository:

    git clone https://github.com/ilyaskarim/QRAuthentication.git
    cd QRAuthentication
  2. Install the required dependencies:

    npm install
  3. Start the server:

    npm run start
  4. Open your browser and navigate to:

    http://localhost:3000

Project Structure

  • server.js: The main backend logic handling QR code generation and token verification.
  • index.html: The frontend code providing the user interface for scanning and token input.

How It Works

  1. When the server starts, it generates a secret and creates a QR code.
  2. The QR code is displayed on the frontend, where users can scan it using an authenticator app.
  3. Users input the code generated by the authenticator app and click "Verify".
  4. The backend verifies the code and responds with a success or failure message.

Code Explanation

Backend (server.js)

  • Uses Speakeasy to generate a TOTP secret and verify user tokens.
  • Generates a QR code using QRCode and embeds it in the HTML template.
  • Exposes two routes:
    • GET /: Serves the HTML page with the QR code.
    • GET /verify: Takes a token as a query parameter and verifies it.

Frontend (index.html)

  • Displays the QR code and provides an input field for the user to enter the token.
  • Uses Axios to send the token to the backend for verification.
  • Provides immediate feedback on the result.

Example Usage

  1. Scan the displayed QR code using your authenticator app.
  2. Enter the generated code in the input field and click "Verify".
  3. See the result of the verification on the page.

Security Considerations

  • The secret key should be stored securely if used in production.
  • HTTPS should be implemented to protect the QR code and token verification process.

License

This project is open-source and available under the MIT License.

Contact

For any questions or issues, please feel free to reach out or create an issue in the repository.


Enjoy building with this QR Code Authentication App!