How to Connect Hyperstack AI Studio to LobeChat for Advanced AI Chatbots

What is LobeChat and why use it?

What is LobeChat?

LobeChat is an extensible chat platform (open-source components under LobeHub) designed to host conversational AI agents, plugins, and user artifacts.

It supports multiple LLM backends, local LLMs, file attachments and knowledge bases, branching conversations, agent-style workflows, TTS/STT, vision models, and more. LobeChat positions itself as a product-focused chat layer that can integrate many model providers and on-prem/self-hosted setups.

Why use LobeChat?

• Multi-provider support: LobeChat’s architecture lets you connect many model providers or local models, so you can swap or mix models without changing the UI.
• Product-ready features: It includes conversation branching, artifacts (files, knowledge bases), plugin/agent systems, and multi-user organization useful for building internal chat assistants, customer-support tools, or product-facing bots.
• Self-hosting friendly: LobeChat provides Docker-based deployment and environment variables to configure providers, authentication and access codes, enabling secure internal deployments.
• Extendable: Plugin and agent systems allow adding custom tool-calls, RAG (retrieval-augmented generation) flows, and domain-specific integrations.

Overall, LobeChat acts as the front-end product layer, the interface, user-management, and workflow runner while leaving model inference to backends you choose.

Why use Hyperstack AI Studio for LobeChat

Hyperstack AI Studio is a full-stack model development and hosting environment geared toward deploying and managing LLMs at scale. It offers model cataloging, fine-tuning, evaluation/benchmarks, playground/testing, and OpenAI-compatible inference endpoints all of which match the needs of production chat platforms like LobeChat.

Let's quickly summarize why Hyperstack is a great fit for LobeChat:

• OpenAI-compatible endpoints: Hyperstack exposes OpenAI-like API endpoints so products that speak the OpenAI schema (like LobeChat) can integrate with minimal changes.
• Multiple model sizes & catalog: Choose from lightweight to large models (Llama variants, Mistral, GPT-like OSS) depending on latency/cost/performance tradeoffs.
• Fine-tuning & model customization: You can fine-tune models on domain data and then use those custom models directly from Hyperstack for more accurate, aligned responses in LobeChat.
• Evaluation & benchmarking: Built-in evaluation tools let you test fine-tuned model variants and compare metrics (accuracy, latency) before switching a production assistant.
• Playground for testing: Interactive playgrounds let non-engineers validate model behavior before rolling to end users.
• Cost/infra benefits: Hyperstack is designed to provide GPU-backed inference with managed infrastructure, which can be cost-efficient compared to running and managing self-hosted GPU clusters.

In short we can say that Hyperstack provides model training, hosting, and evaluation, while LobeChat provides the user experience and workflow layer. This separation keeps responsibilities clear and lets teams iterate on models independently from UI/UX.

Connecting Hyperstack AI Studio with LobeChat

LobeChat can connect to any OpenAI-compatible endpoint, so integrating with Hyperstack is straightforward. There are many ways to deploy LobeChat (Docker, local, cloud), but we will focus on the Docker method here since it is the most common for self-hosted setups.

1. Retrieve Hyperstack API Details

Before we perform the installation steps of Lobe Chat using Docker, we have to get some info that later we will be using to configure our Hyperstack LLM with lobeChat like base url, model id, api key and so on.

1. Go to the Hyperstack Console and log in with your credentials.
2. Navigate to the AI Studio Playground to explore available models before integration them with Lobe Chat.

In the playground, Select your desired model after quick testing it on the interface. We are going with llama-3.1-8b-instruct for this integration.

Then click on the API section to get the Base URL and Model ID.

You can check the available models on their base model documentation page. You can copy the model id and base url from here, we will need it in the next step.

2. Generating an API Key

To authenticate, we will need a valid API key from Hyperstack AI Studio.

1. Go to the API Keys section in the Hyperstack console.

2. Click Generate New Key.

3. Give it a name (e.g., LobeChat-integration-key).

4. Copy the generated key, we will use it in LobeChat module.

Now that we have the required details for LobeChat, let's now use them.

3. Run LobeChat via Docker with Hyperstack configuration

Make sure you have Docker downloaded and set up files for the LobeChat proxy:

You can download the Docker Desktop application for your operating system.

Once the docker is installed in your machine you can now move to the next step which is to install lobe chat through docker.

Here are two ways to run LobeChat using docker run.

