How Environment Variables Configure Providers in NextChat: A Complete Guide

NextChat reads all provider-specific settings from process.env at startup through the getServerSideConfig() function in app/config/server.ts, which builds a configuration object containing API keys, endpoints, and boolean flags that downstream API routes use to instantiate the correct LLM client.

The ChatGPTNextWeb/NextChat repository uses a centralized environment-based configuration system to manage multiple LLM providers without code changes. By setting variables in your .env file or hosting platform, you control which providers are active, their API credentials, and endpoint URLs. This approach separates secrets from source code and enables rapid provider switching through simple configuration updates.

The Central Configuration Hub (app/config/server.ts)

The app/config/server.ts file exports getServerSideConfig(), the single source of truth for all provider settings. This function runs once at server startup, reading process.env to construct a plain object containing flags and resolved credentials for every supported LLM provider.

// app/config/server.ts – simplified structure
export const getServerSideConfig = () => {
  const isAzure    = !!process.env.AZURE_URL;
  const isGoogle   = !!process.env.GOOGLE_API_KEY;
  const isAnthropic = !!process.env.ANTHROPIC_API_KEY;
  
  return {
    // OpenAI
    apiKey:      getApiKey(process.env.OPENAI_API_KEY),
    openaiOrgId: process.env.OPENAI_ORG_ID,

    // Azure OpenAI
    isAzure,
    azureUrl:        process.env.AZURE_URL,
    azureApiKey:     getApiKey(process.env.AZURE_API_KEY),
    azureApiVersion: process.env.AZURE_API_VERSION,

    // Google Gemini
    isGoogle,
    googleApiKey: process.env.GOOGLE_API_KEY,
    googleUrl:    process.env.GOOGLE_URL,

    // Anthropic Claude
    isAnthropic,
    anthropicApiKey:      getApiKey(process.env.ANTHROPIC_API_KEY),
    anthropicApiVersion:  process.env.ANTHROPIC_API_VERSION,
    anthropicUrl:         process.env.ANTHROPIC_URL,
    
    // Additional providers: Baidu, ByteDance, Alibaba, Tencent, Moonshot, 
    // iFlytek, DeepSeek, XAI, ChatGLM, SiliconFlow, 302.AI, Stability, etc.
  };
};

The helper function getApiKey handles comma-separated key lists by selecting one at random, enabling built-in load balancing across multiple credentials.

Supported Providers and Their Environment Variables

NextChat supports 15+ providers through dedicated environment variables defined in .env.template. Each provider requires specific variables to activate and authenticate:

  • OpenAI: OPENAI_API_KEY (required), OPENAI_ORG_ID (optional)
  • Azure OpenAI: AZURE_URL, AZURE_API_KEY, AZURE_API_VERSION
  • Google Gemini: GOOGLE_API_KEY, GOOGLE_URL (optional custom endpoint)
  • Anthropic Claude: ANTHROPIC_API_KEY, ANTHROPIC_VERSION, ANTHROPIC_URL
  • Baidu: BAIDU_API_KEY, BAIDU_SECRET_KEY, BAIDU_URL
  • Alibaba: ALIBABA_API_KEY, ALIBABA_URL
  • Tencent: TENCENT_API_KEY, TENCENT_URL
  • ByteDance: BYTEDANCE_API_KEY, BYTEDANCE_URL
  • Moonshot: MOONSHOT_API_KEY, MOONSHOT_URL
  • DeepSeek: DEEPSEEK_API_KEY, DEEPSEEK_URL
  • XAI (Grok): XAI_API_KEY, XAI_URL
  • SiliconFlow: SILICONFLOW_API_KEY, SILICONFLOW_URL

Boolean flags like isAzure or isGoogle are derived from the presence of these variables, determining which provider implementations load at runtime.

Runtime Configuration Flow

The environment variable resolution follows a strict four-step lifecycle:

  1. Server Initialization: getServerSideConfig() executes once, parsing process.env and caching the resulting configuration object.
  2. Provider Detection: Boolean flags (e.g., isAzure, isGoogle) signal which providers are active based on variable presence.
  3. Request Routing: API routes like app/api/openai.ts import the cached config and instantiate the appropriate client using the resolved keys and URLs.
  4. Client Hydration: The same configuration propagates to the browser via app/config/client.ts, enabling UI components to display available providers.

Each provider module follows this pattern to consume the shared configuration:

