准备工作
本节介绍如何将OneAuth 与您的SPA应用集成,使用OneAuth作为SPA应用的用户存储库并实现用户登录。
如果您正在构建一个由服务器端渲染的Web应用,参考Web应用集成用户登录
前提条件:
- 已经具备了OneAuth的组织账户。如果没有?免费创建
- 具备基础的JavaScript开发经验
- 有SPA应用或正在构建的工程需要接入认证流程
如果你没有相关的应用,只是期望学习如何使用,建议参考如下的资料 :
Vue.js quickstart
教您构建Vue.js应用程序的基础知识,Vue Quickstart
或者,如果您想快速开始,只需下载一个应用示例,请下载我们的Vue示例。
在OneAuth控制台创建SPA应用
在您使用OneAuth可以登录用户之前,您需要在管理后台创建一个单页应用用于的OneAuth的 应用集成。
- 使用您的管理员帐户登录您的OneAuth组织。
- 在管理后台,选择 应用 > 应用
- 点击 创建应用
- 选择OIDC-Openid Connect认证方式
- 选择SPA 单页面应用 应用类型,点击下一步
- 填写应用名称,应用描述(可选)
- 用户授权方式选择Authorization Code,这将为您的SPA启用带有 PKCE 的授权码流,并能够在访问令牌过期时刷新访问令牌,而不会提示用户重新进行身份验证。
- 输入登录重定向的地址 ,例如,添加本地开发环境的地址:
http://localhost:3000/callback
,或者生产环境的地址:https://app.example.com/cal