1. The first method passes all configuration via environment variables at container start.
2. The second runs the container with only an access code and allows configuration later via the LobeChat UI.

Option A: Run LobeChat with Specific Configuration

To run LobeChat with Hyperstack configuration baked in, we can specifiy the necessary environment variables in the docker run command like the base url, api key and model name that we get earlier from hyperstack.

# Run LobeChat in detached mode, expose port 3210 and inject env vars for Hyperstack
docker run -d -p 3210:3210 \
  -e OPENAI_API_KEY=sk-xxxx \                       # Hyperstack API key (place your key here)
  -e OPENAI_PROXY_URL=https://api-proxy.com/v1 \    # Optional: proxy URL to route OpenAI-like calls (if required)
  -e ACCESS_CODE=lobe66 \                           # Access code to restrict UI access
  -e OPENAI_MODEL_LIST=-meta-llama/Llama-3.1-8B-Instruct \  # Which model(s) to show in LobeChat
  --name lobe-chat \                                # Container name
  lobehub/lobe-chat                                 # Image name

Let's break down the command:

• docker run -d -p 3210:3210 \: Run container in detached mode and map container port 3210 to host 3210.
• -e OPENAI_API_KEY=sk-xxxx \: Provide the backend API key that LobeChat will use for OpenAI-compatible calls (replace with your Hyperstack key).
• -e OPENAI_PROXY_URL=... \: If you must route requests through an API proxy, set its base URL here. (Optional only if you use a proxy.)
• -e ACCESS_CODE=lobe66 \: Sets the access code for the LobeChat UI (simple auth to restrict access).
• -e OPENAI_MODEL_LIST=-meta-llama/Llama-3.1-8B-Instruct \: Controls the model list shown in the UI; this example exposes meta-llama/Llama-3.1-8B-Instruct.
• --name lobe-chat \: Assigns a container name so you can docker stop / docker logs easily.
• lobehub/lobe-chat The official LobeChat Docker image.

Option B: Run LobeChat with Access Code Only, Configure Later

We can also run LobeChat with just the access code and configure the Hyperstack details later from the UI. This is useful if you want to avoid baking secrets into the Docker command.

# Run LobeChat with only an access code, configure Hyperstack credentials later from the UI
docker run -d -p 3210:3210 \
  -e ACCESS_CODE=lobe66 \  # Access code only; other settings can be added via the LobeChat UI
  --name lobe-chat \
  lobehub/lobe-chat

You can see that this command is simpler since it only sets the access code. After starting the container, you can open the LobeChat UI and enter the Hyperstack API key, base URL, and model name in the settings.

• If you prefer docker compose, you can omit all configuration in the docker run and instead set environment variables in docker-compose.yml or configure them via the LobeChat admin UI after the service is up. The LobeChat docs list the full set of supported environment variables.
• Default port is 3210. Make sure that port is free or change host mapping (e.g., -p 3211:3210).

Now that we have our container running, let's move to the next step.

4. Open LobeChat UI and navigate to model settings

We can now open the LobeChat UI in a browser. Open your browser and go to:

http://localhost:3210

You should land on the LobeChat homepage (replace with your screenshot).

If you set an access code, you will be prompted to enter it. Enter the access code you specified in the docker run command (e.g., lobe66).

Access app settings

Now we want to see how we can configure the Hyperstack details in LobeChat. To do this:

1. Click the profile icon (top-right) and then Settings (this UI path may differ slightly by version).
2. Inside Settings, open AI Service Provider section where you can set provider configuration.

5. Configure LobeChat to use Hyperstack (Language Model settings)

In this section click on plus icon add the Hyperstack details:

