Skip to content

Commit 71080b8

Browse files
committed
support using your own client
1 parent b55e44c commit 71080b8

File tree

3 files changed

+115
-65
lines changed

3 files changed

+115
-65
lines changed

.prettierrc

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"semi": false
3+
}
Lines changed: 36 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,24 @@
11
<script lang="ts" setup>
2-
import { NAlert, NSpace, NSpin, NInput } from 'naive-ui';
3-
import { ref } from 'vue';
4-
import { api } from '../api';
2+
import { NAlert, NSpace, NSpin, NInput } from "naive-ui"
3+
import { ref } from "vue"
4+
import { api } from "../api"
55
6-
const url = new URL(window.location.href);
7-
const code = url.searchParams.get("code");
8-
const error = url.searchParams.get("error");
9-
const error_description = url.searchParams.get("error_description");
6+
const url = new URL(window.location.href)
7+
const code = url.searchParams.get("code")
8+
const error = url.searchParams.get("error")
9+
const error_description = url.searchParams.get("error_description")
10+
const state = url.searchParams.get("state") || "::"
11+
const [client_id, client_secret] = state.split("::")
1012
1113
interface Token {
12-
token_type: string;
13-
access_token: string;
14-
expires_in: number;
15-
refresh_token: string;
16-
error: string;
14+
token_type: string
15+
access_token: string
16+
expires_in: number
17+
refresh_token: string
18+
error: string
1719
}
1820
19-
const token = ref<Token>();
21+
const token = ref<Token>()
2022
2123
const getToken = async () => {
2224
const resp = await fetch(api() + `/alist/ali_open/code`, {
@@ -26,31 +28,42 @@ const getToken = async () => {
2628
},
2729
body: JSON.stringify({
2830
code: code,
29-
grant_type: "authorization_code"
31+
grant_type: "authorization_code",
32+
client_id: client_id,
33+
client_secret: client_secret,
3034
}),
31-
});
32-
const res: Token = await resp.json();
33-
token.value = res;
34-
};
35+
})
36+
const res: Token = await resp.json()
37+
token.value = res
38+
}
3539
3640
if (code && !error) {
37-
getToken();
41+
getToken()
3842
}
39-
4043
</script>
4144

4245
<template>
4346
<NAlert :title="error || 'Error'" type="error" v-if="!code || error">
4447
{{ error_description }}
4548
</NAlert>
4649
<NSpace vertical size="large" v-else>
47-
<NAlert :title="token?.error" type="error" v-if="token?.error || token?.error">
50+
<NAlert
51+
:title="token?.error"
52+
type="error"
53+
v-if="token?.error || token?.error"
54+
>
4855
{{ token.error }}
4956
</NAlert>
5057
<NSpace vertical>
5158
<b>refresh_token:</b>
5259
<NSpin v-if="!token" />
53-
<NInput v-else type="textarea" autosize readonly :value="token.refresh_token" />
60+
<NInput
61+
v-else
62+
type="textarea"
63+
autosize
64+
readonly
65+
:value="token.refresh_token"
66+
/>
5467
</NSpace>
5568
</NSpace>
5669
</template>
@@ -60,4 +73,4 @@ p {
6073
margin: 0;
6174
font-size: large;
6275
}
63-
</style>
76+
</style>

docs/.vuepress/components/aliyundrive/Request.vue

