fabric-sdk
How to use @microsoft/fabric-app-data to connect web applications to Fabric data sources at runtime. Build browser-based apps that query semantic models via DAX using the FabricClient API.
- License 许可
- MIT
- 最近更新
- 2026-10-31
- Stars
- ★ 1
- Forks
- 3
01 前言 Front Matter
- name
- fabric-sdk
- description
- How to use @microsoft/fabric-app-data to connect web applications to Fabric data sources at runtime. Build browser-based apps that query semantic models via DAX using the FabricClient API.
02 资源文件 4
- 参考文档references/custom-plugins.md11.5 KB
- 参考文档references/megatron-integration.md11.0 KB
- 参考文档references/performance.md12.3 KB
- 参考文档references/types.md1.4 KB
03 SKILL.md 正文
Fabric SDK Usage
Overview
@microsoft/fabric-app-data lets web applications query Fabric semantic models at
runtime. The SDK provides a FabricClient that handles querying, result
parsing, caching, and error handling. Transport and authentication are
delegated to an IFabricApiProxy implementation, keeping the SDK
environment-agnostic (browser, Node.js, Fabric extensions).
Quick Start
import { FabricClient } from "@microsoft/fabric-app-data";
const client = new FabricClient({
proxy, // provided by host environment
semanticModels: {
sales: { workspaceId: "...", itemId: "..." },
},
});
const result = await client.semanticModel("sales").query(
"EVALUATE SUMMARIZECOLUMNS(Product[Category], \"Total\", [Sales Amount])"
);
if (result.status === "success") {
// result.table.columns — [{name, dataType}]
// result.table.rows — unknown[][]
} else {
// result.error.category — "api" | "query" | "overflow" | "network" | "unknown"
// result.error.message
}
Key Concepts
FabricClient Configuration
The FabricClient is constructed with a config object. The proxy and
connection details are typically provided by the host environment — your
code just needs to pass them through:
new FabricClient({
proxy, // Provided by host environment
semanticModels: { // Named connections
alias: { workspaceId, itemId },
},
cache: { // Optional
enabled: true, // Default: true
maxEntries: 64, // Default: 64 (LRU eviction)
},
});
workspaceIdcan be a GUID or"me"for My Workspace items.
Managing Connections
The FabricClient accepts connection config as a plain object. How you
manage those IDs (environment variables, config files, codegen) is up to
your project. The only requirement is that workspaceId and itemId
are provided for each named connection.
const client = new FabricClient({
proxy,
semanticModels: {
sales: { workspaceId: "00c98f7c-...", itemId: "03f2dc11-..." },
},
});
Querying
There is one method for DAX queries:
const result = await client.semanticModel("alias").query(dax);
// To skip the cache:
const fresh = await client.semanticModel("alias").query(dax, { bypassCache: true });
Result Handling
Always check result.status — queries never throw.
Each query must contain exactly one EVALUATE statement. On success, the
result contains a single table with:
columns:Array<{ name: string, dataType: string }>— column metadatarows:unknown[][]— row-major array, values match column order by index
const result = await model.query("EVALUATE ...");
if (result.status === "success") {
// result.table.columns = [{ name: "Product[Name]", dataType: "String" },
// { name: "[Sales]", dataType: "Int64" }]
// result.table.rows = [["Widget", 42], ["Gadget", 17]]
// result.table.rows[0][0] → "Widget" (matches columns[0])
// result.table.rows[0][1] → 42 (matches columns[1])
} else {
console.error(result.error.message);
// result.error.category: "query" (bad DAX), "overflow" (value too large),
// "api" (HTTP error), "network" (connectivity), "unknown"
}
Caching
Results are cached in memory by default (LRU, 64 entries).
const r1 = await model.query("EVALUATE T"); // r1.fromCache === false
const r2 = await model.query("EVALUATE T"); // r2.fromCache === true
// Check cache age
if (r2.fromCache && r2.cachedAt) {
const ageMs = Date.now() - r2.cachedAt.getTime();
}
// Force fresh result
const fresh = await model.query("EVALUATE T", { bypassCache: true });
// Clear cache
client.clearCache(); // all sub-clients
model.clearCache(); // this model only
What gets cached:
- ✅ Success results
- ✅ Query errors (bad DAX — won't fix itself)
- ❌ API errors (401, 500 — transient)
- ❌ Network errors (transient)
Error Categories
| Category | Meaning | Cached? | Example |
|---|---|---|---|
query |
Invalid DAX syntax | Yes | "Syntax error at position 18" |
overflow |
Integer/decimal exceeds safe range | Yes | Value > MAX_SAFE_INTEGER |
api |
HTTP error from Fabric | No | 401 Unauthorized, 500 Server Error |
network |
Connection failure | No | DNS resolution, timeout |
unknown |
Unexpected error | No | Parse failure |
Data Types and DateTime Semantics
The SDK converts all DAX data types to standard JS values:
| DAX type | JS value type | Example |
|---|---|---|
| Integer (Int64) | number |
42 |
| Double (Float64) | number |
3.14 |
| Currency/Decimal | number |
100.50 |
| Boolean | boolean |
true |
| String | string |
"hello" |
| DateTime/Date | string (ISO) |
"2024-01-15T10:30:00.000" |
| BLANK | null |
null |
DateTime values are returned as ISO 8601 strings without a timezone
suffix (no Z, no ±HH:MM). This matches the semantics of Analysis
Services semantic models, where datetimes are timezone-unaware.
// DateTime column values look like:
"2024-01-15T10:30:00.000" // no timezone — interpret as-is
"2023-06-01T00:00:00.000"
This format is directly usable as a temporal type in charting libraries
and ensures consistent display across all browser timezones. The JSON and
Arrow protocols both return the same format.
Integer overflow: If an integer value exceeds ±Number.MAX_SAFE_INTEGER
(±9,007,199,254,740,991), the query returns an error with
category: "overflow" rather than silently losing precision.
Common Patterns
Multiple Models
const client = new FabricClient({
proxy,
semanticModels: {
sales: { workspaceId: "ws-1", itemId: "item-1" },
inventory: { workspaceId: "ws-2", itemId: "item-2" },
},
});
const salesResult = await client.semanticModel("sales").query("EVALUATE ...");
const invResult = await client.semanticModel("inventory").query("EVALUATE ...");
My Workspace Items
semanticModels: {
myModel: { workspaceId: "me", itemId: "..." },
}
Disabling Cache
new FabricClient({
proxy,
cache: { enabled: false },
semanticModels: { ... },
});
Anti-Patterns
- Don't catch errors from
query()— it never throws. Checkresult.status. - Don't hardcode endpoint URLs — the proxy handles transport.
- Don't construct
SemanticModelClientdirectly — useclient.semanticModel(alias). - Don't import from internal paths — only import from
"@microsoft/fabric-app-data".
Type Reference
All types are exported from the "@microsoft/fabric-app-data" package entry point.
Key types to import when needed:
import type {
FabricClientConfig,
FabricItemRef,
QueryResult,
CachedQueryResult,
QueryCacheOptions,
QueryTable,
QueryColumn,
QueryError,
} from "@microsoft/fabric-app-data";
For full type definitions, see references/types.md in this skill.
04 同仓库更多 Skills
visuals
Use when user wants to incorporate charts, graphs, data grid, or other visual representations of data into their project. Use VegaVisual and DataGrid components to create these visuals, utilizing the shared DataTable input, formatting, theme, and interactivity. Covers the onInteraction selection/click events host apps consume, named multi-table data input for layered overlays and reference lines, and Vega-Lite native selections.
schema-discovery
Explore Power BI semantic model schemas using DAX INFO functions. Progressive metadata discovery strategy, scope estimation, and narrowing techniques for tables, columns, measures, and relationships.
rayfin
Use when doing ANY task involving Rayfin — scaffolding, data models, decorators, auth, deployment, CLI commands, or client setup. Triggers: rayfin, rayfin init, rayfin up, rayfin login, RayfinClient, @entity, @role, @anonymous, @authenticated, @text, @uuid, @int, @decimal, @boolean, @date, @email, @set, @one, @many, DAB, Data API Builder, rayfin.yml, publishableKey, signUp, signIn, signOut, sendMagicLink, handleMagicLinkCallback, ensureSignedInWithFabric, Fabric SSO, Entra ID, rayfin up db apply, rayfin up staticapp deploy, schema.ts, OpaqueSession, onSessionChange, GraphQL select, GraphQL create, GraphQL update, GraphQL delete, findById, executePaginated, RLS policy, row-level security, claims.sub, claims.email, TC39 decorators, config generation, dialect, mssql, postgresql
rayfin-functions
Use when writing Rayfin user-defined functions (UDFs), invoking functions from frontend code, or using functions CLI commands. Triggers: rayfin functions, udf.func, UserDataFunctions, RayfinContext, FabricContext, AppFunctionsSchema, functions init, dev functions apply, client.functions, invoke, func start, function_app.ts, types.ts, rayfin/functions/, FunctionClient, FunctionsSchema, fabric-user-data-functions, functionsBaseUrl, VITE_RAYFIN_FUNCTIONS_URL, bootstrap.ts, rayfinClient.ts
query-design
Separates DAX data-fetching from TypeScript presentation. Guides when to use DAX vs. TypeScript vs. Vega-Lite for aggregation, total rows, FORMAT(), SELECTCOLUMNS, BLANK handling, filtering, multi-grain queries, cross-filtering and cross-highlight subset/overlay queries, and format strings.
playwright-cli
Automate browser interactions, test web pages and work with Playwright tests.