SuperAPI AI 工具集

workos-authkit-vanilla-js

通用与其它

查看项目

更新于 10-16 04:31

技能介绍

用途:在无框架的纯 HTML/JavaScript 项目中集成 WorkOS AuthKit,仅浏览器端运行,适用于不使用前端框架的静态或打包项目。

主要能力:按项目类型区分安装方式——存在 package.json 且使用 Vite、webpack、Parcel 等构建工具时按 README 用包管理器安装;否则用 unpkg 的 script 标签引入。实现内容包括客户端初始化、登录/登出处理与用户状态管理。

使用方式:第一步先获取 README(https://raw.githubusercontent.com/workos/authkit-js/main/README.md),README 为准,冲突时以 README 为准。第二步检测项目类型。第三步按 README 安装。第四步按 README 示例实现。关键 API 特性:createClient() 是异步的,返回 Promise,必须写成 const authkit = await createClient(clientId);。

环境变量:仅打包项目需要,Vite 用 VITE_WORKOS_CLIENT_ID,Webpack 用 REACT_APP_WORKOS_CLIENT_ID 或自定义前缀;客户端 SDK 不需要 WORKOS_API_KEY。

验证:检查 SDK 是否可用、createClient 是否使用 await、登录是否绑定在用户点击手势上;打包项目执行 pnpm build,CDN 项目在浏览器手动验证。

限制与常见错误:CDN 未加载会报 WorkOS is not defined;导入路径错误会报 createClient is not a function;环境变量未定义会报 clientId is required;使用 file:// 协议会出现 CORS 错误,需用本地开发服务器(如 npx serve);弹窗被拦截通常因未在点击处理器中调用 signIn();认证状态丢失需检查 localStorage。回调由 SDK 内部处理,无需服务端路由。具体安装命令与代码示例以 README 为准,资料未提供完整命令原文。