¶ 登录组件（Guard）
本文对应 Authing 老版本产品。如需了解最新功能说明，请查看 接入 Authing Guard (opens new window)。
Authing 登录组件（Guard）是一种可嵌入的登录表单，可根据你的需求进行配置，建议用于单页面应用程序。它使你可以轻松添加各种社会化登录方式，以便你的用户可以无缝登录，并且在不同平台拥有一致的登录体验。Guard 为开发者屏蔽了很多底层认证的实现细节，同时也包括繁琐的 UI 开发。
Guard 可以集成到你的 React、Vue.js、Angular 以及原生 JavaScript 项目中，你可以借助此组件快速实现登录认证流程。
¶ 功能列表
¶ 丰富的登录注册方式
内置丰富的登录注册方式供开发者选择：
- 账号密码登录（包括手机号 + 密码、邮箱 + 密码、用户名 + 密码）；
- 手机验证码登录；
- APP 扫码登录（需先接入 APP 扫码登录）；
- 小程序扫码登录（需先在后台配置）；
- 社会化登录，如 GitHub 登录（需先在后台配置）；
- 企业身份源登录（需要配置企业身份源）；
¶ 内置忘记密码流程
Guard 内置了忘记密码的交互 UI，你无需编写任何额外代码。
¶ 内置多因素认证（MFA）能力
Guard 内置了多因素认证（MFA）功能，当你的应用开启了多因素认证之后，用户可以使用该组件完成多因素认证。你无需编写任何额外代码。
¶ 响应式布局
响应式布局，完美兼容移动端和 PC 端，同时你可以通过自定义 CSS 轻易地自定义登录框样式。
¶ 兼容前端所有主流框架
¶ 在线示例
¶ 在 React 项目中使用
你可以在你的 React 项目中引入 @authing/react-ui-components 包，详情请见 React 登录组件使用文档。
¶ 在 Vue.js 项目中使用
你可以在你的 Vue.js 项目中引入 @authing/vue-ui-components 包，详情请见 Vue.js 登录组件使用文档。
¶ 在 Angular 项目中使用
你可以在你的 Vue.js 项目中引入 @authing/ng-ui-components 包，详情请见 Angular 登录组件使用文档。
¶ 在原生 JavaScript 项目中使用
你可以在你的原生 JavaScript 项目中引入 @authing/native-js-ui-components 包，详情请见 原生 JavaScript 登录组件使用文档。