Git Product home page Git Product logo

iamsdr / myauthenticator Goto Github PK

View Code? Open in Web Editor NEW
4.0 1.0 2.0 942 KB

A serverless web application that generates TOTP and HOTP codes, enabling robust two-factor authentication (2FA) directly within your browser. Powered by Nuxt 3, NuxtHub, Cloudflare Pages, D1 Database, and Drizzle ORM.

Home Page: https://my-authenticator.pages.dev/

License: GNU Affero General Public License v3.0

TypeScript 46.27% Vue 53.73%
authenticator cloudflare-pages cloudflared1 drizzle-orm hotp-generator nuxt3 nuxthub serverless tailwindcss totp-generator typescript vuejs 2fa hotp nuxtjs totp two-factor-authentication vue3 webdevelopment

myauthenticator's Introduction

logo

MyAuthenticator

A serverless web application that generates TOTP and HOTP codes, enabling robust two-factor authentication (2FA) directly within your browser.

Nuxt 3 Badge Cloudflare Pages Badge Typescript Badge Drizzle Badge Tailwindcss Badge

Live Demo

See the live demo:

Demo Site

  • Credentials: admin - Admin@123$

Features ๐Ÿ”ฅ

๐Ÿš€ Serverless: Leverages complete edge support, eliminating the need to maintain a server. You can deploy this project on your Cloudflare account for Free.

โš™๏ธ Compatibility: MyAuthenticator supports TOTP (Time-Based One-Time Password) and HOTP (HMAC-Based One-Time Password), which are widely used by most services for two-factor authentication.

โ˜€๏ธ Theming: Offers light and dark themes, with customizable accent colors.

๐Ÿ’ซ Icons: Includes 100+ colored icons and access to 3000+ icons from SimpleIcons, all are in SVG format for scalability.

๐Ÿ” Secure: Uses nuxt-auth-utils for authentication and encrypts database fields for enhanced security.

๐Ÿ—ƒ๏ธ Backup / Restore: Securely backup and restore authenticators with encryption. Supports import from and export to Google Authenticator.

๐Ÿค– Telegram Bot and MiniApp: You can use this web app as a Telegram miniapp within the Telegram app.

Screenshots ๐Ÿ“ฑ

Screenshot

Environment Variables

# required
NUXT_SESSION_PASSWORD="your-super-long-secret-for-session-encryption"
NUXT_AUTH_USERNAME="admin"
NUXT_AUTH_PASSWORD="Admin@123$"

# optional
NUXT_DB_ENCRYPTION_PASSWORD="your-super-long-secret-for-db-encryption"
NUXT_TELEGRAM_BOT_TOKEN="12345678:AAEzFGO9ME4i7hV9gfPTgAcJABCDEFG"
NUXT_TELEGRAM_USERID="874962691"

Required Variables

  • NUXT_SESSION_PASSWORD: This password is used by nuxt-auth-utils to secure your session. It must be at least 32 characters long.

  • NUXT_AUTH_USERNAME: The username for authentication. It must be at least 5 characters long.

  • NUXT_AUTH_PASSWORD: The password for authentication. It must be at least 8 characters long and include:

    • One uppercase letter
    • One digit
    • One lowercase letter
    • Two special characters

Optional Variables

  • NUXT_DB_ENCRYPTION_PASSWORD: This password is used to encrypt and decrypt the database field of secretkey. By default, no encryption is used for data stored in the database. You can enable encryption by setting this variable. It must be exactly 32 characters long.

  • NUXT_TELEGRAM_BOT_TOKEN: This is the Bot Token for the Telegram Bot, which can be obtained from @BotFather. Required for using this web app as a Telegram miniapp.

  • NUXT_TELEGRAM_USERID: This is your Telegram User ID used to identify you as a user of the bot. Obtain it from @MissRose_bot using the /info command. Required for using this web app as a Telegram miniapp.

Deploy to Cloudflare Pages

Note

This project is currently under testing and improvements. Please back up your data before proceeding.

You can deploy this project on your Cloudflare account for free and with zero configuration using NuxtHub You can use either the NuxtHub CLI or the NuxtHub Admin Web UI.

Using NuxtHub CLI

  • First, clone this repository.

  • Follow this guide and create .env file and add necessary environment variables

npx nuxthub deploy
  • Once you deployed your project, apply migrations in production with:
npx nuxi dev --remote
  • That's it, you've created your own authenticator.

  • You can set up your Telegram bot at https://< yourapp >.pages.dev/telegram

Using NuxtHub Web UI

  • First, fork this repository.
  • Open the NuxtHub Admin
  • Click on New Project then Import a GitHub repository
  • Select your Github repository
  • Click on Import repository
  • Add the necessary environment variables
  • After deploying, go to your project dashboard and create a table in the database by running the following SQL query in the SQL runner:
CREATE TABLE `accounts` (
	`id` integer PRIMARY KEY AUTOINCREMENT NOT NULL,
	`type` text NOT NULL,
	`issuer` text NOT NULL,
	`label` text NOT NULL,
	`secret` text NOT NULL,
	`algorithm` text NOT NULL,
	`digits` integer NOT NULL,
	`period` integer NOT NULL,
	`counter` integer NOT NULL,
	`icon` text NOT NULL,
	`icontype` text NOT NULL,
	`createdAt` text DEFAULT (current_timestamp) NOT NULL
);
  • That's it, you've created your own authenticator.
  • You can set up your Telegram bot at https://< yourapp >.pages.dev/telegram

Contributing and Suggestions

Feel free to contribute to this project with your ideas and improvements. Your feedback and suggestions are highly valued and will help enhance this project further.

License

MyAuthenticator is Free Software: You can use, study share and improve it at your will. Specifically you can redistribute and/or modify it under the terms of the GNU Affero General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version.

myauthenticator's People

Contributors

iamsdr avatar

Stargazers

Pigeon avatar  avatar  avatar  avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.