feat: support set api key from client side

app/api/google/[...path]/route.ts

@@ -43,7 +43,9 @@ async function handle(
     10 * 60 * 1000,
   );
 
-  const key = req.nextUrl.searchParams.get("key") ?? serverConfig.googleApiKey;
+  const bearToken = req.headers.get("Authorization") ?? "";
+  const token = bearToken.trim().replaceAll("Bearer ", "").trim();
+  const key = token ?? serverConfig.googleApiKey;
   const fetchUrl = `${baseUrl}/${path}?key=${key}`;
 
   const fetchOptions: RequestInit = {

app/client/platforms/google.ts

@@ -49,7 +49,6 @@ export class GeminiApi implements LLMApi {
     const shouldStream = false;
     const controller = new AbortController();
     options.onController?.(controller);
-
     try {
       const chatPath = this.path(Google.ChatPath);
       const chatPayload = {

app/components/auth.tsx

@@ -64,6 +64,17 @@ export function AuthPage() {
               );
             }}
           />
+          <input
+            className={styles["auth-input"]}
+            type="password"
+            placeholder={Locale.Settings.Access.Google.ApiKey.Placeholder}
+            value={accessStore.googleApiKey}
+            onChange={(e) => {
+              accessStore.update(
+                (access) => (access.googleApiKey = e.currentTarget.value),
+              );
+            }}
+          />
         </>
       ) : null}
 

app/locales/cn.ts

@@ -13,7 +13,7 @@ const cn = {
   Auth: {
     Title: "需要密码",
     Tips: "管理员开启了密码验证，请在下方填入访问码",
-    SubTips: "或者输入你的 OpenAI API 密钥",
+    SubTips: "或者输入你的 OpenAI 或 Google API 密钥",
     Input: "在此处填写访问码",
     Confirm: "确认",
     Later: "稍后再说",

app/locales/en.ts

@@ -15,7 +15,7 @@ const en: LocaleType = {
   Auth: {
     Title: "Need Access Code",
     Tips: "Please enter access code below",
-    SubTips: "Or enter your OpenAI API Key",
+    SubTips: "Or enter your OpenAI or Google API Key",
     Input: "access code",
     Confirm: "Confirm",
     Later: "Later",