使用Vue 2.0快速集成OneAuth 现代IDaaS身份

准备工作

本节介绍如何将OneAuth 与您的SPA应用集成，使用OneAuth作为SPA应用的用户存储库并实现用户登录。

如果您正在构建一个由服务器端渲染的Web应用，参考Web应用集成用户登录

前提条件：

• 已经具备了OneAuth的组织账户。如果没有？免费创建
• 具备基础的JavaScript开发经验
• 有SPA应用或正在构建的工程需要接入认证流程

如果你没有相关的应用，只是期望学习如何使用，建议参考如下的资料 ：

Vue.js quickstart

教您构建Vue.js应用程序的基础知识，Vue Quickstart

或者，如果您想快速开始，只需下载一个应用示例，请下载我们的Vue示例。

在OneAuth控制台创建SPA应用

在您使用OneAuth可以登录用户之前，您需要在管理后台创建一个单页应用用于的OneAuth的 应用集成。

1. 使用您的管理员帐户登录您的OneAuth组织。
2. 在管理后台，选择 应用 > 应用
3. 点击 创建应用
4. 选择OIDC-Openid Connect认证方式
5. 选择SPA 单页面应用 应用类型，点击下一步
6. 填写应用名称，应用描述（可选）
7. 用户授权方式选择Authorization Code，这将为您的SPA启用带有 PKCE 的授权码流，并能够在访问令牌过期时刷新访问令牌，而不会提示用户重新进行身份验证。
8. 输入登录重定向的地址 ，例如，添加本地开发环境的地址：http://localhost:3000/callback,或者生产环境的地址：https://app.example.com/ca