JSON Patch[1] 是一种用于描述如何对 JSON 文档进行更改的格式,它使用一系列简洁的操作指令来指示如何修改 JSON 数据。这些操作包括添加新的数据、删除旧的数据、替换现有的数据或者移动数据等等。
在一个大型的 Web 应用程序中,客户端需要频繁地与服务器通信,获取最新的数据或者将修改后的数据提交给服务器。传统的方式是每次更新都发送整个 JSON 文档,即使只有一小部分数据发生了变化。这会导致网络传输量大,增加了网络延迟,同时也增加了服务器和客户端的负载。
JSON Patch 提供了一种高效的解决方案来减少网络传输量和提高数据更新效率。通过使用 JSON Patch,客户端可以仅发送需要修改的部分数据,而不是整个 JSON 文档。服务器收到 JSON Patch 后,可以根据指令执行相应的操作,从而实现数据的增量更新。这样既减少了网络传输量,提高了网络效率,又降低了服务器和客户端的负载,同时也保证了数据的一致性。
向 JSON 文档中添加新的值,需要指定路径和要添加的值。
{ "op": "add", "path": "/path", "value": "new value" }
从 JSON 文档中移除一个值,需要指定要移除的值的路径。
{ "op": "remove", "path": "/path" }
替换 JSON 文档中的一个值,需要指定要替换的值的路径和新的值。
{ "op": "replace", "path": "/path", "value": "new value" }
移动 JSON 文档中的一个值到另一个位置,需要指定要移动的值的路径和目标路径。
{ "op": "move", "from": "/oldpath", "path": "/newpath" }
复制 JSON 文档中的一个值到另一个位置,需要指定要复制的值的路径和目标路径。
{ "op": "copy", "from": "/oldpath", "path": "/newpath" }
测试 JSON 文档中的一个值是否等于给定的值,主要用于验证操作是否可以成功执行。需要指定要测试的值的路径和预期的值。
{ "op": "test", "path": "/path", "value": "expected value" }
很多常见的开发语言,都实现了 JSON Patch 规范。在 JS 环境,我们可以使用 fast-json-patch[2] 这个库。
首先,使用 npm 或 pnpm 来安装 fast-json-patch:
npm install fast-json-patchor pnpm add fast-json-patch
成功安装 fast-json-patch 库之后,我们就可以利用它提供的 API 来实现以下功能:
import { compare } from "fast-json-patch/index.mjs";const documentA = { user: { firstName: "Albert", lastName: "Einstein" } };const documentB = { user: { firstName: "Albert", lastName: "Collins" } };const diff = compare(documentA, documentB);/** * diff: * [ { op: 'replace', path: '/user/lastName', value: 'Collins' } ] */
import { generate, observe } from "fast-json-patch/index.mjs";const document = { firstName: "Joachim", lastName: "Wester", contactDetails: { phoneNumbers: [{ number: "555-123" }] },};const observer = observe(document);document.firstName = "Albert";document.contactDetails.phoneNumbers[0].number = "123";document.contactDetails.phoneNumbers.push({ number: "456" });const patch = generate(observer);/** * patch: * [ * { * op: 'replace', * path: '/contactDetails/phoneNumbers/0/number', * value: '123' * }, * { * op: 'add', * path: '/contactDetails/phoneNumbers/1', * value: { number: '456' } * }, * { op: 'replace', path: '/firstName', value: 'Albert' } * ] */
import { applyPatch } from "fast-json-patch/index.mjs";const documentA = { user: { firstName: "Albert", lastName: "Einstein" } };const patchedResult = applyPatch(documentA, [ { op: "replace", path: "/user/lastName", value: "Collins" },]);/** * patchedResult[0]: * { * newDocument: { user: { firstName: 'Albert', lastName: 'Collins' } }, * removed: 'Einstein' * } */
import { applyPatch } from "fast-json-patch/index.mjs";const document = { firstName: "Joachim", lastName: "Wester", contactDetails: { phoneNumbers: [{ number: "555-123" }] },};const patchedResult = applyPatch(document, [ { op: "replace", path: "/contactDetails/phoneNumbers/0/number", value: "123", }, { op: "add", path: "/contactDetails/phoneNumbers/1", value: { number: "456" }, }, { op: "replace", path: "/firstName", value: "Albert" },]);/** * patchedResult[0]: * { * newDocument: { * firstName: "Albert", * lastName: "Wester", * contactDetails: { phoneNumbers: [{ number: "123" }, { number: "456" }] }, * }, * removed: "555-123", * } */
import { validate } from "fast-json-patch/index.mjs";const documentA = { user: { firstName: "Albert", lastName: "Einstein" } };const validatedResult = validate( [{ op: "replace", path: "/user/lastName", value: "Collins" }], documentA);
如果补丁序列不满足 JSON Patch 规范,在验证过程中就会抛出 JsonPatchError 异常对象。
JSON Patch 和 fast-json-patch 的相关内容就介绍到这里,感兴趣的话,可以尝试一下 JSON Patch。
[1]JSON Patch: https://datatracker.ietf.org/doc/html/rfc6902
[2]fast-json-patch: https://github.com/Starcounter-Jack/JSON-Patch
本文链接://www.dmpip.com//www.dmpip.com/showinfo-26-88354-0.html更新大的 JSON 对象,也能用上增量更新!
声明:本网页内容旨在传播知识,若有侵权等问题请及时与本网联系,我们将在第一时间删除处理。邮件:2376512515@qq.com
上一篇: C#事件:实现安全的发布/订阅模型