• API Key: Paste the Hyperstack API key (you said you'll add the API-key retrieval steps yourself).
• Base URL / Endpoint: Set to Hyperstack’s OpenAI-compatible base (for example https://console.hyperstack.cloud/ai/api/v1 or the endpoint provided in your console).
• Model Name: meta-llama/Llama-3.1-8B-Instruct (or whichever model you selected in Hyperstack).

Once fields are filled, We have to test our connection.

6. Test connection and verify responses

Before testing the connection we need to specify the model we want to test in our case it's llama-3-8.1B-instruct.

Click Test Connection. If configuration is correct LobeChat will report a successful connection to the Hyperstack endpoint.

Now go to the main chat interface and confirm the model is selectable (the model name should appear at the top or in the model chooser dropdown). Send a simple prompt and verify the response.

Hi ...

The model will respond with a relevant answer.

This proves LobeChat is successfully invoking the Hyperstack-hosted model via OpenAI-compatible calls.

There are many other features in LobeChat you can explore (plugins, agents, file uploads), but this completes the core integration.

Integration flow: fine-tuning, evaluation and production rollout

When preparing a production chat assistant, follow this recommended flow:

1. Prototype in Hyperstack Playground: test base models interactively and iterate on prompts.
2. Fine-tune models in Hyperstack: train a custom model that encodes domain knowledge or safety constraints. Use Hyperstack’s fine-tuning guides for formatting data and launching jobs.
3. Evaluate / Benchmark: run Hyperstack’s evaluation tools to compare fine-tuned variants across metrics you care about (accuracy, hallucination rate, latency).
4. Deploy export-ready model endpoint: publish the tuned model as an OpenAI-compatible endpoint on Hyperstack.
5. Point LobeChat to the new model endpoint: change the model name in the LobeChat settings and test. This allows blue-green or canary rollouts: keep one model in production while testing another.
6. Monitor & iterate: use Hyperstack usage dashboards and LobeChat logs (and your own APM) to observe latency, token usage, and user-behavior signals.

This workflow separates the model lifecycle (Hyperstack) from the product lifecycle (LobeChat), enabling controlled upgrades and quick rollback if a model variant misbehaves.

Why this architecture (decoupling model platform from UI) matters

• Separation of concerns: Model teams focus on data, tuning, and evaluation; product teams focus on UX, routing and user controls. This reduces blast radius for changes.
• Vendor-agnostic UI: If LobeChat speaks an OpenAI-compatible API, you can swap Hyperstack for any other provider without significant UI changes. This improves resilience and bargaining power.
• Controlled experimentation: The model platform can host many variants and expose them via endpoints. The chat front-end can run A/B tests or canary rollouts by switching endpoint references.
• Security boundary: Keep keys and infra in the model platform; LobeChat can hold just the runtime key or use a proxy, reducing exposure.
• Cost and scale tradeoffs: Use smaller models for high-volume, low-latency tasks and larger models for complex reasoning, switching them in LobeChat model lists based on context.

Conclusion

Connecting Hyperstack AI Studio with LobeChat gives you a robust pattern:

• Hyperstack model lifecycle: training, fine-tuning, evaluating, and hosting OpenAI-compatible endpoints.
• LobeChat product layer: multi-provider chat UI, plugin/agent systems, and easy self-hosting with Docker.

This separation allows teams to iterate safely on models and user experience independently, scale responsibly, and keep infrastructure concerns contained. Use Hyperstack’s playground and evaluation tools during development, then point LobeChat to the selected model endpoint and validate in the UI before rollout.

FAQ

1. Do I need a Hyperstack account?

Yes, sign up at the Hyperstack console and generate an API key for programmatic access. Hyperstack provides a console and API keys for managing endpoints and models.

2. Which model name should I use in LobeChat?

Use the exact model identifier exposed by Hyperstack (for example meta-llama/Llama-3.1-8B-Instruct). Confirm the identifier in the Hyperstack Models or AI Studio console and paste it into LobeChat settings.

3. Can I use fine-tuned models from Hyperstack in LobeChat?

Yes fine-tune on Hyperstack, publish the fine-tuned model as an endpoint, and then configure LobeChat to point to that endpoint. Hyperstack’s fine-tuning and evaluation tools support validating models before production rollout.

4. What if I need to route traffic through a proxy?

Set the OPENAI_PROXY_URL environment variable when running LobeChat (or configure the proxy URL via the UI if available). The proxy will forward OpenAI-compatible calls to Hyperstack (or to any other API gateway).

5. How do I handle secrets (API keys) securely?

Avoid embedding secrets in plain docker run commands for production. Use a secret manager, Docker secrets, or an encrypted environment variable store and restrict access to the host. Ensure your Hyperstack key has the minimum required permissions.

Additional Resources

You can find more information and resources at the following links:

• For generating api keys and managing models, you can go to Hyperstack console.
• To learn more about available models and their details, you can go to Hyperstack Models & Docs.
• For fine-tuning guides and best practices, refer to Hyperstack Fine-Tuning guide.
• To get started with LobeChat, visit the LobeChat product & get started.
• For self-hosting instructions and environment variable details, check out the LobeHub / LobeChat docs (self-hosting & env vars).