Refine v5 社区数据提供者Community Data Providers指南从 Directus 到 JSON:API 的生态接入实践【免费下载链接】refineA React Framework for building internal tools, admin panels, dashboards B2B apps with unmatched flexibility.项目地址: https://gitcode.com/GitHub_Trending/re/refineRefine 内置了一批开箱即用的数据提供者Data Provider但真实项目中往往要对接 Headless CMS、BaaS、SQLite 或自定义 GraphQL 网关等五花八门的后端。本文以仓库中 community-data-providers 文档 为主体梳理 Refine 社区生态维护的全部数据提供者清单并结合>npm install community-package-nameimport { Refine } from refinedev/core; import dataProvider from community-package-name; const App () ( Refine dataProvider{dataProvider(API_URL)} /* ... */ / );大多数社区包会导出一个工厂函数接收 API 地址或客户端实例返回一个符合DataProvider契约的对象。例如 Elide 系列通常以 API URL 为参数而refine-sanity则以 Sanity Client 实例为参数见下文实战案例。多数据提供者共存社区包与内置包协同真实项目很少只用一个后端。当社区数据提供者需要与默认数据提供者同时使用时data-provider 核心文档 给出了明确的组合模式import { Refine } from refinedev/core; import dataProvider from refinedev/simple-rest; import firebaseProvider from refine-firebase; const App () ( Refine dataProvider{{ // default 键是必需的用于指定默认数据提供者 default: dataProvider(https://api.fake-rest.refine.dev), firebase: firebaseProvider, }} resources{[ { name: posts }, { name: products, meta: { // 在资源配置中指定使用的数据提供者 dataProviderName: firebase, }, }, ]} / );选择数据提供者有两种途径在数据钩子中通过dataProviderName参数临时指定优先级更高或在资源配置的meta.dataProviderName中声明默认值。这一机制让社区提供者可以作为“补充数据源”平滑融入以官方提供者为主的既有应用而无需改动任何现有资源的代码。实战案例refine-sanity 的完整接入仓库中的>npm install sanity/client refine-sanity第一步创建 Sanity Client 实例并传入refine-sanity的工厂函数。示例 App.tsx 中展示了完整的客户端配置import { createClient } from sanity/client; import dataProvider from refine-sanity; const client createClient({ token: EDITOR_SANITY_ACCESS_TOKEN, projectId: SANITY_PROJECT_ID, dataset: SANITY_DATASET, perspective: published, // 读取已发布的内容 useCdn: false, // 生产环境可开启 CDN 缓存 apiVersion: 2021-10-21, }); const App () ( Refine dataProvider{dataProvider(client)} /* ... */ {/* ... */} /Refine );第二步在Refine /中注册后就可以直接用 Refine 的数据钩子与 Sanity 交互例如用useTable驱动列表页import { useTable } from refinedev/antd; const { tableProps, filters, sorters } useTableIPost({ /* ... */ });示例应用同时定义了post与category两个资源并在资源meta中开启canDelete: trueApp.tsx配合liveMode: auto等选项完整演示了社区数据提供者如何在真实应用中支撑列表、创建、编辑、详情展示与删除等全部 CRUD 流程。如果你想在本地复现可以运行npm create refine-applatest -- --example>import { DataProvider } from refinedev/core; const dataProvider: DataProvider { // 必选方法 getList: ({ resource, pagination, sorters, filters, meta }) Promise, create: ({ resource, variables, meta }) Promise, update: ({ resource, id, variables, meta }) Promise, deleteOne: ({ resource, id, variables, meta }) Promise, getOne: ({ resource, id, meta }) Promise, getApiUrl: () , // 可选方法批量操作 getMany: ({ resource, ids, meta }) Promise, createMany: ({ resource, variables, meta }) Promise, deleteMany: ({ resource, ids, variables, meta }) Promise, updateMany: ({ resource, ids, variables, meta }) Promise, custom: ({ url, method, filters, sorters, payload, query, headers, meta }) Promise, };理解这份契约有助于你评估社区包的成熟度必选六件套getList含排序、过滤、分页、create、update、deleteOne、getOne、getApiUrl是所有社区包都能提供基本 CRUD 的最低保障可选的批量方法getMany、createMany、deleteMany、updateMany。若社区包未实现Refine 会自动退化为逐个调用getOne/create/deleteOne/update文档原文因此缺失批量方法不影响功能只影响性能custom方法用于对接非标准 REST 端点或外部资源是社区包扩展性的体现。在消费侧Refine 将每个方法与特定数据钩子一一对应getList由useList/useInfiniteList消费create由useCreate消费update由useUpdate消费deleteOne由useDelete消费getOne由useOne消费custom由useCustom消费。也就是说只要社区包实现了这份契约你在界面层写的所有钩子代码都是通用的这正是社区数据提供者“即插即用”的底层原因。此外契约还约定了错误格式与透传参数社区包抛出的错误应继承自HttpError包含message与statusCode示例见此处而钩子调用中的meta字段如自定义请求头x-custom-header会被原样透传给数据提供者方法社区包据此可实现鉴权头、租户 ID 等定制需求。使用社区数据提供者的注意事项原文档在开头专门用 “Good to know” 强调了社区包的支持边界这一点对实际选型至关重要问题优先联系包维护者Refine 官方团队会尽量协助与 Refine 相关的 issue但社区数据提供者的问题如对目标平台 API 的适配缺陷应首先反馈给对应包的维护者而非 Refine 主仓库。贡献路径如果你希望自己的数据提供者被收录或想改进现有社区包可以参考仓库根目录的 CONTRIBUTING.md该页面本身也呼吁社区通过 Pull Request 共享自定义数据提供者见 supported-data-providers.md 末尾的说明。用 swizzle 二次定制如果某个社区包与你的 API 细节不完全吻合不必 fork 整个包。Refine 提供 swizzle 机制——在项目目录运行npm run refine swizzle选择目标数据提供者后即可把源码复制进项目并自由修改见 simple-rest 文档。文档版本化本页在 Refine v4 与 v5 文档中均被收录——仓库的 version-4.xx.xx 侧边栏 与 v5 侧边栏 都包含该条目且 redirects.json 记录了旧路径到新路径的 301 重定向。如果你在旧版本文档中看到本页请注意以 v5 文档路径为准。小结社区数据提供者是 Refine 数据生态中极具价值的一块拼图它让官方尚未覆盖的平台Directus、Firebase、Sanity、Hygraph、Elide、SQLite、JSON:API 等也能通过统一的数据钩子接入应用且接入成本与官方提供者完全一致。选型时你可以参考本文的清单确认目标平台是否已有社区实现通过 contenteditable="false">【免费下载链接】refineA React Framework for building internal tools, admin panels, dashboards B2B apps with unmatched flexibility.项目地址: https://gitcode.com/GitHub_Trending/re/refine创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 Refine v5 社区数据提供者（Community Data Providers）指南：从 Directus 到 JSON:API 的生态接入实践
Refine v5 社区数据提供者Community Data Providers指南从 Directus 到 JSON:API 的生态接入实践【免费下载链接】refineA React Framework for building internal tools, admin panels, dashboards B2B apps with unmatched flexibility.项目地址: https://gitcode.com/GitHub_Trending/re/refineRefine 内置了一批开箱即用的数据提供者Data Provider但真实项目中往往要对接 Headless CMS、BaaS、SQLite 或自定义 GraphQL 网关等五花八门的后端。本文以仓库中 community-data-providers 文档 为主体梳理 Refine 社区生态维护的全部数据提供者清单并结合>npm install community-package-nameimport { Refine } from refinedev/core; import dataProvider from community-package-name; const App () ( Refine dataProvider{dataProvider(API_URL)} /* ... */ / );大多数社区包会导出一个工厂函数接收 API 地址或客户端实例返回一个符合DataProvider契约的对象。例如 Elide 系列通常以 API URL 为参数而refine-sanity则以 Sanity Client 实例为参数见下文实战案例。多数据提供者共存社区包与内置包协同真实项目很少只用一个后端。当社区数据提供者需要与默认数据提供者同时使用时data-provider 核心文档 给出了明确的组合模式import { Refine } from refinedev/core; import dataProvider from refinedev/simple-rest; import firebaseProvider from refine-firebase; const App () ( Refine dataProvider{{ // default 键是必需的用于指定默认数据提供者 default: dataProvider(https://api.fake-rest.refine.dev), firebase: firebaseProvider, }} resources{[ { name: posts }, { name: products, meta: { // 在资源配置中指定使用的数据提供者 dataProviderName: firebase, }, }, ]} / );选择数据提供者有两种途径在数据钩子中通过dataProviderName参数临时指定优先级更高或在资源配置的meta.dataProviderName中声明默认值。这一机制让社区提供者可以作为“补充数据源”平滑融入以官方提供者为主的既有应用而无需改动任何现有资源的代码。实战案例refine-sanity 的完整接入仓库中的>npm install sanity/client refine-sanity第一步创建 Sanity Client 实例并传入refine-sanity的工厂函数。示例 App.tsx 中展示了完整的客户端配置import { createClient } from sanity/client; import dataProvider from refine-sanity; const client createClient({ token: EDITOR_SANITY_ACCESS_TOKEN, projectId: SANITY_PROJECT_ID, dataset: SANITY_DATASET, perspective: published, // 读取已发布的内容 useCdn: false, // 生产环境可开启 CDN 缓存 apiVersion: 2021-10-21, }); const App () ( Refine dataProvider{dataProvider(client)} /* ... */ {/* ... */} /Refine );第二步在Refine /中注册后就可以直接用 Refine 的数据钩子与 Sanity 交互例如用useTable驱动列表页import { useTable } from refinedev/antd; const { tableProps, filters, sorters } useTableIPost({ /* ... */ });示例应用同时定义了post与category两个资源并在资源meta中开启canDelete: trueApp.tsx配合liveMode: auto等选项完整演示了社区数据提供者如何在真实应用中支撑列表、创建、编辑、详情展示与删除等全部 CRUD 流程。如果你想在本地复现可以运行npm create refine-applatest -- --example>import { DataProvider } from refinedev/core; const dataProvider: DataProvider { // 必选方法 getList: ({ resource, pagination, sorters, filters, meta }) Promise, create: ({ resource, variables, meta }) Promise, update: ({ resource, id, variables, meta }) Promise, deleteOne: ({ resource, id, variables, meta }) Promise, getOne: ({ resource, id, meta }) Promise, getApiUrl: () , // 可选方法批量操作 getMany: ({ resource, ids, meta }) Promise, createMany: ({ resource, variables, meta }) Promise, deleteMany: ({ resource, ids, variables, meta }) Promise, updateMany: ({ resource, ids, variables, meta }) Promise, custom: ({ url, method, filters, sorters, payload, query, headers, meta }) Promise, };理解这份契约有助于你评估社区包的成熟度必选六件套getList含排序、过滤、分页、create、update、deleteOne、getOne、getApiUrl是所有社区包都能提供基本 CRUD 的最低保障可选的批量方法getMany、createMany、deleteMany、updateMany。若社区包未实现Refine 会自动退化为逐个调用getOne/create/deleteOne/update文档原文因此缺失批量方法不影响功能只影响性能custom方法用于对接非标准 REST 端点或外部资源是社区包扩展性的体现。在消费侧Refine 将每个方法与特定数据钩子一一对应getList由useList/useInfiniteList消费create由useCreate消费update由useUpdate消费deleteOne由useDelete消费getOne由useOne消费custom由useCustom消费。也就是说只要社区包实现了这份契约你在界面层写的所有钩子代码都是通用的这正是社区数据提供者“即插即用”的底层原因。此外契约还约定了错误格式与透传参数社区包抛出的错误应继承自HttpError包含message与statusCode示例见此处而钩子调用中的meta字段如自定义请求头x-custom-header会被原样透传给数据提供者方法社区包据此可实现鉴权头、租户 ID 等定制需求。使用社区数据提供者的注意事项原文档在开头专门用 “Good to know” 强调了社区包的支持边界这一点对实际选型至关重要问题优先联系包维护者Refine 官方团队会尽量协助与 Refine 相关的 issue但社区数据提供者的问题如对目标平台 API 的适配缺陷应首先反馈给对应包的维护者而非 Refine 主仓库。贡献路径如果你希望自己的数据提供者被收录或想改进现有社区包可以参考仓库根目录的 CONTRIBUTING.md该页面本身也呼吁社区通过 Pull Request 共享自定义数据提供者见 supported-data-providers.md 末尾的说明。用 swizzle 二次定制如果某个社区包与你的 API 细节不完全吻合不必 fork 整个包。Refine 提供 swizzle 机制——在项目目录运行npm run refine swizzle选择目标数据提供者后即可把源码复制进项目并自由修改见 simple-rest 文档。文档版本化本页在 Refine v4 与 v5 文档中均被收录——仓库的 version-4.xx.xx 侧边栏 与 v5 侧边栏 都包含该条目且 redirects.json 记录了旧路径到新路径的 301 重定向。如果你在旧版本文档中看到本页请注意以 v5 文档路径为准。小结社区数据提供者是 Refine 数据生态中极具价值的一块拼图它让官方尚未覆盖的平台Directus、Firebase、Sanity、Hygraph、Elide、SQLite、JSON:API 等也能通过统一的数据钩子接入应用且接入成本与官方提供者完全一致。选型时你可以参考本文的清单确认目标平台是否已有社区实现通过 contenteditable="false">【免费下载链接】refineA React Framework for building internal tools, admin panels, dashboards B2B apps with unmatched flexibility.项目地址: https://gitcode.com/GitHub_Trending/re/refine创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考