AI Model Web
majiayu000/claude-skill-registry
A skill your agent uses when developing browser/Web applications (React/Vue/Angular, static websites, SPAs) that need AI capabilities.
A skill your agent uses when a browser/Web app (React, Vue, Next, Nuxt, static sites, SPAs, dashboards, AI chat UI, 页面, 前端, 网页) needs AI models via @cloudbase/js-sdk.
$ npx skills add TencentCloudBase/CloudBase-AI-Toolkit --skill ai-model-web -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install TencentCloudBase/CloudBase-AI-Toolkit ai-model-web --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
$ git clone --depth 1 https://github.com/TencentCloudBase/CloudBase-AI-Toolkit.git skills-src && mkdir -p .claude/skills && cp -r skills-src/config/source/skills/ai-model-web .claude/skills/ai-model-web && rm -rf skills-srcUse ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.
Claude Code skills documentation · loads skills from .claude/skills/
Install the "ai-model-web" agent skill from https://github.com/TencentCloudBase/CloudBase-AI-Toolkit/tree/main/config/source/skills/ai-model-web into .claude/skills/ai-model-web/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "ai-model-web", then confirm the skill loads.Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$skill-installer install https://github.com/TencentCloudBase/CloudBase-AI-Toolkit/tree/main/config/source/skills/ai-model-webType this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.
$ npx skills add TencentCloudBase/CloudBase-AI-Toolkit --skill ai-model-web -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install TencentCloudBase/CloudBase-AI-Toolkit ai-model-web --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/TencentCloudBase/CloudBase-AI-Toolkit.git skills-src && mkdir -p .agents/skills && cp -r skills-src/config/source/skills/ai-model-web .agents/skills/ai-model-web && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "ai-model-web" agent skill from https://github.com/TencentCloudBase/CloudBase-AI-Toolkit/tree/main/config/source/skills/ai-model-web into .agents/skills/ai-model-web/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "ai-model-web", then confirm the skill loads.Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add TencentCloudBase/CloudBase-AI-Toolkit --skill ai-model-web -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install TencentCloudBase/CloudBase-AI-Toolkit ai-model-web --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/TencentCloudBase/CloudBase-AI-Toolkit.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/config/source/skills/ai-model-web .cursor/skills/ai-model-web && rm -rf skills-srcUse ~/.cursor/skills/ instead of .cursor/skills for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "ai-model-web" agent skill from https://github.com/TencentCloudBase/CloudBase-AI-Toolkit/tree/main/config/source/skills/ai-model-web into .cursor/skills/ai-model-web/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "ai-model-web", then confirm the skill loads.Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gemini skills install https://github.com/TencentCloudBase/CloudBase-AI-Toolkit.git --path config/source/skills/ai-model-web--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
$ npx skills add TencentCloudBase/CloudBase-AI-Toolkit --skill ai-model-web -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install TencentCloudBase/CloudBase-AI-Toolkit ai-model-web --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/TencentCloudBase/CloudBase-AI-Toolkit.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/config/source/skills/ai-model-web .gemini/skills/ai-model-web && rm -rf skills-srcUse ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.
Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/
Install the "ai-model-web" agent skill from https://github.com/TencentCloudBase/CloudBase-AI-Toolkit/tree/main/config/source/skills/ai-model-web into .gemini/skills/ai-model-web/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "ai-model-web", then confirm the skill loads.Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gh skill install TencentCloudBase/CloudBase-AI-Toolkit ai-model-webInstalls for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
$ npx skills add TencentCloudBase/CloudBase-AI-Toolkit --skill ai-model-web -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/TencentCloudBase/CloudBase-AI-Toolkit.git skills-src && mkdir -p .github/skills && cp -r skills-src/config/source/skills/ai-model-web .github/skills/ai-model-web && rm -rf skills-srcUse ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.
GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/
Install the "ai-model-web" agent skill from https://github.com/TencentCloudBase/CloudBase-AI-Toolkit/tree/main/config/source/skills/ai-model-web into .github/skills/ai-model-web/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "ai-model-web", then confirm the skill loads.GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add TencentCloudBase/CloudBase-AI-Toolkit --skill ai-model-web -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install TencentCloudBase/CloudBase-AI-Toolkit ai-model-web --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/TencentCloudBase/CloudBase-AI-Toolkit.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/config/source/skills/ai-model-web .opencode/skills/ai-model-web && rm -rf skills-srcUse ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "ai-model-web" agent skill from https://github.com/TencentCloudBase/CloudBase-AI-Toolkit/tree/main/config/source/skills/ai-model-web into .opencode/skills/ai-model-web/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "ai-model-web", then confirm the skill loads.OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
ai-model-webA skill your agent uses when a browser/Web app (React, Vue, Next, Nuxt, static sites, SPAs, dashboards, AI chat UI, 页面, 前端, 网页) needs AI models via @cloudbase/js-sdk.
AI Model Web is an agent skill from TencentCloudBase/CloudBase-AI-Toolkit. Use this skill when a browser/Web app (React, Vue, Next, Nuxt, static sites, SPAs, dashboards, AI chat UI, 页面, 前端, 网页) needs AI models via @cloudbase/js-sdk. Default routing for Web/frontend AI — call directly from the browser, do NOT propose a Node.js proxy. Covers generateText and streamText; models via ai.createModel with groups cloudbase, hunyuan-exp, or custom-, model id in the model field. MUST run two-step preflight before code — see body. NOT for Node.js backend (use ai-model-nodejs), Mini Program (use…
Its SKILL.md is about 6.1k tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.
It sits in Media & Creative, covering Messaging and chat bots, Image generation and Static sites and blogs. It works with Node.js, WeChat, Nuxt and React. The repository describes itself as: Backend for AI coding agents on CloudBase — database, auth, functions via Plugin, Skills & MCP. The licence is MIT.
4 steps, taken from the step headings in SKILL.md.
Read from SKILL.md and the folder at commit 21af91c. It shows what the files ask for, not the result of running them.
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
Shell commands in SKILL.md call:
npmtscFrom the folder's file list and the shell code blocks in SKILL.md.
Hosts in commands or code, which the agent is likely to contact:
tcb.cloud.tencent.comapi.moonshot.cnAlso links to:
buy.cloud.tencent.comFrom URLs in SKILL.md, links to its own repository left out.
Names these keys or tokens, usually read from environment variables:
VITE_PUBLISHABLE_KEYFrom names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
AI Model Web loads about 6.1k tokens when it runs. Until then it costs about 147 tokens; SKILL.md has 2,302 words of instructions outside code blocks.
Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.
The automated check noted patterns worth knowing about, such as sudo or a known installer.
a queryAppAuth / manageAppAuth, write to .env.local (see auth-web-cloudbase prerequisites)Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.
The full file from TencentCloudBase/CloudBase-AI-Toolkit at commit 21af91c, republished under its MIT licence (© TencentCloudBase). 2,302 words, ~6,086 tokens.
.claude/skills/ai-model-web/SKILL.md (or your agent's skills folder).Sibling CloudBase skills ship beside this skill. Use local relative paths such as ../auth-tool-cloudbase/SKILL.md.
If a referenced sibling skill file is missing from this environment, ask the user to install the full CloudBase plugin (or the missing skill). Do not HTTP-fetch remote skill or protocol markdown into the agent context.
Use this skill for calling AI models in browser/Web applications via @cloudbase/js-sdk.
🧭 Runtime-plane default for Web. Any time the user's request is framed around a page, a Web app, the frontend, React/Vue/Next/Nuxt, a dashboard UI, or "add AI to my H5", this skill is the default routing target. Do NOT first propose a Node.js / cloud-function / CloudRun proxy;
@cloudbase/js-sdkcan call the model from the browser directly. Only switch toai-model-nodejsif the user explicitly asks for a backend/server call, image generation, or a scenario that truly needs server-side keys or long-running work. This decision is independent of which concrete model the user picks — model names (deepseek-*,glm-*,hunyuan-*,kimi-*, …) only affect themodelfield, not the routing plane.
Use it when you need to:
Do NOT use for:
ai-model-nodejs skillai-model-wechat skillai-model-nodejs skill (Node SDK only)http-api-cloudbase skill (it now includes the ai_model OpenAPI spec for direct HTTP calls; do NOT build a custom HTTP proxy)ai.createModel(...) argument is not a vendor / model nameRead this before writing any createModel(...) line. The single most common mistake when agents generate code for this SDK is hallucinating the argument. There are exactly three legal shapes. Anything else is a bug.
✅ Legal ai.createModel(...) argument | When to use it |
|---|---|
"cloudbase" | The main managed group for new projects (TokenHub-backed, multi-vendor pool). Vendor + concrete model go into the model field of generateText / streamText, e.g. { model: "deepseek-v4-flash" }. No model is enabled by default — always check DescribeAIModels first and, if the target model is missing, enable it with UpdateAIModel before calling the SDK. |
"hunyuan-exp" | Only if DescribeAIModels explicitly returns this legacy builtin group for the current env (mainly the Mini Program Growth Plan — see ai-model-wechat). |
"custom-<your-name>" | A user-defined GroupName you onboarded via CreateAIModel. Must start with custom- (e.g. custom-kimi, custom-openai-compat). |
ai.createModel("deepseek") // wrong — that's a vendor, not a GroupName
ai.createModel("deepseek-v4-flash") // wrong — that's a model name, goes in the `model` field
ai.createModel("hunyuan") // wrong — vendor family, not a GroupName
ai.createModel("hunyuan-2.0-instruct-20251111") // wrong — model name
ai.createModel("glm") / ai.createModel("kimi") / ai.createModel("minimax") // wrong — vendor names
ai.createModel("openai") / ai.createModel("moonshot") // wrong — vendor names
ai.createModel("custom") // wrong — placeholder; use your real custom-<name>
ai.createModel(modelName) // wrong — do not reuse the variable that holds the model idconst model = ai.createModel("cloudbase"); // ← GroupName
await model.generateText({
model: "deepseek-v4-flash", // ← concrete model id
messages: [...]
});createModel("cloudbase") stays the same.model field: { model: "deepseek-v3.2" }, { model: "hunyuan-2.0-instruct-20251111" }, { model: "kimi-k2.6" }, { model: "glm-5" }, …DescribeAIModels({ GroupName: "cloudbase" }).Models[]. If missing, call DescribeManagedAIModelList to confirm the exact Model name the platform supports (case-sensitive — do not guess the spelling), then enable it via UpdateAIModel with Status: 1 (remember Models is a full replacement, so resend everything already enabled + the new one).If you are about to type
ai.createModel(and the thing inside the parentheses is a vendor name, a model name, or a guess — stop. It is almost certainly one of the three legal values above.
Before generating any AI-related SDK code, run the two-step preflight: ① eligibility, ② group readiness. Emitting createModel(...) straight away and letting the user debug runtime errors is significantly more costly.
Call the MCP tool queryEnv with action=info and read EnvId from the response. Every subsequent check and purchase link uses this EnvId.
Call the MCP tool:
callCloudApi(service="tcb", action="DescribeEnvPostpayPackage", params={ EnvId })Pass conditions (all required):
envPostpayPackageInfoList contains at least one entry
That entry's postpayPackageId starts with pkg_tcb_tokencredits_
That entry's status is NOT in [3, 4] (3 / 4 typically mean expired / disabled; trust the live response)
❌ Not satisfied → stop writing code and surface this to the user (replacing {envId} with the real id):
The current environment has no active Token Credits resource pack. Please purchase one before calling any AI API: https://buy.cloud.tencent.com/lowcode?buyType=resPack&envId={envId}&resourceType=token
Let me know once it's done and I'll re-check the resource pack status.
✅ Satisfied → proceed to preflight ②.
Parameter casing is PascalCase by contract. If the call returns
InvalidParameter, fall back to camelCase (envId/envPostpayPackageInfoList) and trust the live response. For the Mini Program scenario there is an additional growth-plan branch — switch to theai-model-wechatskill.
DescribeAIModels → UpdateAIModel if needed)Eligibility alone is not enough. Do not write createModel("cloudbase") yet. First confirm that the target GroupName exists in the env with Status=1, and that the target Model is present in its Models[].
List groups configured in the current env:
callCloudApi(service="tcb", action="DescribeAIModels", params={ EnvId })Returns AIModelGroups: AIModelGroup[], where each AIModelGroup includes GroupName, Type (builtin / custom), Models: [{ Model, EnableMCP, Tags }], Status (1 = on / 2 = off), BaseUrl, Secret, Remark. The main managed GroupName is cloudbase.
Never assume a model is already enabled. Inspect AIModelGroups[?].Models[].Model for the cloudbase group. If the target model (or, when the user did not specify one, the model you intend to default to such as deepseek-v4-flash) is missing, jump to step 4 and enable it — do not call createModel("cloudbase") yet. If the cloudbase group itself is missing or has Status=2, also jump to step 4.
User asked for a model that belongs to the managed catalog (e.g. deepseek-v3.2, hunyuan-2.0-instruct-20251111, glm-5, kimi-k2.6, …): check whether that Model is already in the cloudbase group's Models[]. If not, jump to step 4. Do not guess the exact model id — verify the canonical spelling in DescribeManagedAIModelList first (step 4 covers this).
Enable / add a managed model (always inspect the authoritative catalog + pricing first):
callCloudApi(service="tcb", action="DescribeManagedAIModelList", params={ EnvId })Returns ManagedAIModelGroup[], where each group lists GroupName (e.g. cloudbase), Remark, and Models: [{ Model, EnableMCP, ModelSpec{ContextLength, MaxInputToken, MaxOutputToken}, ModelChargingInfo[{Type, InputPrice, OutputPrice, InputOutputUnit, CachePrice}] }]. This is the single source of truth for supported model names and pricing — do not infer them from memory. Use the exact Model string returned here when calling UpdateAIModel. Also surface the prices to the user before enabling.
Then enable (note: Models is a full replacement — always resend the already-enabled models together with the new one):
callCloudApi(service="tcb", action="UpdateAIModel", params={
EnvId,
GroupName: "cloudbase",
Models: [
// resend every model that DescribeAIModels already showed as enabled
{ Model: "<already-enabled model, e.g. deepseek-v4-flash>" },
// append the newly-requested one, using the exact spelling from DescribeManagedAIModelList
{ Model: "<target model>" }
],
Status: 1
})The requested model is not in the managed catalog (not found by DescribeManagedAIModelList) → jump to the next section, Custom onboarding (models outside the managed catalog).
All Actions use
service=tcb,Version=2018-06-08. Parameters are PascalCase (EnvId/GroupName/Models/Status). Fall back to camelCase only if the call returnsInvalidParameter.
ai.createModel(<GroupName>) accepts exactly three kinds of legal values:
"cloudbase" — the main managed group (recommended)GroupName: "cloudbase", Type: "builtin", Remark: "腾讯云开发" (Tencent CloudBase)DescribeAIModels first to see what the env has actually enabled; if your target model is missing, call DescribeManagedAIModelList for the authoritative catalog + pricing and then UpdateAIModel (Status: 1, Models full-replacement) to enable it before making the SDK call.DescribeManagedAIModelListDescribeAIModels"hunyuan-exp" — legacy builtin group (kept for compatibility)ai-model-wechat skill for that flow)hunyuan-2.0-instruct-20251111; additional hunyuan SKUs must be discovered at runtime via DescribeAIModels({ GroupName: "hunyuan-exp" }).Models[] — do not hard-code other IDsCreateAIModel (see the next section). The custom GroupName MUST start with custom- (e.g. custom-kimi, custom-moonshot, custom-openai-compat). This naming convention prevents future collisions with built-in / vendor GroupNames (cloudbase, hunyuan-exp, deepseek, glm, kimi, minimax, …) that the platform may introduce over timecreateModel("custom-kimi"), createModel("custom-openai-compat")Never write guesses like
createModel("deepseek")orcreateModel("custom")unlessDescribeAIModelsexplicitly returned that exactGroupName(old envs may still carry historicaldeepseek/hunyuan-expbuiltin groups — that stays legal for compatibility, but new projects should always go throughcloudbase).
When the user wants to call a non-managed model (self-hosted, enterprise-internal, third-party OpenAI-compatible endpoint, …), do not block. Guide them through onboarding:
https://tcb.cloud.tencent.com/dev?envId={envId}#/ai
CreateAIModel)callCloudApi(service="tcb", action="CreateAIModel", params={
EnvId: "<envId>",
GroupName: "custom-<your-name>", // MUST start with "custom-" (e.g. custom-kimi, custom-openai-compat); never start with "cloudbase"
BaseUrl: "<OpenAI-compatible endpoint, e.g. https://api.moonshot.cn/v1>",
Models: [
{ Model: "<model name, e.g. kimi-k2.5>", EnableMCP: true }
],
Remark: "<optional remark>",
Status: 1,
Secret: { ApiKey: "<vendor api key supplied by the user>" }
})Once onboarded, confirm with DescribeAIModels that the group is ready, then call ai.createModel("<the GroupName you just registered>") from your code. Use UpdateAIModel to add/remove models, rotate keys, or change BaseUrl (remember Models is a full replacement). Use DeleteAIModel to remove a custom group (builtin groups cannot be deleted).
Custom-model billing is covered by the third-party provider and does not draw from the Token Credits resource pack. Field casing follows the live contract — fall back to camelCase on
InvalidParameter.
npm install @cloudbase/js-sdk⚠️ Do not use anonymous sign-in as the default. Anonymous login is disabled by default for new environments, and inactive existing environments have also been automatically disabled. Even when anonymous login is manually enabled, anonymous users are denied AI model invocation permissions by default. The AI-model skill does not prescribe a specific login UI — delegate that concern:
- Enabling / configuring login providers (phone SMS, email, WeChat Open Platform, username+password, OAuth, …) → follow the
auth-tool-cloudbaseskill (backend config viacallCloudApi).- Building the actual sign-in flow in the browser (login form, callbacks, session guarding) → follow the
auth-web-cloudbaseskill (@cloudbase/js-sdkauth API, e.g.signInWithPassword,signInWithPhone,getSession).Do not fall back to
signInAnonymously()for AI features — anonymous users cannot call AI models. Only use anonymous login for non-AI read-only demos where the user explicitly requests it and accepts the trade-off.
import cloudbase from "@cloudbase/js-sdk";
const app = cloudbase.init({
env: "<YOUR_ENV_ID>",
accessKey: import.meta.env.VITE_PUBLISHABLE_KEY // auto-provision via queryAppAuth / manageAppAuth, write to .env.local (see auth-web-cloudbase prerequisites)
});
const auth = app.auth;
// CRITICAL: Use auth.getSession() to check login — NOT the deprecated getLoginState().
// getLoginState() returns uid even without real login (just accessKey), causing false positives.
// getSession() returns data.session === undefined when no real login exists.
// Anonymous users are DENIED AI model permissions — calling AI without real login will fail.
const { data: sessionData } = await auth.getSession();
if (!sessionData?.session || sessionData.session.user?.is_anonymous) {
// No real login or anonymous session — route to sign-in page
window.location.href = "/login";
return;
}
const ai = app.ai();Important notes:
accessKey causes getLoginState() to return misleading auth data — the deprecated getLoginState() returns an object with uid even without real login, which breaks naive !!loginState checks. Use auth.getSession() instead: it returns data.session === undefined when no real login exists, so !!data.session is a reliable auth gate.auth-web-cloudbase skill.accessKey from the CloudBase consolePrerequisite: the two-step preflight (eligibility + group readiness) has passed, and the target model has been confirmed present in
DescribeAIModels({ GroupName: "cloudbase" }).Models[]— if it was not, it should already have been enabled viaUpdateAIModel. The example below usesdeepseek-v4-flashonly for illustration; substitute the actual model the user asked for.
const model = ai.createModel("cloudbase");
const result = await model.generateText({
model: "deepseek-v4-flash", // must already be enabled in this env (DescribeAIModels → UpdateAIModel)
messages: [{ role: "user", content: "Give me a one-paragraph intro to Li Bai." }],
});
console.log(result.text); // generated text string
console.log(result.usage); // { prompt_tokens, completion_tokens, total_tokens }
console.log(result.messages); // full message history
console.log(result.rawResponses); // raw model responsesPrerequisite: the two-step preflight has passed.
const model = ai.createModel("cloudbase");
const res = await model.streamText({
model: "deepseek-v4-flash",
messages: [{ role: "user", content: "Give me a one-paragraph intro to Li Bai." }],
});
// Option 1: iterate the text stream (recommended)
for await (let text of res.textStream) {
console.log(text); // incremental text chunks
}
// Option 2: iterate the data stream for full response chunks
for await (let data of res.dataStream) {
console.log(data); // full response chunk with metadata
}
// Option 3: access final results
const messages = await res.messages; // full message history
const usage = await res.usage; // token usageconst model = ai.createModel("cloudbase");
try {
const result = await model.generateText({
model: "deepseek-v4-flash",
messages: [{ role: "user", content: "Generate a concise onboarding checklist." }],
});
console.log(result.text);
} catch (error) {
console.error("Failed to call CloudBase AI from Web", error);
}interface BaseChatModelInput {
model: string; // required: model name
messages: Array<ChatModelMessage>; // required: message array
temperature?: number; // optional: sampling temperature
topP?: number; // optional: nucleus sampling
}
type ChatModelMessage =
| { role: "user"; content: string }
| { role: "system"; content: string }
| { role: "assistant"; content: string };
interface GenerateTextResult {
text: string; // generated text
messages: Array<ChatModelMessage>; // full message history
usage: Usage; // token usage
rawResponses: Array<unknown>; // raw model responses
error?: unknown; // error if any
}
interface StreamTextResult {
textStream: AsyncIterable<string>; // incremental text stream
dataStream: AsyncIterable<DataChunk>; // full data stream
messages: Promise<ChatModelMessage[]>;// final message history
usage: Promise<Usage>; // final token usage
error?: unknown; // error if any
}
interface Usage {
prompt_tokens: number;
completion_tokens: number;
total_tokens: number;
}DescribeEnvPostpayPackage) + ② group readiness (DescribeAIModels to inspect what is enabled, DescribeManagedAIModelList for the authoritative supported-model catalog, UpdateAIModel with a full-replacement Models[] and Status: 1 when the target model is missing). Skipping preflight leads straight to "model not found" / "model not enabled" errors at runtime.deepseek-v4-flash, not hunyuan-*, not anything. Always verify with DescribeAIModels first; if the target is missing, look up the exact Model string in DescribeManagedAIModelList (do not guess the spelling or invent vendor prefixes) and then UpdateAIModel to enable it.createModel accepts exactly three kinds of values — "cloudbase" (the main managed group), "hunyuan-exp" (legacy builtin, Growth Plan scenarios), or a user-defined GroupName registered via CreateAIModel (MUST start with custom-, e.g. custom-kimi, custom-openai-compat). Never guess with createModel("deepseek") / createModel("kimi") / createModel("custom").@cloudbase/js-sdk's AI surface — look up the method signature here (or in the Type Definitions section below) before writing code. If a method or field is not documented here, stop and ask, or check the live contract via the MCP tools. No guessing.DescribeManagedAIModelList returns ModelSpec (context length, max input/output tokens) + ModelChargingInfo (input / output / cache prices, billing unit). Surface the prices to the user before calling UpdateAIModel.accessKey safe — use a publishable key, never a secret key.auth-tool-cloudbase skill and the browser sign-in flow to the auth-web-cloudbase skill; the AI-model skill checks auth.getSession() and verifies loginType before gating the call.UpdateAIModel; the latter is a prompt / parameter / network issue. Give the user different guidance for each.any to silence type errors from the SDK. The SDK ships its own types; if an error shows up, narrow with unknown + a type guard, write a precise interface for the shape you actually consume, or augment types in a local .d.ts. Never : any, as any, @ts-ignore, or @ts-nocheck. See the Engineering constitution in the web-development skill.tsc --noEmit + the project build + open the page with agent-browser and actually trigger the AI call. Confirm: (a) the text stream reaches the UI, (b) no new console errors, (c) result.usage is non-zero. Saying "it should work" without evidence is not acceptable — follow web-development/browser-testing.md.© TencentCloudBase, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file
Just SKILL.md in config/source/skills/ai-model-web of TencentCloudBase/CloudBase-AI-Toolkit.
Open the folder on GitHubat commit 21af91c
We found 5 copies of this SKILL.md (exact, near-identical or edited) in other folders, from 2 other GitHub owners. This page covers the copy in TencentCloudBase/CloudBase-AI-Toolkit, which our catalogue first saw on October 7, 2026.
AI Model Web next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| AI Model Web this skillTencentCloudBase/CloudBase-AI-Toolkit | 1.1k | 2 repos | ~6.1k | Automated safety check: Notes | MIT | |
| AI Model Webmajiayu000/claude-skill-registry | 666 | 2 repos | ~1.2k | Automated safety check: Pass | MIT | |
| AI Model Wechatmajiayu000/claude-skill-registry | 666 | 2 repos | ~1.4k | Automated safety check: Pass | MIT | |
| AI Model Nodejsmajiayu000/claude-skill-registry | 666 | 2 repos | ~1.7k | Automated safety check: Pass | MIT | |
| Vue Nuxtericrisco/rsc-harness | 167 | — | ~4.2k | Automated safety check: Pass | MIT | |
| App BuilderUndertone0809/rudder | 292 | — | ~2k | Automated safety check: Pass | Apache-2.0 |
majiayu000/claude-skill-registry
A skill your agent uses when developing browser/Web applications (React/Vue/Angular, static websites, SPAs) that need AI capabilities.
majiayu000/claude-skill-registry
A skill your agent uses when developing WeChat Mini Programs (小程序, 企业微信小程序, wx.cloud-based apps) that need AI capabilities.
majiayu000/claude-skill-registry
A skill your agent uses when developing Node.js backend services or CloudBase cloud functions (Express/Koa/NestJS, serverless, backend APIs) that need AI capabilities.
ericrisco/rsc-harness
A skill your agent uses when building or reviewing a Vue 3 + Nuxt 4 app — <script setup reactivity, SSR/SSG/hybrid routeRules, the app/+server/ layout, SSR-safe fetching (useFetch/useAsyncData) and…
Undertone0809/rudder
Create and iteratively improve local web products from natural-language requests, then prepare them to run as Rudder Apps.
geekjourneyx/md2wechat-skill
Convert Markdown to WeChat Official Account HTML. An agent skill from geekjourneyx/md2wechat-skill.
TencentCloudBase/CloudBase-AI-Toolkit
A skill your agent uses for Node.js backend AI via @cloudbase/node-sdk (=3.16.0) — cloud functions, CloudRun, Express/Koa/NestJS, serverless APIs, scheduled jobs, LLM proxies, agent orchestration.
TencentCloudBase/CloudBase-AI-Toolkit
CloudBase official HTTP API client guide. An agent skill from TencentCloudBase/CloudBase-AI-Toolkit.
TencentCloudBase/CloudBase-AI-Toolkit
Author or revise a cloud-api-operations recipe (config/source/skills/cloud-api-operations/references/recipes/).
TencentCloudBase/CloudBase-AI-Toolkit
Analyze, standardize, validate, and sync locally maintained skills into agent skill directories with a skills CLI-aligned workflow.
TencentCloudBase/CloudBase-AI-Toolkit
Build production-ready AI agent backends using the CloudBase Agent Python SDK — create agents with LangGraph/CrewAI/LlamaIndex, serve them via FastAPI with AG-UI protocol streaming +…
TencentCloudBase/CloudBase-AI-Toolkit
A skill your agent uses when you develop, design, build, deploy, debug, migrate, or troubleshoot CloudBase (腾讯云开发, 云开发, TCB, 微信云开发) projects — Web, 微信小程序, 小程序, uni-app, mobile (iOS, Android…
Categories
A skill your agent uses when a browser/Web app (React, Vue, Next, Nuxt, static sites, SPAs, dashboards, AI chat UI, 页面, 前端, 网页) needs AI models via @cloudbase/js-sdk. AI Model Web is an agent skill from TencentCloudBase/CloudBase-AI-Toolkit. Use this skill when a browser/Web app (React, Vue, Next, Nuxt, static sites, SPAs, dashboards, AI chat UI, 页面, 前端, 网页) needs AI models via @cloudbase/js-sdk.
AI Model Web fits situations like: A browser/Web app (React; 网页) needs AI models via @cloudbase/js-sdk.
Run `npx skills add TencentCloudBase/CloudBase-AI-Toolkit --skill ai-model-web -a claude-code`. Or copy the skill folder (config/source/skills/ai-model-web in TencentCloudBase/CloudBase-AI-Toolkit) into .claude/skills/ai-model-web in your project. Claude Code loads it when a task matches its description.
Run `npx skills add TencentCloudBase/CloudBase-AI-Toolkit --skill ai-model-web -a codex`. Or copy the skill folder (config/source/skills/ai-model-web in TencentCloudBase/CloudBase-AI-Toolkit) into .agents/skills/ai-model-web in your project. Codex loads it when a task matches its description.
Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add TencentCloudBase/CloudBase-AI-Toolkit --skill ai-model-web -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/ai-model-web, .gemini/skills/ai-model-web, .github/skills/ai-model-web and .opencode/skills/ai-model-web in your project.
Going by SKILL.md and its folder, AI Model Web needs the command-line tools its instructions call (npm and tsc) and credentials named VITE_PUBLISHABLE_KEY. Our summary lists: Node.js.
SKILL.md names 3 domains. In commands or code: tcb.cloud.tencent.com and api.moonshot.cn; the agent is likely to contact these when it follows the instructions. As links in the text: buy.cloud.tencent.com. This is read from the text; nothing was executed.
Our automated static check of SKILL.md found notes only (mentions a .env file), nothing it rates as a warning. It is not a guarantee. Review the folder before installing.
AI Model Web is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.
About 6.1k tokens (SKILL.md is roughly 24k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.
Skills that share tags, products or a category with AI Model Web: AI Model Web (majiayu000/claude-skill-registry, 666 stars), AI Model Wechat (majiayu000/claude-skill-registry, 666 stars), AI Model Nodejs (majiayu000/claude-skill-registry, 666 stars) and Vue Nuxt (ericrisco/rsc-harness, 167 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
TencentCloudBase (a GitHub organization) maintains it in TencentCloudBase/CloudBase-AI-Toolkit, which has 1,133 GitHub stars. The repository holds 49 skills in this directory. The repository was last updated on October 7, 2026.
Source: TencentCloudBase/CloudBase-AI-Toolkit on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.