后端前端开发工具移动开发【免费下载链接】meteorMeteor, the JavaScript App Platform项目地址https://gitcode.com/gh_mirrors/me/meteor点击查看免费下载导读本文围绕 Meteor 官方fetch包展开讲解它在现代浏览器、旧版浏览器与 Node.js 三种环境下如何提供统一的 WHATWGfetch()API并给出应用与包package两种安装方式、完整调用示例及底层实现原理。读完本文你将掌握如何用meteor/fetch替代已废弃的http包完成同构 HTTP 请求并理解其 polyfill 分层、浏览器版本门槛与accounts-express认证集成机制。背景为什么需要fetch包在 Meteor 应用中发起 HTTP 请求历史上使用http包提供的HTTP.callAPI。随着 Web 标准演进http包已被官方标记为废弃其 README 明确说明This package has been deprecated in favor of the fetch package and new web standards.fetch包正是为接替http而设计对旧版legacy浏览器提供 WHATWGfetch规范的 polyfill对现代modern浏览器和Node.js直接复用运行环境自带的全局fetch实现几乎零运行时开销。它遵循同构isomorphic设计——同一份代码在客户端与服务端都能以一致的 API 发起请求是 Meteor 3 时代发起 HTTP 调用的推荐方式。安装应用与包两种方式为应用添加在应用目录下执行meteor add fetch为自定义包添加若你正在开发一个 Meteor 包在package.js的Package.onUse回调中加入api.use(fetch)Package.onUse((api) { api.use(fetch); });从 packages/fetch/package.js 可以看到fetch包自身依赖了三个核心依赖Package.onUse(function (api) { api.use(modules); api.use(modern-browsers); api.use(promise); api.mainModule(modern.js, web.browser); api.mainModule(legacy.js, legacy); api.mainModule(server.js, server); api.addAssets(fetch.d.ts, server); api.export(fetch); });关键点解读三个 mainModule 分别对应三种运行环境现代浏览器加载modern.js、旧版浏览器加载legacy.js、服务端加载server.js这构成了完整的 polyfill 分层架构下文详述api.export(fetch)让依赖方可以像使用全局函数一样引用fetch同时Headers、Request、Response等类需要通过显式导入获取依赖的 npm 包为node-fetch2.6.12与whatwg-fetch3.6.17其版本由 Meteor 官方锁定。API 与导入方式从meteor/fetch可以导入四个导出项fetch、Headers、Request、Responseimport { fetch, Headers, Request, Response } from meteor/fetch;不过大多数场景下只需要fetch与Headersimport { Meteor } from meteor/meteor; import { fetch, Headers } from meteor/fetch;TypeScript 开发者可以受益于包内置的类型声明 packages/fetch/fetch.d.tsexport declare function fetch( input: RequestInfo | URL, init?: RequestInit, ): PromiseResponse; export declare var Headers: typeof globalThis.Headers; export declare var Request: typeof globalThis.Request; export declare var Response: typeof globalThis.Response;该声明文件在 packages/fetch/package-types.json 中被注册为包的typesEntry因此import { fetch } from meteor/fetch在 TypeScript 工程中可直接获得完整类型提示。完整使用示例带认证的 POST 请求以下示例演示了发起 POST 请求、携带认证头与 JSON 请求体并通过Meteor.wrapAsync将异步函数转为同步调用在服务端 Fiber 环境中尤为常用import { Meteor } from meteor/meteor; import { fetch, Headers } from meteor/fetch; async function postData (url, data) { try { const response await fetch(url, { method: POST, // *GET, POST, PUT, DELETE, etc. mode: cors, // no-cors, *cors, same-origin cache: no-cache, // *default, no-cache, reload, force-cache, only-if-cached credentials: same-origin, // include, *same-origin, omit headers: new Headers({ Authorization: Bearer my-secret-key, Content-Type: application/json }), redirect: follow, // manual, *follow, error referrerPolicy: no-referrer, // no-referrer, *no-referrer-when-downgrade, origin, origin-when-cross-origin, same-origin, strict-origin, strict-origin-when-cross-origin, unsafe-url body: JSON.stringify(data) // body data type must match Content-Type header }); const data await response.json(); return response(null, data); } catch (err) { return response(err, null); } } const postDataCall Meteor.wrapAsync(postData); const results postDataCall(https://www.example.org/statsSubmission, { totalUsers: 55 });示例中各fetch选项的含义与可选值选项示例值可选值作用methodPOSTGET、POST、PUT、DELETE等指定 HTTP 方法modecorsno-cors、cors、same-origin控制跨域请求模式cacheno-cachedefault、no-cache、reload、force-cache、only-if-cached控制缓存策略credentialssame-origininclude、same-origin、omit控制是否携带凭据Cookieheadersnew Headers({...})Headers实例或普通对象自定义请求头redirectfollowmanual、follow、error控制重定向处理referrerPolicyno-referrerno-referrer、no-referrer-when-downgrade、origin、origin-when-cross-origin、same-origin、strict-origin、strict-origin-when-cross-origin、unsafe-url控制Referer头发送策略bodyJSON.stringify(data)字符串、FormData、Blob等请求体其类型需与Content-Type匹配提示示例中Meteor.wrapAsync是 Meteor 将 Promise 或异步函数包装为同步方法的工具适合在服务端方法或启动逻辑中使用在客户端事件处理器中直接使用await即可。底层实现三套环境的 polyfill 分层fetch包最核心的设计在于按运行环境选择实现。从源码可清晰看到这一分层现代浏览器modern.jspackages/fetch/modern.js 直接绑定全局fetch不做任何 polyfillvar rawFetch global.fetch.bind(global); function fetch(url, options) { var ae Package[accounts-express]; if (ae ae.handleFetch) { return ae.handleFetch(url, options, rawFetch); } return rawFetch(url, options); } exports.fetch fetch; exports.Headers global.Headers; exports.Request global.Request; exports.Response global.Response;现代浏览器原生支持fetch因此该文件几乎零体积——它只是把全局实现原样导出并预留了认证钩子见下文accounts-express集成。旧版浏览器legacy.jspackages/fetch/legacy.js 的第一行是require(whatwg-fetch)通过 whatwg-fetch polyfill 注入fetch、Headers、Request、Response全局实现后续逻辑与modern.js完全一致require(whatwg-fetch); var rawFetch global.fetch.bind(global); function fetch(url, options) { var ae Package[accounts-express]; if (ae ae.handleFetch) { return ae.handleFetch(url, options, rawFetch); } return rawFetch(url, options); }得益于 Meteor 的 modern/legacy 双 bundle 机制whatwg-fetch polyfill不会进入现代浏览器加载的 JS bundle旧浏览器才需要为它支付体积成本。Node.js 服务端server.jspackages/fetch/server.js 使用node-fetch作为实现并将Headers、Request、Response指向 node-fetch 提供的类const nodeFetch require(node-fetch); const rawFetch nodeFetch.default; function fetch(url, options) { var ae Package[accounts-express]; if (ae ae.handleFetch) { return ae.handleFetch(url, options, rawFetch); } return rawFetch(url, options); } exports.fetch fetch; exports.Headers nodeFetch.Headers; exports.Request nodeFetch.Request; exports.Response nodeFetch.Response;与客户端 polyfill 不同Node 端的 node-fetch 不会把fetch定义为全局函数但任何依赖fetch包的代码仍可像使用全局函数一样引用它api.export(fetch)的作用或通过import { fetch } from meteor/fetch显式导入。现代浏览器版本门槛的强制server.js在文件末尾调用了modern-browsers包的setMinimumBrowserVersions用于确定哪些浏览器属于modern从而加载零开销的原生实现而非legacy从而加载 whatwg-fetch polyfillconst { setMinimumBrowserVersions } require(meteor/modern-browsers); // https://caniuse.com/#featfetch setMinimumBrowserVersions({ chrome: 42, edge: 14, firefox: 39, firefoxIOS: 100, mobile_safari: [10, 3], opera: 29, safari: [10, 1], phantomjs: Infinity, electron: [0, 25], }, module.id);各条目含义普通浏览器chrome: 42、edge: 14、firefox: 39、opera: 29分别表示对应浏览器需达到的最低主版本号iOS 系firefoxIOS: 100、mobile_safari: [10, 3]表示最低主版本或[主版本, 次版本]组合safari: [10, 1]表示 Safari 最低 10.1phantomjs: Infinity表示 PhantomJS 永远视为 legacy 浏览器其版本永远无法达到 Infinity即永不视为 modernelectron: [0, 25]表示 Electron 最低 0.25对应其内置 Chromium 版本。由于fetch已被主流浏览器原生支持多年这些门槛通常不会影响isModern的判定结果——比起async函数等更晚出现的特性fetch的门槛要低得多因此该设置在多数场景下只是形式上的保障。与 accounts-express 的认证集成三份实现modern/legacy/server中反复出现同一段逻辑var ae Package[accounts-express]; if (ae ae.handleFetch) { return ae.handleFetch(url, options, rawFetch); } return rawFetch(url, options);它的作用是当应用同时使用了accounts-express包且该包提供了handleFetch方法时fetch包会把请求委托给accounts-express从而透明地为请求附加认证/令牌相关选项如 Bearer token 等否则退回原始实现。这一设计让业务代码无需关心认证细节即写一次请求代码认证自动生效。测试验证fetch包自带两组测试见 packages/fetch/tests/main.jsimport { Tinytest } from meteor/tinytest; Tinytest.add(fetch - sanity, function (test) { test.equal(typeof fetch, function); }); Tinytest.addAsync(fetch - asset, async function (test) { const url Meteor.absoluteUrl(/packages/local-test_fetch/tests/asset.json) const { word, times } await fetch(url).then((res) { if (!res.ok) throw res; return res.json(); }).catch(console.error) test.equal(word, oyez); test.equal(times, 3); });fetch - sanity校验fetch在测试环境中被正确导出为函数fetch - asset通过Meteor.absoluteUrl构造包内静态资源tests/asset.json的 URL用fetch请求并解析 JSON断言内容正确同时验证了fetch在真实 HTTP 请求链路下的可用性以及res.ok、res.json()等标准响应 API 的行为。这组测试被注册在 packages/fetch/package.js 的Package.onTest中依赖ecmascript、tinytest与fetch自身通过meteor test-packages fetch即可运行。使用建议与注意事项新项目一律使用fetch包发起 HTTP 请求http包仅存在于packages/deprecated/http目录中已被官方废弃客户端与服务端代码可共用同一套基于fetch的请求封装实现真正同构服务端可通过Meteor.wrapAsync将异步请求包装为同步调用以适配传统 Fiber 风格代码也可以直接使用await若不需要额外的认证自动注入现代浏览器与 Node 环境下fetch包几乎是纯转发层开销可忽略需要定制请求头的复杂场景优先使用new Headers(...)构造器以获得大小写不敏感的头部语义对 TypeScript 项目包已随附类型声明无需额外安装types包。总结fetch包是 Meteor 面向 Web 标准的现代 HTTP 解决方案现代浏览器零开销直用原生实现旧版浏览器按需加载 whatwg-fetch polyfillNode 服务端由 node-fetch 提供支持并通过accounts-express钩子实现认证透明注入。通过meteor add fetch与import { fetch } from meteor/fetch开发者即可获得跨端一致的请求体验彻底告别已废弃的http包。赞分享后端前端开发工具移动开发【免费下载链接】meteorMeteor, the JavaScript App Platform项目地址https://gitcode.com/gh_mirrors/me/meteor点击查看免费下载相关推荐node-fetch在RAP2-delos中的应用现代HTTP请求方案node fetch在RAP2 delos中的应用现代HTTP请求方案 为什么选择node fetch 在前后端分离架构中HTTP请求是连接前端与后端的核后端开发工具API设计Rivet Fetch处理器HTTP请求的状态化处理方案还在为传统HTTP服务的无状态特性而烦恼吗Rivet Fetch处理器提供了一种革命性的解决方案让HTTP请求也能享受状态化的便利 读完本文你将掌握后端AI Agent人工智能流程编排WebSocketMeteor 已弃用 HTTP 包全解析HTTP.call 跨端请求 API、参数语义、同步/异步调用与迁移到 fetchMeteor 已弃用 HTTP 包全解析HTTP.call 跨端请求 API、参数语义、同步/异步调用与迁移到 fetch HTTP 是 Meteor 框架内后端前端开发工具移动开发创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 Meteor 中的 fetch 包：同构 HTTP 请求的现代化方案
后端前端开发工具移动开发【免费下载链接】meteorMeteor, the JavaScript App Platform项目地址https://gitcode.com/gh_mirrors/me/meteor点击查看免费下载导读本文围绕 Meteor 官方fetch包展开讲解它在现代浏览器、旧版浏览器与 Node.js 三种环境下如何提供统一的 WHATWGfetch()API并给出应用与包package两种安装方式、完整调用示例及底层实现原理。读完本文你将掌握如何用meteor/fetch替代已废弃的http包完成同构 HTTP 请求并理解其 polyfill 分层、浏览器版本门槛与accounts-express认证集成机制。背景为什么需要fetch包在 Meteor 应用中发起 HTTP 请求历史上使用http包提供的HTTP.callAPI。随着 Web 标准演进http包已被官方标记为废弃其 README 明确说明This package has been deprecated in favor of the fetch package and new web standards.fetch包正是为接替http而设计对旧版legacy浏览器提供 WHATWGfetch规范的 polyfill对现代modern浏览器和Node.js直接复用运行环境自带的全局fetch实现几乎零运行时开销。它遵循同构isomorphic设计——同一份代码在客户端与服务端都能以一致的 API 发起请求是 Meteor 3 时代发起 HTTP 调用的推荐方式。安装应用与包两种方式为应用添加在应用目录下执行meteor add fetch为自定义包添加若你正在开发一个 Meteor 包在package.js的Package.onUse回调中加入api.use(fetch)Package.onUse((api) { api.use(fetch); });从 packages/fetch/package.js 可以看到fetch包自身依赖了三个核心依赖Package.onUse(function (api) { api.use(modules); api.use(modern-browsers); api.use(promise); api.mainModule(modern.js, web.browser); api.mainModule(legacy.js, legacy); api.mainModule(server.js, server); api.addAssets(fetch.d.ts, server); api.export(fetch); });关键点解读三个 mainModule 分别对应三种运行环境现代浏览器加载modern.js、旧版浏览器加载legacy.js、服务端加载server.js这构成了完整的 polyfill 分层架构下文详述api.export(fetch)让依赖方可以像使用全局函数一样引用fetch同时Headers、Request、Response等类需要通过显式导入获取依赖的 npm 包为node-fetch2.6.12与whatwg-fetch3.6.17其版本由 Meteor 官方锁定。API 与导入方式从meteor/fetch可以导入四个导出项fetch、Headers、Request、Responseimport { fetch, Headers, Request, Response } from meteor/fetch;不过大多数场景下只需要fetch与Headersimport { Meteor } from meteor/meteor; import { fetch, Headers } from meteor/fetch;TypeScript 开发者可以受益于包内置的类型声明 packages/fetch/fetch.d.tsexport declare function fetch( input: RequestInfo | URL, init?: RequestInit, ): PromiseResponse; export declare var Headers: typeof globalThis.Headers; export declare var Request: typeof globalThis.Request; export declare var Response: typeof globalThis.Response;该声明文件在 packages/fetch/package-types.json 中被注册为包的typesEntry因此import { fetch } from meteor/fetch在 TypeScript 工程中可直接获得完整类型提示。完整使用示例带认证的 POST 请求以下示例演示了发起 POST 请求、携带认证头与 JSON 请求体并通过Meteor.wrapAsync将异步函数转为同步调用在服务端 Fiber 环境中尤为常用import { Meteor } from meteor/meteor; import { fetch, Headers } from meteor/fetch; async function postData (url, data) { try { const response await fetch(url, { method: POST, // *GET, POST, PUT, DELETE, etc. mode: cors, // no-cors, *cors, same-origin cache: no-cache, // *default, no-cache, reload, force-cache, only-if-cached credentials: same-origin, // include, *same-origin, omit headers: new Headers({ Authorization: Bearer my-secret-key, Content-Type: application/json }), redirect: follow, // manual, *follow, error referrerPolicy: no-referrer, // no-referrer, *no-referrer-when-downgrade, origin, origin-when-cross-origin, same-origin, strict-origin, strict-origin-when-cross-origin, unsafe-url body: JSON.stringify(data) // body data type must match Content-Type header }); const data await response.json(); return response(null, data); } catch (err) { return response(err, null); } } const postDataCall Meteor.wrapAsync(postData); const results postDataCall(https://www.example.org/statsSubmission, { totalUsers: 55 });示例中各fetch选项的含义与可选值选项示例值可选值作用methodPOSTGET、POST、PUT、DELETE等指定 HTTP 方法modecorsno-cors、cors、same-origin控制跨域请求模式cacheno-cachedefault、no-cache、reload、force-cache、only-if-cached控制缓存策略credentialssame-origininclude、same-origin、omit控制是否携带凭据Cookieheadersnew Headers({...})Headers实例或普通对象自定义请求头redirectfollowmanual、follow、error控制重定向处理referrerPolicyno-referrerno-referrer、no-referrer-when-downgrade、origin、origin-when-cross-origin、same-origin、strict-origin、strict-origin-when-cross-origin、unsafe-url控制Referer头发送策略bodyJSON.stringify(data)字符串、FormData、Blob等请求体其类型需与Content-Type匹配提示示例中Meteor.wrapAsync是 Meteor 将 Promise 或异步函数包装为同步方法的工具适合在服务端方法或启动逻辑中使用在客户端事件处理器中直接使用await即可。底层实现三套环境的 polyfill 分层fetch包最核心的设计在于按运行环境选择实现。从源码可清晰看到这一分层现代浏览器modern.jspackages/fetch/modern.js 直接绑定全局fetch不做任何 polyfillvar rawFetch global.fetch.bind(global); function fetch(url, options) { var ae Package[accounts-express]; if (ae ae.handleFetch) { return ae.handleFetch(url, options, rawFetch); } return rawFetch(url, options); } exports.fetch fetch; exports.Headers global.Headers; exports.Request global.Request; exports.Response global.Response;现代浏览器原生支持fetch因此该文件几乎零体积——它只是把全局实现原样导出并预留了认证钩子见下文accounts-express集成。旧版浏览器legacy.jspackages/fetch/legacy.js 的第一行是require(whatwg-fetch)通过 whatwg-fetch polyfill 注入fetch、Headers、Request、Response全局实现后续逻辑与modern.js完全一致require(whatwg-fetch); var rawFetch global.fetch.bind(global); function fetch(url, options) { var ae Package[accounts-express]; if (ae ae.handleFetch) { return ae.handleFetch(url, options, rawFetch); } return rawFetch(url, options); }得益于 Meteor 的 modern/legacy 双 bundle 机制whatwg-fetch polyfill不会进入现代浏览器加载的 JS bundle旧浏览器才需要为它支付体积成本。Node.js 服务端server.jspackages/fetch/server.js 使用node-fetch作为实现并将Headers、Request、Response指向 node-fetch 提供的类const nodeFetch require(node-fetch); const rawFetch nodeFetch.default; function fetch(url, options) { var ae Package[accounts-express]; if (ae ae.handleFetch) { return ae.handleFetch(url, options, rawFetch); } return rawFetch(url, options); } exports.fetch fetch; exports.Headers nodeFetch.Headers; exports.Request nodeFetch.Request; exports.Response nodeFetch.Response;与客户端 polyfill 不同Node 端的 node-fetch 不会把fetch定义为全局函数但任何依赖fetch包的代码仍可像使用全局函数一样引用它api.export(fetch)的作用或通过import { fetch } from meteor/fetch显式导入。现代浏览器版本门槛的强制server.js在文件末尾调用了modern-browsers包的setMinimumBrowserVersions用于确定哪些浏览器属于modern从而加载零开销的原生实现而非legacy从而加载 whatwg-fetch polyfillconst { setMinimumBrowserVersions } require(meteor/modern-browsers); // https://caniuse.com/#featfetch setMinimumBrowserVersions({ chrome: 42, edge: 14, firefox: 39, firefoxIOS: 100, mobile_safari: [10, 3], opera: 29, safari: [10, 1], phantomjs: Infinity, electron: [0, 25], }, module.id);各条目含义普通浏览器chrome: 42、edge: 14、firefox: 39、opera: 29分别表示对应浏览器需达到的最低主版本号iOS 系firefoxIOS: 100、mobile_safari: [10, 3]表示最低主版本或[主版本, 次版本]组合safari: [10, 1]表示 Safari 最低 10.1phantomjs: Infinity表示 PhantomJS 永远视为 legacy 浏览器其版本永远无法达到 Infinity即永不视为 modernelectron: [0, 25]表示 Electron 最低 0.25对应其内置 Chromium 版本。由于fetch已被主流浏览器原生支持多年这些门槛通常不会影响isModern的判定结果——比起async函数等更晚出现的特性fetch的门槛要低得多因此该设置在多数场景下只是形式上的保障。与 accounts-express 的认证集成三份实现modern/legacy/server中反复出现同一段逻辑var ae Package[accounts-express]; if (ae ae.handleFetch) { return ae.handleFetch(url, options, rawFetch); } return rawFetch(url, options);它的作用是当应用同时使用了accounts-express包且该包提供了handleFetch方法时fetch包会把请求委托给accounts-express从而透明地为请求附加认证/令牌相关选项如 Bearer token 等否则退回原始实现。这一设计让业务代码无需关心认证细节即写一次请求代码认证自动生效。测试验证fetch包自带两组测试见 packages/fetch/tests/main.jsimport { Tinytest } from meteor/tinytest; Tinytest.add(fetch - sanity, function (test) { test.equal(typeof fetch, function); }); Tinytest.addAsync(fetch - asset, async function (test) { const url Meteor.absoluteUrl(/packages/local-test_fetch/tests/asset.json) const { word, times } await fetch(url).then((res) { if (!res.ok) throw res; return res.json(); }).catch(console.error) test.equal(word, oyez); test.equal(times, 3); });fetch - sanity校验fetch在测试环境中被正确导出为函数fetch - asset通过Meteor.absoluteUrl构造包内静态资源tests/asset.json的 URL用fetch请求并解析 JSON断言内容正确同时验证了fetch在真实 HTTP 请求链路下的可用性以及res.ok、res.json()等标准响应 API 的行为。这组测试被注册在 packages/fetch/package.js 的Package.onTest中依赖ecmascript、tinytest与fetch自身通过meteor test-packages fetch即可运行。使用建议与注意事项新项目一律使用fetch包发起 HTTP 请求http包仅存在于packages/deprecated/http目录中已被官方废弃客户端与服务端代码可共用同一套基于fetch的请求封装实现真正同构服务端可通过Meteor.wrapAsync将异步请求包装为同步调用以适配传统 Fiber 风格代码也可以直接使用await若不需要额外的认证自动注入现代浏览器与 Node 环境下fetch包几乎是纯转发层开销可忽略需要定制请求头的复杂场景优先使用new Headers(...)构造器以获得大小写不敏感的头部语义对 TypeScript 项目包已随附类型声明无需额外安装types包。总结fetch包是 Meteor 面向 Web 标准的现代 HTTP 解决方案现代浏览器零开销直用原生实现旧版浏览器按需加载 whatwg-fetch polyfillNode 服务端由 node-fetch 提供支持并通过accounts-express钩子实现认证透明注入。通过meteor add fetch与import { fetch } from meteor/fetch开发者即可获得跨端一致的请求体验彻底告别已废弃的http包。赞分享后端前端开发工具移动开发【免费下载链接】meteorMeteor, the JavaScript App Platform项目地址https://gitcode.com/gh_mirrors/me/meteor点击查看免费下载相关推荐node-fetch在RAP2-delos中的应用现代HTTP请求方案node fetch在RAP2 delos中的应用现代HTTP请求方案 为什么选择node fetch 在前后端分离架构中HTTP请求是连接前端与后端的核后端开发工具API设计Rivet Fetch处理器HTTP请求的状态化处理方案还在为传统HTTP服务的无状态特性而烦恼吗Rivet Fetch处理器提供了一种革命性的解决方案让HTTP请求也能享受状态化的便利 读完本文你将掌握后端AI Agent人工智能流程编排WebSocketMeteor 已弃用 HTTP 包全解析HTTP.call 跨端请求 API、参数语义、同步/异步调用与迁移到 fetchMeteor 已弃用 HTTP 包全解析HTTP.call 跨端请求 API、参数语义、同步/异步调用与迁移到 fetch HTTP 是 Meteor 框架内后端前端开发工具移动开发创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考