npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2026 – Pkg Stats / Ryan Hefner

snail-login

v1.10.3

Published

蜗牛登录通用组件

Readme

蜗牛登录组件

蜗牛登录组件,包括客户端内及客户端外的情况

用法

安装

npm i snail-login --save

或者

yarn add snail-login

使用

获取全局唯一实例

主要用于多组件之间共享如同一个Login示例,防止被多次实例化,节省资源(比如多个组件中调用isLogined异步获取登录状态时,app中不会多次发送不必要的请求去重复获取)

import {getLoginInstance} from 'snail-login'
const login = getLoginInstance(); //通过该方法获取的Login的实例全局唯一

常规用法

  • 使用时需先实例化!!
  • isLogined 判断当前页的登录状态,异步返回,返回值为Promise,详细用法见下面示例
/**
* 获取页面的登陆状态,异步返回!!
* @param {Boolean} useH5Logic 是否在客户端环境下也使用H5的逻辑判断是否登录,只用户开发阶段,请勿用于生产环境(将会导致客户端登陆状态判断不准确)!!
* @returns {Promise} 返回一个Promise,如果当前用户已登录,会resolve用户的信息,否则会resolve null
*/
function isLogined(){...}
  • login 主动登陆,客户端内会自动唤起登陆模块,客户端外则会跳转登陆页,参数及用法见以下示例
/**
* 登录方法,客户端内会唤起登陆模块,客户端外会跳转到登陆页
* @param {Object} options - 登录方法的参数
* @param {string} options.type - 登陆方式,'mail/phone',默认为mail即邮件登陆
* @param {string} options.h5Type - h5端内登陆方式,'mail/phone/weibo/qq/wechat',直接使用制定的方式登陆,默认为空,即先进入登陆方式选择页
* @param {function} options.callback - 客户端内登陆后的回调函数,参数为userInfo,如果用户取消登陆,userInfo为null,正常登录,userInfo为用户的信息
* @param {string} options.targetUrl - 客户端外的登录成功的跳转地址,无需转义
*/
function login(){...}

示例

import {getLoginInstance} from 'snail-login'
const login = getLoginInstance(); //通过该方法获取的Login的实例全局唯一
import Login from 'snail-login'
const login = new Login();
//isLogined方法,判断当前页面登录状态,异步返回,客户端内已登录会自动进行同步登录
//已登录状态会直接返回用户的信息,未登录状态只返回null
async function checkLogin(){
  try {
    const userInfo = await login.isLogined();
    if(userInfo){
      this.isLogined = true;
      this.userInfo = userInfo;
    }else{
      this.isLogined = false;
    }
  } catch (error) {
    console.log('check login failed', error);
  }
},

//login方法,客户端内唤起登录模块,客户端外跳转登陆页
//可选参数:callback,客户端内登录成功后的回调方法,回调方法内的参数为userInfo,
//如果用户成功登陆,userInfo为用户信息,如果用户取消登录,userInfo为null
//可选参数: type, 'mail/phone'唤起默认登录方式还是手机号登陆方式,不传代表默认为mail
//可选参数: h5Type, 'mail/phone/weibo/qq/wechat',直接使用制定的方式登陆,默认为空,即先进入登陆方式选择页
//可选参数:targetUrl,客户端外登陆成功后的跳转链接
login.login({
  type: 'phone',
  callback: userInfo => {
    if(userInfo){
      this.isLogined = true;
      this.userData = userInfo;
      this.getInfo();
    }
  },
  targetUrl: location.href
})