// app/api/openai.ts
import { getServerSideConfig } from "@/app/config/server";

const config = getServerSideConfig();

export async function POST(req: Request) {
  const body = await req.json();

  const client = new OpenAI({
    baseURL: config.isAzure ? config.azureUrl : config.baseUrl,
    apiKey:  config.isAzure ? config.azureApiKey : config.apiKey,
    organization: config.openaiOrgId,
  });

  return client.chat.completions.create(body);
}

Practical Configuration Examples

Minimal OpenAI and Google Setup

Enable basic functionality with two providers by creating a .env file:

OPENAI_API_KEY=sk-your-openai-key
GOOGLE_API_KEY=your-google-gemini-key
GOOGLE_URL=https://generativelanguage.googleapis.com/

Azure OpenAI Configuration

Switch the OpenAI route to use Azure endpoints by setting Azure-specific variables:

AZURE_URL=https://my-resource.openai.azure.com/openai/deployments/gpt-4
AZURE_API_KEY=your-azure-key
AZURE_API_VERSION=2024-02-01

When AZURE_URL is present, isAzure becomes true and app/api/openai.ts automatically routes requests to the Azure endpoint instead of the standard OpenAI API.

Load Balancing with Multiple Keys

Provide comma-separated keys for random rotation across multiple accounts:

OPENAI_API_KEY=sk-key-1,sk-key-2,sk-key-3

The getApiKey utility selects one key randomly per request, distributing load across credentials without additional infrastructure.

Accessing Configuration on the Client Side

Expose provider availability to the UI using the client configuration helper:

import { getClientConfig } from '@/app/config/client';

export default function ProviderInfo() {
  const cfg = getClientConfig();
  
  return (
    <ul>
      <li>OpenAI: {cfg.apiKey ? '✅' : '❌'}</li>
      <li>Azure: {cfg.isAzure ? '✅' : '❌'}</li>
      <li>Google: {cfg.isGoogle ? '✅' : '❌'}</li>
    </ul>
  );
}

The client receives the same boolean flags computed server-side, ensuring the UI accurately reflects backend capabilities.

Summary

  • Centralized Configuration: The getServerSideConfig() function in app/config/server.ts aggregates all provider settings from process.env into a single object consumed throughout the application.
  • Boolean Provider Flags: Variables like isAzure, isGoogle, and isAnthropic are derived from environment variable presence, determining which LLM clients instantiate at runtime.
  • Multi-Key Support: The getApiKey helper enables comma-separated API keys for built-in load balancing and redundancy.
  • Template Reference: .env.template contains the complete inventory of supported variables for all 15+ providers including OpenAI, Azure, Google, Anthropic, and regional services like Baidu and Moonshot.
  • Isomorphic Config: Server-side configuration propagates to the client via app/config/client.ts, keeping the UI synchronized with backend provider availability.

Frequently Asked Questions

What is the difference between server and client configuration in NextChat?

The server configuration in app/config/server.ts contains sensitive data like API keys and endpoint URLs, while app/config/client.ts exposes only non-sensitive boolean flags (e.g., isAzure, isGoogle) to the browser. This separation ensures secrets never leak to the client while allowing the UI to show which providers are available.

How does NextChat handle multiple API keys for the same provider?

When you provide comma-separated values in an environment variable like OPENAI_API_KEY=key1,key2,key3, the internal getApiKey function randomly selects one key for each request. This implements client-side load balancing across multiple accounts or rate limits without requiring a separate proxy.

Can I use custom base URLs for providers other than Azure?

Yes. Most providers support an optional *_URL variable (e.g., GOOGLE_URL, ANTHROPIC_URL, DEEPSEEK_URL) that overrides the default endpoint. This enables compatibility with proxy services, private deployments, or regional API gateways while maintaining the same authentication logic.

Where do I find the complete list of supported environment variables?

The repository maintains a comprehensive reference in .env.template at the root level. This file documents every supported variable across all providers including optional parameters like OPENAI_ORG_ID, version strings for Azure and Anthropic, and region-specific keys for Baidu, ByteDance, and Alibaba services.

Have a question about this repo?

These articles cover the highlights, but your codebase questions are specific. Give your agent direct access to the source. Share this with your agent to get started:

Share the following with your agent to get started:
curl -s "https://instagit.com/install.md"

Works with
Claude Codex Cursor VS Code OpenClaw Any MCP Client

Maintain an open-source project? Get it listed too →