Lines changed: 76 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -1,94 +1,128 @@
11
<script lang="ts" setup>
2-
import { NButton, NSpace, NAlert, NImage, useMessage, NSelect } from "naive-ui";
3-
import { ref } from "vue";
4-
import { api } from "../api";
2+
import {
3+
NButton,
4+
NSpace,
5+
NAlert,
6+
NImage,
7+
useMessage,
8+
NCheckbox,
9+
NInput,
10+
} from "naive-ui"
11+
import { ref } from "vue"
12+
import { api } from "../api"
513
6-
const alist_redirect_uri = "https://alist.nn.ci/tool/aliyundrive/callback";
7-
const app_id = "76917ccccd4441c39457a04f6084fb2f";
14+
const alist_redirect_uri = "https://alist.nn.ci/tool/aliyundrive/callback"
15+
const app_id = "76917ccccd4441c39457a04f6084fb2f"
816
917
function goGet() {
10-
const url = new URL("https://open.aliyundrive.com/oauth/authorize");
11-
url.searchParams.set("client_id", app_id);
12-
url.searchParams.set("redirect_uri", alist_redirect_uri);
13-
url.searchParams.set("scope", "user:base,file:all:read,file:all:write");
14-
url.searchParams.set("response_type", "code");
15-
url.searchParams.set("state", "");
16-
url.searchParams.set("relogin", "true");
17-
window.open(url.toString(), "_blank");
18+
const url = new URL("https://open.aliyundrive.com/oauth/authorize")
19+
url.searchParams.set("client_id", useMyOwn.value ? client_id.value : app_id)
20+
url.searchParams.set("redirect_uri", alist_redirect_uri)
21+
url.searchParams.set("scope", "user:base,file:all:read,file:all:write")
22+
url.searchParams.set("response_type", "code")
23+
url.searchParams.set(
24+
"state",
25+
window.btoa(
26+
useMyOwn.value ? `${client_id.value}::${client_secret.value}` : "::"
27+
)
28+
)
29+
url.searchParams.set("relogin", "true")
30+
window.open(url.toString(), "_blank")
1831
}
1932
2033
interface QrCodeResp {
21-
qrCodeUrl: string;
22-
sid: string;
23-
error: string;
34+
qrCodeUrl: string
35+
sid: string
36+
error: string
2437
}
2538
26-
const qrcode = ref<QrCodeResp>();
39+
const qrcode = ref<QrCodeResp>()
2740
28-
const gettingQrCode = ref(false);
41+
const gettingQrCode = ref(false)
42+
const client_id = ref("")
43+
const client_secret = ref("")
44+
const useMyOwn = ref(false)
2945
3046
async function getQrCode() {
3147
try {
32-
gettingQrCode.value = true;
48+
gettingQrCode.value = true
3349
const resp = await fetch(api() + "/alist/ali_open/qr", {
3450
method: "POST",
3551
headers: {
3652
"Content-Type": "application/json",
3753
},
38-
body: JSON.stringify({}),
39-
});
40-
const res: QrCodeResp = await resp.json();
41-
qrcode.value = res;
54+
body: JSON.stringify(
55+
useMyOwn.value
56+
? {
57+
client_id: client_id.value,
58+
client_secret: client_secret.value,
59+
}
60+
: {}
61+
),
62+
})
63+
const res: QrCodeResp = await resp.json()
64+
qrcode.value = res
4265
} catch (e) {
43-
console.log(e);
66+
console.log(e)
4467
qrcode.value = {
4568
error: "error",
4669
qrCodeUrl: "",
4770
sid: "",
48-
};
71+
}
4972
} finally {
50-
gettingQrCode.value = false;
73+
gettingQrCode.value = false
5174
}
5275
}
5376
5477
interface ScanStatus {
55-
status: string;
56-
authCode: string;
78+
status: string
79+
authCode: string
5780
}
5881
59-
const scanStatus = ref<ScanStatus>();
60-
const gettingScanStatus = ref(false);
82+
const scanStatus = ref<ScanStatus>()
83+
const gettingScanStatus = ref(false)
6184
62-
const message = useMessage();
85+
const message = useMessage()
6386
6487
async function haveScan() {
6588
try {
66-
gettingScanStatus.value = true;
89+
gettingScanStatus.value = true
6790
const resp = await fetch(
6891
`${api()}/proxy/https://open.aliyundrive.com/oauth/qrcode/${
6992
qrcode.value?.sid
7093
}/status`
71-
);
72-
const res: ScanStatus = await resp.json();
73-
scanStatus.value = res;
94+
)
95+
const res: ScanStatus = await resp.json()
96+
scanStatus.value = res
7497
if (res.status === "LoginSuccess") {
75-
const url = new URL(alist_redirect_uri);
76-
url.searchParams.set("code", res.authCode);
77-
window.open(url.toString(), "_blank");
98+
const url = new URL(alist_redirect_uri)
99+
url.searchParams.set("code", res.authCode)
100+
window.open(url.toString(), "_blank")
78101
} else {
79-
message.warning(res.status);
102+
message.warning(res.status)
80103
}
81104
} catch (e) {
82-
console.log(e);
83-
message.error(String(e));
105+
console.log(e)
106+
message.error(String(e))
84107
} finally {
85-
gettingScanStatus.value = false;
108+
gettingScanStatus.value = false
86109
}
87110
}
88111
</script>
89112

90113
<template>
91114
<NSpace vertical size="large">
115+
<NCheckbox v-model:checked="useMyOwn" size="large"
116+
>Use my own client</NCheckbox
117+
>
118+
<template v-if="useMyOwn">
119+
<NInput size="large" v-model:value="client_id" placeholder="client_id" />
120+
<NInput
121+
size="large"
122+
v-model:value="client_secret"
123+
placeholder="client_secret"
124+
/>
125+
</template>
92126
<NButton size="large" type="primary" @click="goGet" block
93127
>Go to login</NButton
94128
>

0 commit comments

Comments
 (0)