当前位置: 首页 > 软件库 > Web应用开发 > >

passport-magic-login

授权协议 MIT License
开发语言 JavaScript
所属分类 Web应用开发
软件类型 开源软件
地区 不详
投 递 者 夹谷浩宕
操作系统 跨平台
开源组织
适用人群 未知
 软件概览

passport-magic-login

Passwordless authentication with magic links for Passport.js ��

  • User signup and login without passwords
  • Supports magic links sent via email, SMS or any other method you prefer
  • User interface agnostic: all you need is an input and a confirmation screen
  • Handles secure token generation, expiration and confirmation

Originally implemented by Tobias Lins for Splitbee and eventually extracted for Feedback Fish:

Screenshot 2021-01-09 at 16 55 23 Screenshot 2021-01-09 at 16 55 28 Screenshot 2021-01-09 at 16 56 24

Usage

To use magic link authentication, you have to:

  1. Setup the Passport strategy and Express routes on your server
  2. POST a request with the users email or phone number from the client once they have entered it into the login input

Installation

npm install passport-magic-login

Frontend usage

This is what the usage from the frontend looks like once you've set it all up. It only requires a single request:

// POST a request with the users email or phone number to the server
fetch(`/auth/magiclogin`, {
  method: `POST`,
  body: JSON.stringify({
    // `destination` is required.
    destination: email,
    // However, you can POST anything in your payload and it will show up in your verify() method
    name: name,
  }),
  headers: { 'Content-Type': 'application/json' }
})
  .then(res => res.json())
  .then(json => {
    if (json.success) {
      // The request successfully completed and the email to the user with the
      // magic login link was sent!
      // You can now prompt the user to click on the link in their email
      // We recommend you display json.code in the UI (!) so the user can verify
      // that they're clicking on the link for their _current_ login attempt
      document.body.innerText = json.code
    }
  })

Backend setup

To make this work so easily, you first need to setup passport-magic-login:

import MagicLoginStrategy from "passport-magic-login"

// IMPORTANT: ALL OPTIONS ARE REQUIRED!
const magicLogin = new MagicLoginStrategy({
  // Used to encrypt the authentication token. Needs to be long, unique and (duh) secret.
  secret: process.env.MAGIC_LINK_SECRET,

  // The authentication callback URL
  callbackUrl: "/auth/magiclogin/callback",

  // Called with th e generated magic link so you can send it to the user
  // "destination" is what you POST-ed from the client
  // "href" is your confirmUrl with the confirmation token,
  // for example "/auth/magiclogin/confirm?token=<longtoken>"
  sendMagicLink: async (destination, href) => {
    await sendEmail({
      to: destination,
      body: `Click this link to finish logging in: https://yourcompany.com${href}`
    })
  },

  // Once the user clicks on the magic link and verifies their login attempt,
  // you have to match their email to a user record in the database.
  // If it doesn't exist yet they are trying to sign up so you have to create a new one.
  // "payload" contains { "destination": "email" }
  // In standard passport fashion, call callback with the error as the first argument (if there was one)
  // and the user data as the second argument!
  verify: (payload, callback) => {
    // Get or create a user with the provided email from the database
    getOrCreateUserWithEmail(payload.destination)
      .then(user => {
        callback(null, user)
      })
      .catch(err => {
        callback(err)
      })
  }
})

// Add the passport-magic-login strategy to Passport
passport.use(magicLogin)

Once you've got that, you'll then need to add a couple of routes to your Express server:

// This is where we POST to from the frontend
app.post("/auth/magiclogin", magicLogin.send);

// The standard passport callback setup
app.get(magicLogin.callbackUrl, passport.authenticate("magiclogin"));

That's it, you're ready to authenticate! ��

License

Licensed under the MIT license. See LICENSE for more information!

  • Laravel Passport API token 验证,出现 Route [login] not defined 报错。报错显示确实不太友好,容易把错误引入到其他方向。 我刚开始看,也没看明白,不知道这个错误是啥,laravel 不应该强制用户定义 login 路由啊。通过测试,才知道是未登录导致的错误。 然后,根据 laravel 的报错提醒,我们简单追下源码,分析下问题: 错误位置

  • Enter password to unlock your login keyring ubuntu使用sudo passwd username修改密码后,打开应用程序,弹出如下错误信息对话框: Unlock Login Keyring Enter password to unlock your login keyring The password you use to login to your

  • 24.2.1. console console(config)# aaa authentication login default line console(config)# aaa authentication enable default line console(config)# line console console(config-line)# login authenticati

  • 今天在学习Django的时候一直出现http://127.0.0.1:8000/accounts/login/?next=/account/password-change/ Page not found (404) Request Method: GET Request URL: http://127.0.0.1:8000/accounts/login/?next=/account/passw

  • java操作ftp时发生530 please login with user and pass错误,debug后发现是connect后login前执行了一些需要login后执行的方法,比如ftpClient.getSystemType().将该方法移到login后,运行正常。

 相关资料
  • Magic是用JavaScript脚本开发的轻量级UI组件,具有性能高效、代码量小、支持多种初始化方式等方面的优势,Web前端开发者可以使 用Magic快速搭建前端功能比较复杂的网站。Magic的每个组件都有非常丰富的接口和事件处理,网站也提供了详细的使用文档和Demo演示。Web前 端开发者可以通过定制组件、初始化方式和插件获得最轻量级版本。Magic的底层为高效的Tangram库。 10个常用

  • magic-boot 是基于 magic-api 搭建的快速开发平台,前端采用Vue3 + Element Plus最新版本搭建,依赖较少,运行速度快。对常用组件进行封装。利用Vue3的@vue/compiler-sfc单文件编译,动态编译组件,可以实现在浏览器编写Vue代码,既改即生效快速开发,利用magic-api本身特性安全隔离生产和开发环境。将Vue代码以插件化的方式交给magic-api

  • Magic Lantern是一个开源项目,为佳能EOS相机添加了许多出厂时没有提供的功能。它最近加入的新功能中有一个叫Dual ISO,利用佳能高端相机如5D Mark II(无敌兔)和Mark III(无敌伞)的传感器,捕捉两种不同闪光范围的图像,极大的扩大了佳能相机的动态范围,使佳能的照片质量接近了尼康的流行相机如 D800和D4。Magic Lantern其他的新功能还包括延时摄影、定时曝光控制计等。 介绍内容来自 Solidot

  • 最近无事翻 Ubuntu 的软件中心,发现一个有趣的软件,叫做 Live Magic,这东西可以非常傻瓜的制作 Debian 的 Live 盘。 首先在 Ubuntu 软件中心下载 Live Magic 这个软件,装完之后会在应用程序-附件中出现 Live Magic 的快捷方式。 打 开 Live Magic 它会先让你选择是要制作 Standard Debian 安装盘还是带有 GNOME/K

  • python-magic 是 libmagic 库的 Python 语言封装,实现魔术棒的文件类型识别。 示例代码: >>> import magic>>> magic.from_file("testdata/test.pdf")'PDF document, version 1.2'>>> magic.from_buffer(open("testdata/test.pdf").read(1024)

  • Magic Wormhole 提供了这样一种文件传输方式:不需要任何的上传、网页界面,或登录密码,只需输入几个代码,即可传送文件。 Magic Wormhole 提供了一个名为 wormhole 的库和命令行工具,它可以从一台计算机到另一台计算机获取任意大小的文件和目录(或短文本)。通过使用相同的“虫洞代码”(wormhole codes)来识别两个端点。使用的代码很简短,人性化,接收方通常只需要