How to Integrate OneHop AI Gateway with Cline in VS Code
AI coding agents have become an important part of modern software development. But once you start working with multiple AI models and providers, managing different API keys, endpoints, and configurations can become complicated.
OneHop AI Gateway provides a unified API gateway that can expose supported models through an OpenAI-compatible API interface.
That means you can configure tools such as Cline to communicate with OneHop through a single endpoint.
In this tutorial, we will build the following setup:
Visual Studio Code
|
v
Cline
|
v
OneHop AI Gateway
|
v
Selected Model
By the end of this guide, you will have Cline configured to use OneHop as its AI model gateway.
Note: Model names and availability can change. The model IDs shown in this tutorial are examples and should be verified against the models currently available in your OneHop account.
What You Need
Before starting, make sure you have:
Visual Studio Code installed
An active OneHop account
Permission to create API keys in OneHop
The Cline VS Code extension
A supported OneHop model
Part 1: Install Cline in Visual Studio Code
Step 1: Open the Extensions Marketplace
Start Visual Studio Code.
Open the Extensions panel with:
Ctrl + Shift + X
On macOS:
Cmd + Shift + X
Search for:
CLINE
Look for the official Cline extension published by Autonomous Coding Agent.
Step 2: Install Cline
Open the official Cline extension page.
Click:
Install
After installation, VS Code should show that the extension is installed.
Step 3: Verify the Extension
Open the Cline extension details page.
Verify that:
Cline is installed
VS Code recognizes the extension
Auto Update is enabled if you want automatic updates
Step 4: Open the Cline Panel
After installation, look at the Activity Bar on the left side of VS Code.
Click the Cline robot icon.
The Cline interface should open.
At this point, the Cline extension is ready.
Next, we need a OneHop API key.
Part 2: Create a OneHop API Key
Step 5: Open the OneHop Dashboard
Log in to your OneHop account.
Open the:
API Keys
section.
Click:
Create key
Choose a recognizable name for the key.
For example:
Default key
Create the key.
Step 6: Copy the API Key
After creating the key, copy the secret value.
An API key may look similar to:
oh_live_0KGX...xIj6
The value above is only an example.
Never publish your real API key.
Store the API key securely.
Treat it like a password.
Security Warning
Never publish your real API key in:
GitHub repositories
DEV.to articles
Screenshots
Screen recordings
Public issues
Source code
Frontend applications
For example, never do this:
const apiKey = "oh_live_REAL_SECRET";
Instead, use an appropriate secret-management mechanism or environment-variable strategy for your application.
Part 3: Configure OneHop in Cline
Now we can connect Cline to OneHop.
Step 7: Open Cline Settings
Return to Visual Studio Code.
Open the Cline panel.
Click the Settings gear icon.
Find:
API Provider
Select:
OpenAI Compatible
This tells Cline to communicate with the configured service using an OpenAI-compatible API interface.
Step 8: Configure the OneHop Endpoint
Enter the following configuration.
Setting Value
API Provider OpenAI Compatible
Base URL https://api.onehop.ai/v1
API Key Your OneHop API key
Model ID Your supported OneHop model
The most important value is the Base URL:
For example:
API Provider:
OpenAI Compatible
Base URL:
https://api.onehop.ai/v1
API Key:
oh_live_****************
Model ID:
openai/gpt-5.6-terra
Example model identifiers may include:
openai/gpt-5.6-terra
openai/gpt-5.6-sol
anthropic/claude-opus-5
Use the exact model identifier currently supported by your OneHop account.
After entering the configuration, click:
Done
Your Final Cline Configuration
The configuration should now conceptually look like this:
API Provider
|
+-- OpenAI Compatible
Base URL
|
+-- https://api.onehop.ai/v1
API Key
|
+-- oh_live_****************
Model ID
|
+-- openai/gpt-5.6-terra
Part 4: Test the Integration
Now let's verify the connection.
Start with a simple coding task.
For example, ask Cline:
Create a simple TypeScript function that reverses a string.
Explain the implementation and include a small test.
If Cline successfully responds, the basic connection is working.
For a more realistic test, give it a project-inspection task:
Inspect this project structure and tell me:
- What framework this project uses
- Where the main application entry point is
- Which file I should edit to add a new API route
Do not change any files yet.
This is a useful test because it exercises more of Cline's normal workflow.
Troubleshooting
Cline Request Failed
Start by checking these three values:
Base URL
API Key
Model ID
Make sure the Base URL is exactly:
Check for:
Extra spaces
Incorrect spelling
Incorrect URL paths
A missing API key
An incorrect model identifier
Authentication Error
If Cline reports an authentication error, verify that:
The API key is correct
The key is active
You copied the complete value
There are no accidental spaces
You did not include quotation marks
Correct:
oh_live_XXXXXXXX
Incorrect:
"oh_live_XXXXXXXX"
Model Not Found
Model identifiers must match the model identifier expected by the gateway.
For example:
openai/gpt-5.6-terra
is different from:
gpt-5.6-terra
Always use the exact model identifier currently provided by OneHop.
Gateway Works but the Model Does Not
If the gateway is reachable but the model request fails, possible causes include:
Model availability
Account permissions
Usage or quota limits
Incorrect model ID
Provider-side issues
Check your OneHop account and verify that the selected model is available.
Recommended Architecture
For a simple development setup:
+----------------------+
| Visual Studio Code |
+----------+-----------+
|
v
+----------------------+
| Cline |
+----------+-----------+
|
v
+----------------------+
| OneHop Gateway |
+----------+-----------+
|
v
+----------------------+
| Selected Model |
+----------------------+
The advantage is that your editor connects to one gateway rather than requiring your development workflow to be rebuilt around each individual model provider.
Using Multiple Models
A gateway-based workflow can also make experimentation easier.
Conceptually:
+--> Primary Model
|
VS Code --> Cline -->+--> Coding Model
|
+--> Backup Model
The exact routing and model capabilities depend on the models and features currently available through your gateway.
Security Best Practices
- Never Expose Your API Key
When taking screenshots, replace the real key with a masked value:
oh_live_0KGX••••••••xIj6
Never show the complete credential.
- Don't Hardcode Secrets
Avoid:
const apiKey = "oh_live_REAL_SECRET";
Use a secure environment-variable or secret-management approach instead.
- Rotate Exposed Credentials
If you accidentally publish an API key:
Treat the key as compromised.
Revoke or rotate it.
Generate a replacement key.
Update your local configuration.
Remove the exposed credential from public repositories and documentation.
Quick Configuration Checklist
Before considering the integration complete, verify:
[ ] Visual Studio Code is installed
[ ] Cline is installed
[ ] Cline panel opens successfully
[ ] OneHop account is ready
[ ] OneHop API key has been created
[ ] API key is stored securely
[ ] API Provider is OpenAI Compatible
[ ] Base URL is https://api.onehop.ai/v1
[ ] Model ID is correct
[ ] Test request succeeds
Complete Example
A conceptual configuration can be represented as:
provider: OpenAI Compatible
base_url: https://api.onehop.ai/v1
api_key: oh_live_****************
model: openai/gpt-5.6-terra
The API key is intentionally masked.
Do not replace the masked value with a real secret when publishing this article.
Frequently Asked Questions
Can I change models after configuring OneHop?
Yes, when another model is supported by your OneHop account, you can generally select it by changing the model identifier used by your Cline configuration.
Do I need a different API key for every model?
With the gateway approach described in this tutorial, Cline uses the OneHop credential for the gateway connection.
Why does my model ID not work?
Check the exact model identifier currently supported by OneHop.
Do not assume that a model name from an older tutorial is still available.
Can I publish my API key in a tutorial screenshot?
No.
Never publish the complete key.
Always mask secrets before publishing screenshots or screen recordings.
Final Takeaway
The integration comes down to three core configuration values:
Provider
↓
OpenAI Compatible
Base URL
↓
https://api.onehop.ai/v1
Model
↓
Your supported OneHop model
The complete workflow is:
Visual Studio Code
↓
Cline
↓
OneHop AI Gateway
↓
Selected Model
Once configured, Cline can communicate with your OneHop gateway through its OpenAI-compatible endpoint.
This gives developers a straightforward way to experiment with supported AI models while keeping the editor-side setup simple.
Conclusion
Cline and OneHop can be connected with a relatively simple OpenAI-compatible configuration.
The key settings are:
API Provider: OpenAI Compatible
Base URL:
https://api.onehop.ai/v1
API Key:
Your OneHop secret key
Model ID:
Your supported model
After saving the settings, run a small test task in Cline to verify the connection.
And before publishing your article, check every screenshot for API keys, tokens, account identifiers, or other private information.
Happy building! 🚀
Top comments (0)