Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: add oauth #82

Merged
merged 2 commits into from
Sep 8, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 7 additions & 0 deletions components/Icons/UilKeySkeletonAlt.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
import { SVGProps } from 'react'

export function UilKeySkeletonAlt(props: SVGProps<SVGSVGElement>) {
return (
<svg xmlns="http://www.w3.org/2000/svg" width="1.5em" height="1.5em" viewBox="0 0 24 24" {...props}><path fill="currentColor" d="m21.71 6.53l-1.42-1.41l1.42-1.41a1 1 0 1 0-1.42-1.42L9.75 12.83a5 5 0 1 0 1.42 1.42l4.88-4.89l1.41 1.42a1 1 0 0 0 .71.29a1 1 0 0 0 .71-.29a1 1 0 0 0 0-1.42L17.46 8l1.42-1.42L20.29 8a1 1 0 0 0 .71.29a1 1 0 0 0 .71-.29a1 1 0 0 0 0-1.47M7 20a3 3 0 1 1 3-3a3 3 0 0 1-3 3"></path></svg>
)
}
17 changes: 10 additions & 7 deletions pages/themes/shiro/index.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -33,11 +33,14 @@ import { ToGitHub } from '@components/ToGitHub'
- 你已安装 Mix Space 后端并且已启动
- (选择 Vercel 部署)已注册 [Vercel](https://vercel.com/) 和 [GitHub](https://github.com/) 账号

<!-- <Callout type="warning">
请注意,Shiro 主题的部署教程与初版有所不同,如果你已经部署过 Shiro
<Callout type="warning">
自 Core v7 起,已抛弃 Clerk,取而待之的是 GitHub 和 Google 的 OAuth 2.0
配置请参考[OAuth 2.0](/usage/oauth)

~~请注意,Shiro 主题的部署教程与初版有所不同,如果你已经部署过 Shiro
主题,请重新阅读本文档(尤其是填入配置文件环节,配置有所变化),并阅读
[「移除 Edge Config」](#移除-edge-config) 部分。
</Callout> -->
[「移除 Edge Config」](#移除-edge-config) 部分。~~
</Callout>

## 准备步骤

Expand Down Expand Up @@ -265,11 +268,11 @@ import { EnvVariableConfig } from '@components/EnvVariableConfig'
},
{
key: 'NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY',
name: 'Clerk 页面的公钥',
name: 'Clerk 页面的公钥(已过时)',
},
{
key: 'CLERK_SECRET_KEY',
name: 'Clerk 页面的私钥',
name: 'Clerk 页面的私钥(已过时)',
},
{
key: 'ENABLE_EXPERIMENTAL_COREPACK',
Expand Down Expand Up @@ -311,7 +314,7 @@ import { EnvVariableConfig } from '@components/EnvVariableConfig'

参见 [README 相关部分](https://github.com/Innei/Shiro/blob/main/README.md#whale-运行) 完成对应操作,随后配置[反向代理](/docs/extra#反向代理)。

## Clerk 登录与 Mix Space 后端绑定
## Clerk 登录与 Mix Space 后端绑定(已过时)

如果你遇到在 Shiro 登录之后,无法评论遇到 "和主人重名" 的报错,是因为 Clerk 的用户名和 Mix Space 后端的用户名重复了,你需要绑定本系统和 Clerk 的用户。让某个 Clerk 用户具有管理员权限。

Expand Down
1 change: 1 addition & 0 deletions pages/usage/_meta.json
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@
"backup": "备份与回滚",
"update": "更新 Mix Space",
"security": "Key 加密与安全性",
"oauth": "OAuth 2.0",
"-- community": {
"type": "separator",
"title": "社区使用指南"
Expand Down
7 changes: 7 additions & 0 deletions pages/usage/index.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@ import { UilSearchAlt } from '@components/Icons/SearchAlt'
import { UilBitcoin } from '@components/Icons/Bitcoin'
import { UilHistoryAlt } from '@components/Icons/HistoryAlt'
import { UilArrowCircleUp } from '@components/Icons/ArrowCircleUp'
import { UilKeySkeletonAlt } from '@components/Icons/UilKeySkeletonAlt'

<Cards num={3}>
<Card
Expand Down Expand Up @@ -49,6 +50,12 @@ import { UilArrowCircleUp } from '@components/Icons/ArrowCircleUp'
href={'/usage/security'}
title="Key 加密与安全性"
/>
<Card
icon={<UilKeySkeletonAlt />}
arrow
href={'/usage/oauth'}
title="OAuth 2.0"
/>
</Cards>

### 社区使用指南
32 changes: 32 additions & 0 deletions pages/usage/oauth.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
# OAuth 2.0

import { Steps } from 'nextra/components';

在 Core v7.0.0 版本,Mx-Space 重写了第三方登录功能,抛弃了 Clerk,转而直接使用对应的账户授权 SDK 实现第三方登录。

## 如何配置

<Steps>

### 新建应用

参考以下两篇:

- [在 GitHub 新建 OAuth 应用](https://docs.github.com/zh/apps/oauth-apps/building-oauth-apps/creating-an-oauth-app)
- [在 Google Cloud 新建 OAuth 应用](https://developers.google.com/identity/protocols/oauth2/web-server?hl=zh-cn#creatingcred)

对于 GitHub,`Homepage URL` 填写前端地址,`Authorization callback URL` 根据后台提示复制粘贴。

对于 Google,`已获授权的 JavaScript 来源` 填写前端地址,`已获授权的重定向 URI` 根据后台提示复制粘贴。

完成后会获取 Client ID 和 Client Secret,将他们复制下来备用。

### 后台设置

进入博客后台 -> 设定 -> 登录方式,在 OAuth 部分对应的平台名称下填写对应的 Client ID 和 Client Secret,保存后测试是否可以调用授权,若可调用即可启用并保存。

### 和主人身份绑定

在测试时通过 OAuth 授权登录后会提示是否将此账号设置为主人,允许即可。

</Steps>
Loading