From 1c20137b0e930c8a7171abaabfa857465db77ad0 Mon Sep 17 00:00:00 2001
From: lloydzhou <lloydzhou@qq.com>
Date: Fri, 5 Jul 2024 19:59:45 +0800
Subject: [PATCH 1/6] support azure deployment name

---
 app/api/auth.ts                 |  2 +-
 app/api/common.ts               | 19 +++++++--------
 app/client/api.ts               | 19 ++++++++++-----
 app/client/platforms/openai.ts  | 41 ++++++++++++++++++++++++++++++++-
 app/components/chat.tsx         | 35 ++++++++++++++++++----------
 app/components/exporter.tsx     | 11 +++++----
 app/components/home.tsx         |  7 +++---
 app/components/model-config.tsx | 19 +++++++--------
 app/constant.ts                 | 12 ++++++++++
 app/store/access.ts             |  7 +++++-
 app/store/chat.ts               | 10 ++++----
 app/store/config.ts             |  2 ++
 app/utils/checkers.ts           | 21 -----------------
 app/utils/hooks.ts              |  7 +++++-
 next.config.mjs                 |  5 ++++
 15 files changed, 143 insertions(+), 74 deletions(-)
 delete mode 100644 app/utils/checkers.ts

diff --git a/app/api/auth.ts b/app/api/auth.ts
index b750f2d1731..2b4702aedc3 100644
--- a/app/api/auth.ts
+++ b/app/api/auth.ts
@@ -75,7 +75,7 @@ export function auth(req: NextRequest, modelProvider: ModelProvider) {
         break;
       case ModelProvider.GPT:
       default:
-        if (serverConfig.isAzure) {
+        if (req.nextUrl.pathname.includes("azure/deployments")) {
           systemApiKey = serverConfig.azureApiKey;
         } else {
           systemApiKey = serverConfig.apiKey;
diff --git a/app/api/common.ts b/app/api/common.ts
index 1454fde2ed1..17b5f916533 100644
--- a/app/api/common.ts
+++ b/app/api/common.ts
@@ -14,9 +14,11 @@ const serverConfig = getServerSideConfig();
 export async function requestOpenai(req: NextRequest) {
   const controller = new AbortController();
 
+  const isAzure = req.nextUrl.pathname.includes("azure/deployments");
+
   var authValue,
     authHeaderName = "";
-  if (serverConfig.isAzure) {
+  if (isAzure) {
     authValue =
       req.headers
         .get("Authorization")
@@ -56,14 +58,13 @@ export async function requestOpenai(req: NextRequest) {
     10 * 60 * 1000,
   );
 
-  if (serverConfig.isAzure) {
-    if (!serverConfig.azureApiVersion) {
-      return NextResponse.json({
-        error: true,
-        message: `missing AZURE_API_VERSION in server env vars`,
-      });
-    }
-    path = makeAzurePath(path, serverConfig.azureApiVersion);
+  if (isAzure) {
+    const azureApiVersion = req?.nextUrl?.searchParams?.get("api-version");
+    baseUrl = baseUrl.split("/deployments").shift();
+    path = `${req.nextUrl.pathname.replaceAll(
+      "/api/azure/",
+      "",
+    )}?api-version=${azureApiVersion}`;
   }
 
   const fetchUrl = `${baseUrl}/${path}`;
diff --git a/app/client/api.ts b/app/client/api.ts
index edee993424a..896880fa3f6 100644
--- a/app/client/api.ts
+++ b/app/client/api.ts
@@ -30,6 +30,7 @@ export interface RequestMessage {
 
 export interface LLMConfig {
   model: string;
+  providerName?: string;
   temperature?: number;
   top_p?: number;
   stream?: boolean;
@@ -54,6 +55,7 @@ export interface LLMUsage {
 
 export interface LLMModel {
   name: string;
+  displayName?: string;
   available: boolean;
   provider: LLMModelProvider;
 }
@@ -160,10 +162,14 @@ export function getHeaders() {
     Accept: "application/json",
   };
   const modelConfig = useChatStore.getState().currentSession().mask.modelConfig;
-  const isGoogle = modelConfig.model.startsWith("gemini");
-  const isAzure = accessStore.provider === ServiceProvider.Azure;
-  const isAnthropic = accessStore.provider === ServiceProvider.Anthropic;
-  const authHeader = isAzure ? "api-key" : isAnthropic ? 'x-api-key' : "Authorization";
+  const isGoogle = modelConfig.providerName == ServiceProvider.Azure;
+  const isAzure = modelConfig.providerName === ServiceProvider.Azure;
+  const isAnthropic = modelConfig.providerName === ServiceProvider.Anthropic;
+  const authHeader = isAzure
+    ? "api-key"
+    : isAnthropic
+    ? "x-api-key"
+    : "Authorization";
   const apiKey = isGoogle
     ? accessStore.googleApiKey
     : isAzure
@@ -172,7 +178,8 @@ export function getHeaders() {
     ? accessStore.anthropicApiKey
     : accessStore.openaiApiKey;
   const clientConfig = getClientConfig();
-  const makeBearer = (s: string) => `${isAzure || isAnthropic ? "" : "Bearer "}${s.trim()}`;
+  const makeBearer = (s: string) =>
+    `${isAzure || isAnthropic ? "" : "Bearer "}${s.trim()}`;
   const validString = (x: string) => x && x.length > 0;
 
   // when using google api in app, not set auth header
@@ -185,7 +192,7 @@ export function getHeaders() {
       validString(accessStore.accessCode)
     ) {
       // access_code must send with header named `Authorization`, will using in auth middleware.
-      headers['Authorization'] = makeBearer(
+      headers["Authorization"] = makeBearer(
         ACCESS_CODE_PREFIX + accessStore.accessCode,
       );
     }
diff --git a/app/client/platforms/openai.ts b/app/client/platforms/openai.ts
index f3599263023..25097e3baa6 100644
--- a/app/client/platforms/openai.ts
+++ b/app/client/platforms/openai.ts
@@ -1,13 +1,16 @@
 "use client";
+// azure and openai, using same models. so using same LLMApi.
 import {
   ApiPath,
   DEFAULT_API_HOST,
   DEFAULT_MODELS,
   OpenaiPath,
+  Azure,
   REQUEST_TIMEOUT_MS,
   ServiceProvider,
 } from "@/app/constant";
 import { useAccessStore, useAppConfig, useChatStore } from "@/app/store";
+import { collectModelsWithDefaultModel } from "@/app/utils/model";
 
 import {
   ChatOptions,
@@ -97,6 +100,15 @@ export class ChatGPTApi implements LLMApi {
     return [baseUrl, path].join("/");
   }
 
+  getBaseUrl(apiPath: string) {
+    const isApp = !!getClientConfig()?.isApp;
+    let baseUrl = isApp ? DEFAULT_API_HOST + "/proxy" + apiPath : apiPath;
+    if (baseUrl.endsWith("/")) {
+      baseUrl = baseUrl.slice(0, baseUrl.length - 1);
+    }
+    return baseUrl + "/";
+  }
+
   extractMessage(res: any) {
     return res.choices?.at(0)?.message?.content ?? "";
   }
@@ -113,6 +125,7 @@ export class ChatGPTApi implements LLMApi {
       ...useChatStore.getState().currentSession().mask.modelConfig,
       ...{
         model: options.config.model,
+        providerName: options.config.providerName,
       },
     };
 
@@ -140,7 +153,33 @@ export class ChatGPTApi implements LLMApi {
     options.onController?.(controller);
 
     try {
-      const chatPath = this.path(OpenaiPath.ChatPath);
+      let chatPath = "";
+      if (modelConfig.providerName == ServiceProvider.Azure) {
+        // find model, and get displayName as deployName
+        const { models: configModels, customModels: configCustomModels } =
+          useAppConfig.getState();
+        const { defaultModel, customModels: accessCustomModels } =
+          useAccessStore.getState();
+
+        const models = collectModelsWithDefaultModel(
+          configModels,
+          [configCustomModels, accessCustomModels].join(","),
+          defaultModel,
+        );
+        const model = models.find(
+          (model) =>
+            model.name == modelConfig.model &&
+            model?.provider.providerName == ServiceProvider.Azure,
+        );
+        chatPath =
+          this.getBaseUrl(ApiPath.Azure) +
+          Azure.ChatPath(
+            model?.displayName ?? model.name,
+            useAccessStore.getState().azureApiVersion,
+          );
+      } else {
+        chatPath = this.getBaseUrl(ApiPath.OpenAI) + OpenaiPath.ChatPath;
+      }
       const chatPayload = {
         method: "POST",
         body: JSON.stringify(requestPayload),
diff --git a/app/components/chat.tsx b/app/components/chat.tsx
index 06119250465..b1bdf757f44 100644
--- a/app/components/chat.tsx
+++ b/app/components/chat.tsx
@@ -88,6 +88,7 @@ import {
   Path,
   REQUEST_TIMEOUT_MS,
   UNFINISHED_INPUT,
+  ServiceProvider,
 } from "../constant";
 import { Avatar } from "./emoji";
 import { ContextPrompts, MaskAvatar, MaskConfig } from "./mask";
@@ -448,6 +449,9 @@ export function ChatActions(props: {
 
   // switch model
   const currentModel = chatStore.currentSession().mask.modelConfig.model;
+  const currentProviderName =
+    chatStore.currentSession().mask.modelConfig?.providerName ||
+    ServiceProvider.OpenAI;
   const allModels = useAllModels();
   const models = useMemo(() => {
     const filteredModels = allModels.filter((m) => m.available);
@@ -479,13 +483,13 @@ export function ChatActions(props: {
     const isUnavaliableModel = !models.some((m) => m.name === currentModel);
     if (isUnavaliableModel && models.length > 0) {
       // show next model to default model if exist
-      let nextModel: ModelType = (
-        models.find((model) => model.isDefault) || models[0]
-      ).name;
-      chatStore.updateCurrentSession(
-        (session) => (session.mask.modelConfig.model = nextModel),
-      );
-      showToast(nextModel);
+      let nextModel = models.find((model) => model.isDefault) || models[0];
+      chatStore.updateCurrentSession((session) => {
+        session.mask.modelConfig.model = nextModel.name;
+        session.mask.modelConfig.providerName = nextModel?.provider
+          ?.providerName as ServiceProvider;
+      });
+      showToast(nextModel.name);
     }
   }, [chatStore, currentModel, models]);
 
@@ -573,19 +577,26 @@ export function ChatActions(props: {
 
       {showModelSelector && (
         <Selector
-          defaultSelectedValue={currentModel}
+          defaultSelectedValue={`${currentModel}@${currentProviderName}`}
           items={models.map((m) => ({
-            title: m.displayName,
-            value: m.name,
+            title: `${m.displayName}${
+              m?.provider?.providerName
+                ? "(" + m?.provider?.providerName + ")"
+                : ""
+            }`,
+            value: `${m.name}@${m?.provider?.providerName}`,
           }))}
           onClose={() => setShowModelSelector(false)}
           onSelection={(s) => {
             if (s.length === 0) return;
+            const [model, providerName] = s[0].split("@");
             chatStore.updateCurrentSession((session) => {
-              session.mask.modelConfig.model = s[0] as ModelType;
+              session.mask.modelConfig.model = model as ModelType;
+              session.mask.modelConfig.providerName =
+                providerName as ServiceProvider;
               session.mask.syncGlobalConfig = false;
             });
-            showToast(s[0]);
+            showToast(model);
           }}
         />
       )}
diff --git a/app/components/exporter.tsx b/app/components/exporter.tsx
index 20e240d93b0..7281fc2f12d 100644
--- a/app/components/exporter.tsx
+++ b/app/components/exporter.tsx
@@ -36,11 +36,14 @@ import { toBlob, toPng } from "html-to-image";
 import { DEFAULT_MASK_AVATAR } from "../store/mask";
 
 import { prettyObject } from "../utils/format";
-import { EXPORT_MESSAGE_CLASS_NAME, ModelProvider } from "../constant";
+import {
+  EXPORT_MESSAGE_CLASS_NAME,
+  ModelProvider,
+  ServiceProvider,
+} from "../constant";
 import { getClientConfig } from "../config/client";
 import { ClientApi } from "../client/api";
 import { getMessageTextContent } from "../utils";
-import { identifyDefaultClaudeModel } from "../utils/checkers";
 
 const Markdown = dynamic(async () => (await import("./markdown")).Markdown, {
   loading: () => <LoadingIcon />,
@@ -314,9 +317,9 @@ export function PreviewActions(props: {
     setShouldExport(false);
 
     var api: ClientApi;
-    if (config.modelConfig.model.startsWith("gemini")) {
+    if (config.modelConfig.providerName == ServiceProvider.Google) {
       api = new ClientApi(ModelProvider.GeminiPro);
-    } else if (identifyDefaultClaudeModel(config.modelConfig.model)) {
+    } else if (config.modelConfig.providerName == ServiceProvider.Anthropic) {
       api = new ClientApi(ModelProvider.Claude);
     } else {
       api = new ClientApi(ModelProvider.GPT);
diff --git a/app/components/home.tsx b/app/components/home.tsx
index ffac64fdac0..addb5e80373 100644
--- a/app/components/home.tsx
+++ b/app/components/home.tsx
@@ -12,7 +12,7 @@ import LoadingIcon from "../icons/three-dots.svg";
 import { getCSSVar, useMobileScreen } from "../utils";
 
 import dynamic from "next/dynamic";
-import { ModelProvider, Path, SlotID } from "../constant";
+import { ServiceProvider, ModelProvider, Path, SlotID } from "../constant";
 import { ErrorBoundary } from "./error";
 
 import { getISOLang, getLang } from "../locales";
@@ -29,7 +29,6 @@ import { AuthPage } from "./auth";
 import { getClientConfig } from "../config/client";
 import { ClientApi } from "../client/api";
 import { useAccessStore } from "../store";
-import { identifyDefaultClaudeModel } from "../utils/checkers";
 
 export function Loading(props: { noLogo?: boolean }) {
   return (
@@ -172,9 +171,9 @@ export function useLoadData() {
   const config = useAppConfig();
 
   var api: ClientApi;
-  if (config.modelConfig.model.startsWith("gemini")) {
+  if (config.modelConfig.providerName == ServiceProvider.Google) {
     api = new ClientApi(ModelProvider.GeminiPro);
-  } else if (identifyDefaultClaudeModel(config.modelConfig.model)) {
+  } else if (config.modelConfig.providerName == ServiceProvider.Anthropic) {
     api = new ClientApi(ModelProvider.Claude);
   } else {
     api = new ClientApi(ModelProvider.GPT);
diff --git a/app/components/model-config.tsx b/app/components/model-config.tsx
index e46a018f463..346fd3a7129 100644
--- a/app/components/model-config.tsx
+++ b/app/components/model-config.tsx
@@ -1,3 +1,4 @@
+import { ServiceProvider } from "@/app/constant";
 import { ModalConfigValidator, ModelConfig } from "../store";
 
 import Locale from "../locales";
@@ -10,25 +11,25 @@ export function ModelConfigList(props: {
   updateConfig: (updater: (config: ModelConfig) => void) => void;
 }) {
   const allModels = useAllModels();
+  const value = `${props.modelConfig.model}@${props.modelConfig?.providerName}`;
 
   return (
     <>
       <ListItem title={Locale.Settings.Model}>
         <Select
-          value={props.modelConfig.model}
+          value={value}
           onChange={(e) => {
-            props.updateConfig(
-              (config) =>
-                (config.model = ModalConfigValidator.model(
-                  e.currentTarget.value,
-                )),
-            );
+            const [model, providerName] = e.currentTarget.value.split("@");
+            props.updateConfig((config) => {
+              config.model = ModalConfigValidator.model(model);
+              config.providerName = providerName as ServiceProvider;
+            });
           }}
         >
           {allModels
             .filter((v) => v.available)
             .map((v, i) => (
-              <option value={v.name} key={i}>
+              <option value={`${v.name}@${v.provider?.providerName}`} key={i}>
                 {v.displayName}({v.provider?.providerName})
               </option>
             ))}
@@ -92,7 +93,7 @@ export function ModelConfigList(props: {
         ></input>
       </ListItem>
 
-      {props.modelConfig.model.startsWith("gemini") ? null : (
+      {props.modelConfig?.providerName == ServiceProvider.Google ? null : (
         <>
           <ListItem
             title={Locale.Settings.PresencePenalty.Title}
diff --git a/app/constant.ts b/app/constant.ts
index 1ccb1aeb272..cabb5675ece 100644
--- a/app/constant.ts
+++ b/app/constant.ts
@@ -25,6 +25,7 @@ export enum Path {
 
 export enum ApiPath {
   Cors = "",
+  Azure = "/api/azure",
   OpenAI = "/api/openai",
   Anthropic = "/api/anthropic",
 }
@@ -93,6 +94,8 @@ export const OpenaiPath = {
 };
 
 export const Azure = {
+  ChatPath: (deployName: string, apiVersion: string) =>
+    `deployments/${deployName}/chat/completions?api-version=${apiVersion}`,
   ExampleEndpoint: "https://{resource-url}/openai/deployments/{deploy-id}",
 };
 
@@ -179,6 +182,15 @@ export const DEFAULT_MODELS = [
       providerType: "openai",
     },
   })),
+  ...openaiModels.map((name) => ({
+    name,
+    available: true,
+    provider: {
+      id: "azure",
+      providerName: "Azure",
+      providerType: "azure",
+    },
+  })),
   ...googleModels.map((name) => ({
     name,
     available: true,
diff --git a/app/store/access.ts b/app/store/access.ts
index 64909609e05..03780779e72 100644
--- a/app/store/access.ts
+++ b/app/store/access.ts
@@ -17,6 +17,11 @@ const DEFAULT_OPENAI_URL =
     ? DEFAULT_API_HOST + "/api/proxy/openai"
     : ApiPath.OpenAI;
 
+const DEFAULT_AZURE_URL =
+  getClientConfig()?.buildMode === "export"
+    ? DEFAULT_API_HOST + "/api/proxy/azure/{resource_name}"
+    : ApiPath.Azure;
+
 const DEFAULT_ACCESS_STATE = {
   accessCode: "",
   useCustomConfig: false,
@@ -28,7 +33,7 @@ const DEFAULT_ACCESS_STATE = {
   openaiApiKey: "",
 
   // azure
-  azureUrl: "",
+  azureUrl: DEFAULT_AZURE_URL,
   azureApiKey: "",
   azureApiVersion: "2023-08-01-preview",
 
diff --git a/app/store/chat.ts b/app/store/chat.ts
index 27a7114a3b5..44d41830a63 100644
--- a/app/store/chat.ts
+++ b/app/store/chat.ts
@@ -9,6 +9,7 @@ import {
   DEFAULT_MODELS,
   DEFAULT_SYSTEM_TEMPLATE,
   KnowledgeCutOffDate,
+  ServiceProvider,
   ModelProvider,
   StoreKey,
   SUMMARIZE_MODEL,
@@ -20,7 +21,6 @@ import { prettyObject } from "../utils/format";
 import { estimateTokenLength } from "../utils/token";
 import { nanoid } from "nanoid";
 import { createPersistStore } from "../utils/store";
-import { identifyDefaultClaudeModel } from "../utils/checkers";
 import { collectModelsWithDefaultModel } from "../utils/model";
 import { useAccessStore } from "./access";
 
@@ -364,9 +364,9 @@ export const useChatStore = createPersistStore(
         });
 
         var api: ClientApi;
-        if (modelConfig.model.startsWith("gemini")) {
+        if (modelConfig.providerName == ServiceProvider.Google) {
           api = new ClientApi(ModelProvider.GeminiPro);
-        } else if (identifyDefaultClaudeModel(modelConfig.model)) {
+        } else if (modelConfig.providerName == ServiceProvider.Anthropic) {
           api = new ClientApi(ModelProvider.Claude);
         } else {
           api = new ClientApi(ModelProvider.GPT);
@@ -548,9 +548,9 @@ export const useChatStore = createPersistStore(
         const modelConfig = session.mask.modelConfig;
 
         var api: ClientApi;
-        if (modelConfig.model.startsWith("gemini")) {
+        if (modelConfig.providerName == ServiceProvider.Google) {
           api = new ClientApi(ModelProvider.GeminiPro);
-        } else if (identifyDefaultClaudeModel(modelConfig.model)) {
+        } else if (modelConfig.providerName == ServiceProvider.Anthropic) {
           api = new ClientApi(ModelProvider.Claude);
         } else {
           api = new ClientApi(ModelProvider.GPT);
diff --git a/app/store/config.ts b/app/store/config.ts
index 0e7f43ee6a6..4b0a34f4f08 100644
--- a/app/store/config.ts
+++ b/app/store/config.ts
@@ -5,6 +5,7 @@ import {
   DEFAULT_MODELS,
   DEFAULT_SIDEBAR_WIDTH,
   StoreKey,
+  ServiceProvider,
 } from "../constant";
 import { createPersistStore } from "../utils/store";
 
@@ -48,6 +49,7 @@ export const DEFAULT_CONFIG = {
 
   modelConfig: {
     model: "gpt-3.5-turbo" as ModelType,
+    providerName: "Openai" as ServiceProvider,
     temperature: 0.5,
     top_p: 1,
     max_tokens: 4000,
diff --git a/app/utils/checkers.ts b/app/utils/checkers.ts
deleted file mode 100644
index 4496e1039fc..00000000000
--- a/app/utils/checkers.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import { useAccessStore } from "../store/access";
-import { useAppConfig } from "../store/config";
-import { collectModels } from "./model";
-
-export function identifyDefaultClaudeModel(modelName: string) {
-  const accessStore = useAccessStore.getState();
-  const configStore = useAppConfig.getState();
-
-  const allModals = collectModels(
-    configStore.models,
-    [configStore.customModels, accessStore.customModels].join(","),
-  );
-
-  const modelMeta = allModals.find((m) => m.name === modelName);
-
-  return (
-    modelName.startsWith("claude") &&
-    modelMeta &&
-    modelMeta.provider?.providerType === "anthropic"
-  );
-}
diff --git a/app/utils/hooks.ts b/app/utils/hooks.ts
index 55d5d4fca7d..f7f1385e07e 100644
--- a/app/utils/hooks.ts
+++ b/app/utils/hooks.ts
@@ -11,7 +11,12 @@ export function useAllModels() {
       [configStore.customModels, accessStore.customModels].join(","),
       accessStore.defaultModel,
     );
-  }, [accessStore.customModels, configStore.customModels, configStore.models]);
+  }, [
+    accessStore.customModels,
+    accessStore.defaultModel,
+    configStore.customModels,
+    configStore.models,
+  ]);
 
   return models;
 }
diff --git a/next.config.mjs b/next.config.mjs
index daaeba46865..27c60dd2997 100644
--- a/next.config.mjs
+++ b/next.config.mjs
@@ -69,6 +69,11 @@ if (mode !== "export") {
         source: "/api/proxy/v1/:path*",
         destination: "https://api.openai.com/v1/:path*",
       },
+      {
+        // https://{resource_name}.openai.azure.com/openai/deployments/{deploy_name}/chat/completions
+        source: "/api/proxy/azure/:resource_name/deployments/:deploy_name/:path*",
+        destination: "https://:resource_name.openai.azure.com/openai/deployments/:deploy_name/:path*",
+      },
       {
         source: "/api/proxy/google/:path*",
         destination: "https://generativelanguage.googleapis.com/:path*",

From 6b1b530443c3a3405cd07c73f8ee9d723163a285 Mon Sep 17 00:00:00 2001
From: lloydzhou <lloydzhou@qq.com>
Date: Fri, 5 Jul 2024 20:15:56 +0800
Subject: [PATCH 2/6] remove makeAzurePath

---
 app/api/common.ts              |  1 -
 app/azure.ts                   |  9 ---------
 app/client/platforms/openai.ts | 36 ++++++++++++----------------------
 3 files changed, 12 insertions(+), 34 deletions(-)
 delete mode 100644 app/azure.ts

diff --git a/app/api/common.ts b/app/api/common.ts
index 17b5f916533..9149cc6c9e7 100644
--- a/app/api/common.ts
+++ b/app/api/common.ts
@@ -7,7 +7,6 @@ import {
   ServiceProvider,
 } from "../constant";
 import { isModelAvailableInServer } from "../utils/model";
-import { makeAzurePath } from "../azure";
 
 const serverConfig = getServerSideConfig();
 
diff --git a/app/azure.ts b/app/azure.ts
deleted file mode 100644
index 48406c55ba5..00000000000
--- a/app/azure.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-export function makeAzurePath(path: string, apiVersion: string) {
-  // should omit /v1 prefix
-  path = path.replaceAll("v1/", "");
-
-  // should add api-key to query string
-  path += `${path.includes("?") ? "&" : "?"}api-version=${apiVersion}`;
-
-  return path;
-}
diff --git a/app/client/platforms/openai.ts b/app/client/platforms/openai.ts
index 25097e3baa6..56063d6f064 100644
--- a/app/client/platforms/openai.ts
+++ b/app/client/platforms/openai.ts
@@ -27,7 +27,6 @@ import {
 } from "@fortaine/fetch-event-source";
 import { prettyObject } from "@/app/utils/format";
 import { getClientConfig } from "@/app/config/client";
-import { makeAzurePath } from "@/app/azure";
 import {
   getMessageTextContent,
   getMessageImages,
@@ -65,33 +64,31 @@ export class ChatGPTApi implements LLMApi {
 
     let baseUrl = "";
 
+    const isAzure = path.includes("deployments");
     if (accessStore.useCustomConfig) {
-      const isAzure = accessStore.provider === ServiceProvider.Azure;
-
       if (isAzure && !accessStore.isValidAzure()) {
         throw Error(
           "incomplete azure config, please check it in your settings page",
         );
       }
 
-      if (isAzure) {
-        path = makeAzurePath(path, accessStore.azureApiVersion);
-      }
-
       baseUrl = isAzure ? accessStore.azureUrl : accessStore.openaiUrl;
     }
 
     if (baseUrl.length === 0) {
       const isApp = !!getClientConfig()?.isApp;
-      baseUrl = isApp
-        ? DEFAULT_API_HOST + "/proxy" + ApiPath.OpenAI
-        : ApiPath.OpenAI;
+      const apiPath = isAzure ? ApiPath.Azure : ApiPath.OpenAI;
+      baseUrl = isApp ? DEFAULT_API_HOST + "/proxy" + apiPath : apiPath;
     }
 
     if (baseUrl.endsWith("/")) {
       baseUrl = baseUrl.slice(0, baseUrl.length - 1);
     }
-    if (!baseUrl.startsWith("http") && !baseUrl.startsWith(ApiPath.OpenAI)) {
+    if (
+      !baseUrl.startsWith("http") &&
+      !isAzure &&
+      !baseUrl.startsWith(ApiPath.OpenAI)
+    ) {
       baseUrl = "https://" + baseUrl;
     }
 
@@ -100,15 +97,6 @@ export class ChatGPTApi implements LLMApi {
     return [baseUrl, path].join("/");
   }
 
-  getBaseUrl(apiPath: string) {
-    const isApp = !!getClientConfig()?.isApp;
-    let baseUrl = isApp ? DEFAULT_API_HOST + "/proxy" + apiPath : apiPath;
-    if (baseUrl.endsWith("/")) {
-      baseUrl = baseUrl.slice(0, baseUrl.length - 1);
-    }
-    return baseUrl + "/";
-  }
-
   extractMessage(res: any) {
     return res.choices?.at(0)?.message?.content ?? "";
   }
@@ -171,14 +159,14 @@ export class ChatGPTApi implements LLMApi {
             model.name == modelConfig.model &&
             model?.provider.providerName == ServiceProvider.Azure,
         );
-        chatPath =
-          this.getBaseUrl(ApiPath.Azure) +
+        chatPath = this.path(
           Azure.ChatPath(
             model?.displayName ?? model.name,
             useAccessStore.getState().azureApiVersion,
-          );
+          ),
+        );
       } else {
-        chatPath = this.getBaseUrl(ApiPath.OpenAI) + OpenaiPath.ChatPath;
+        chatPath = this.path(OpenaiPath.ChatPath);
       }
       const chatPayload = {
         method: "POST",

From d9758be3ae05974a3acf7790a16cf877066c9016 Mon Sep 17 00:00:00 2001
From: lloydzhou <lloydzhou@qq.com>
Date: Fri, 5 Jul 2024 20:20:21 +0800
Subject: [PATCH 3/6] fix ts

---
 app/api/common.ts              | 2 +-
 app/client/platforms/openai.ts | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/app/api/common.ts b/app/api/common.ts
index 9149cc6c9e7..d7f6d63ce58 100644
--- a/app/api/common.ts
+++ b/app/api/common.ts
@@ -59,7 +59,7 @@ export async function requestOpenai(req: NextRequest) {
 
   if (isAzure) {
     const azureApiVersion = req?.nextUrl?.searchParams?.get("api-version");
-    baseUrl = baseUrl.split("/deployments").shift();
+    baseUrl = baseUrl.split("/deployments").shift() as string;
     path = `${req.nextUrl.pathname.replaceAll(
       "/api/azure/",
       "",
diff --git a/app/client/platforms/openai.ts b/app/client/platforms/openai.ts
index 56063d6f064..c9c834b6691 100644
--- a/app/client/platforms/openai.ts
+++ b/app/client/platforms/openai.ts
@@ -157,11 +157,11 @@ export class ChatGPTApi implements LLMApi {
         const model = models.find(
           (model) =>
             model.name == modelConfig.model &&
-            model?.provider.providerName == ServiceProvider.Azure,
+            model?.provider?.providerName == ServiceProvider.Azure,
         );
         chatPath = this.path(
           Azure.ChatPath(
-            model?.displayName ?? model.name,
+            (model?.displayName ?? model?.name) as string,
             useAccessStore.getState().azureApiVersion,
           ),
         );

From 183ad2a34bb7c126997da6163f79025468ebe3d2 Mon Sep 17 00:00:00 2001
From: lloydzhou <lloydzhou@qq.com>
Date: Fri, 5 Jul 2024 20:57:55 +0800
Subject: [PATCH 4/6] add missing file

---
 app/api/azure/[...path]/route.ts | 57 ++++++++++++++++++++++++++++++++
 1 file changed, 57 insertions(+)
 create mode 100644 app/api/azure/[...path]/route.ts

diff --git a/app/api/azure/[...path]/route.ts b/app/api/azure/[...path]/route.ts
new file mode 100644
index 00000000000..4a17de0c8ab
--- /dev/null
+++ b/app/api/azure/[...path]/route.ts
@@ -0,0 +1,57 @@
+import { getServerSideConfig } from "@/app/config/server";
+import { ModelProvider } from "@/app/constant";
+import { prettyObject } from "@/app/utils/format";
+import { NextRequest, NextResponse } from "next/server";
+import { auth } from "../../auth";
+import { requestOpenai } from "../../common";
+
+async function handle(
+  req: NextRequest,
+  { params }: { params: { path: string[] } },
+) {
+  console.log("[Azure Route] params ", params);
+
+  if (req.method === "OPTIONS") {
+    return NextResponse.json({ body: "OK" }, { status: 200 });
+  }
+
+  const subpath = params.path.join("/");
+
+  const authResult = auth(req, ModelProvider.GPT);
+  if (authResult.error) {
+    return NextResponse.json(authResult, {
+      status: 401,
+    });
+  }
+
+  try {
+    return await requestOpenai(req);
+  } catch (e) {
+    console.error("[Azure] ", e);
+    return NextResponse.json(prettyObject(e));
+  }
+}
+
+export const GET = handle;
+export const POST = handle;
+
+export const runtime = "edge";
+export const preferredRegion = [
+  "arn1",
+  "bom1",
+  "cdg1",
+  "cle1",
+  "cpt1",
+  "dub1",
+  "fra1",
+  "gru1",
+  "hnd1",
+  "iad1",
+  "icn1",
+  "kix1",
+  "lhr1",
+  "pdx1",
+  "sfo1",
+  "sin1",
+  "syd1",
+];

From 14bc1b6aac6a797a5b55d442f582c6c9d21d9a0f Mon Sep 17 00:00:00 2001
From: Dogtiti <499960698@qq.com>
Date: Fri, 5 Jul 2024 23:56:10 +0800
Subject: [PATCH 5/6] chore: optimize the code

---
 app/client/api.ts              | 2 +-
 app/client/platforms/openai.ts | 7 +++----
 app/constant.ts                | 1 +
 3 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/app/client/api.ts b/app/client/api.ts
index 896880fa3f6..41ccbd8e1c0 100644
--- a/app/client/api.ts
+++ b/app/client/api.ts
@@ -162,7 +162,7 @@ export function getHeaders() {
     Accept: "application/json",
   };
   const modelConfig = useChatStore.getState().currentSession().mask.modelConfig;
-  const isGoogle = modelConfig.providerName == ServiceProvider.Azure;
+  const isGoogle = modelConfig.providerName == ServiceProvider.Google;
   const isAzure = modelConfig.providerName === ServiceProvider.Azure;
   const isAnthropic = modelConfig.providerName === ServiceProvider.Anthropic;
   const authHeader = isAzure
diff --git a/app/client/platforms/openai.ts b/app/client/platforms/openai.ts
index c9c834b6691..7cd5ecbbca0 100644
--- a/app/client/platforms/openai.ts
+++ b/app/client/platforms/openai.ts
@@ -142,13 +142,12 @@ export class ChatGPTApi implements LLMApi {
 
     try {
       let chatPath = "";
-      if (modelConfig.providerName == ServiceProvider.Azure) {
+      if (modelConfig.providerName === ServiceProvider.Azure) {
         // find model, and get displayName as deployName
         const { models: configModels, customModels: configCustomModels } =
           useAppConfig.getState();
         const { defaultModel, customModels: accessCustomModels } =
           useAccessStore.getState();
-
         const models = collectModelsWithDefaultModel(
           configModels,
           [configCustomModels, accessCustomModels].join(","),
@@ -156,8 +155,8 @@ export class ChatGPTApi implements LLMApi {
         );
         const model = models.find(
           (model) =>
-            model.name == modelConfig.model &&
-            model?.provider?.providerName == ServiceProvider.Azure,
+            model.name === modelConfig.model &&
+            model?.provider?.providerName === ServiceProvider.Azure,
         );
         chatPath = this.path(
           Azure.ChatPath(
diff --git a/app/constant.ts b/app/constant.ts
index cabb5675ece..d44b5b8173b 100644
--- a/app/constant.ts
+++ b/app/constant.ts
@@ -153,6 +153,7 @@ const openaiModels = [
   "gpt-4o-2024-05-13",
   "gpt-4-vision-preview",
   "gpt-4-turbo-2024-04-09",
+  "gpt-4-1106-preview",
 ];
 
 const googleModels = [

From 6dc4844c12d2cdce7df5a40e4e03e15595ae383e Mon Sep 17 00:00:00 2001
From: lloydzhou <lloydzhou@qq.com>
Date: Sat, 6 Jul 2024 00:05:59 +0800
Subject: [PATCH 6/6] using default azure api-version value

---
 app/api/common.ts              | 4 +++-
 app/client/platforms/openai.ts | 9 ++++++---
 2 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/app/api/common.ts b/app/api/common.ts
index d7f6d63ce58..b2fae6df24f 100644
--- a/app/api/common.ts
+++ b/app/api/common.ts
@@ -58,7 +58,9 @@ export async function requestOpenai(req: NextRequest) {
   );
 
   if (isAzure) {
-    const azureApiVersion = req?.nextUrl?.searchParams?.get("api-version");
+    const azureApiVersion =
+      req?.nextUrl?.searchParams?.get("api-version") ||
+      serverConfig.azureApiVersion;
     baseUrl = baseUrl.split("/deployments").shift() as string;
     path = `${req.nextUrl.pathname.replaceAll(
       "/api/azure/",
diff --git a/app/client/platforms/openai.ts b/app/client/platforms/openai.ts
index 7cd5ecbbca0..8615172a311 100644
--- a/app/client/platforms/openai.ts
+++ b/app/client/platforms/openai.ts
@@ -146,8 +146,11 @@ export class ChatGPTApi implements LLMApi {
         // find model, and get displayName as deployName
         const { models: configModels, customModels: configCustomModels } =
           useAppConfig.getState();
-        const { defaultModel, customModels: accessCustomModels } =
-          useAccessStore.getState();
+        const {
+          defaultModel,
+          customModels: accessCustomModels,
+          useCustomConfig,
+        } = useAccessStore.getState();
         const models = collectModelsWithDefaultModel(
           configModels,
           [configCustomModels, accessCustomModels].join(","),
@@ -161,7 +164,7 @@ export class ChatGPTApi implements LLMApi {
         chatPath = this.path(
           Azure.ChatPath(
             (model?.displayName ?? model?.name) as string,
-            useAccessStore.getState().azureApiVersion,
+            useCustomConfig ? useAccessStore.getState().azureApiVersion : "",
           ),
         );
       } else {