如何在 RxJS 中实现时间到期热可观察(或在响应式扩展中通用)

2024-03-23

我想用 RxJs 实现时间过期缓存。这是“正常”缓存的示例:

//let this represents "heavy duty job"
var data = Rx.Observable.return(Math.random() * 1000).delay(2000);

//and we want to cache result
var cachedData = new Rx.AsyncSubject();
data.subscribe(cachedData);

cachedData.subscribe(function(data){
    //after 2 seconds, result is here and data is cached
    //next subscribe returns immediately data
    cachedData.subscribe(function(data2){ /*this is "instant"*/ });
});

When subscribe on cachedData第一次调用,调用“重载作业”,2秒后结果保存在cachedData (AsyncSubject)。任何其他后续subscribe on cachedData立即返回保存的结果(因此缓存实现)。

我想要实现的是在一段时间内“调味”cachedData是有效的,当时间过去后,我想重新运行新数据的“重型作业”,并在新的时间段再次缓存它,等等......

期望的行为:

//pseudo code
cachedData.youShouldExpireInXSeconds(10);


//let's assume that all code is sequential from here

//this is 1.st run
cachedData.subscribe(function (data) {
    //this first subscription actually runs "heavy duty job", and
    //after 2 seconds first result data is here
});

//this is 2.nd run, just after 1.st run finished
cachedData.subscribe(function (data) {
    //this result is cached
});

//15 seconds later
// cacheData should expired
cachedData.subscribe(function (data) {
    //i'm expecting same behaviour as it was 1.st run:
    // - this runs new "heavy duty job"
    // - and after 2 seconds we got new data result
});


//....
//etc

我是 Rx(Js) 的新手,无法弄清楚如何通过冷却来实现这个热可观察值。


您所缺少的只是安排一个任务来取代您的cachedData与一个新的AsyncSubject一段时间后。以下是如何作为新人进行操作Rx.Observable method:

Rx.Observable.prototype.cacheWithExpiration = function(expirationMs, scheduler) {
    var source = this,
        cachedData = undefined;

    // Use timeout scheduler if scheduler not supplied
    scheduler = scheduler || Rx.Scheduler.timeout;

    return Rx.Observable.create(function (observer) {

        if (!cachedData) {
            // The data is not cached.
            // create a subject to hold the result
            cachedData = new Rx.AsyncSubject();

            // subscribe to the query
            source.subscribe(cachedData);

            // when the query completes, start a timer which will expire the cache
            cachedData.subscribe(function () {
                scheduler.scheduleWithRelative(expirationMs, function () {
                    // clear the cache
                    cachedData = undefined;
                });
            });
        }

        // subscribe the observer to the cached data
        return cachedData.subscribe(observer);
    });
};

Usage:

// a *cold* observable the issues a slow query each time it is subscribed
var data = Rx.Observable.return(42).delay(5000);

// the cached query
var cachedData = data.cacheWithExpiration(15000);

// first observer must wait
cachedData.subscribe();

// wait 3 seconds

// second observer gets result instantly
cachedData.subscribe();

// wait 15 seconds

// observer must wait again
cachedData.subscribe();
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何在 RxJS 中实现时间到期热可观察(或在响应式扩展中通用) 的相关文章

  • 如何将默认文本添加到 html 文本区域的开头?

    我正在建立一个个人的小型社交网络 作为设计的一部分 所有状态都应以不应更改的默认文本开始 类似于 嗨 我的名字是 然后用户完成其余的操作 有点像不会消失的 HTML5 占位符 实现这一目标的最佳方法是什么 请参考这个fiddle http
  • Chrome 扩展程序:如何根据网址使图标变灰?

    chrome 是否有一个 api 可以禁用 从而灰显 某些 url 上的 chrome 扩展 或者我只需要有一个 if 语句来检查 url 并相应地切换图标 你可以使用chrome declarativeContent https deve
  • 如何在 Angular JS 中显示以字节数组形式接收的图像

    我有一个将返回图像的服务器端应用程序 这些是响应标头 Content Disposition attachment filename 8822a009 944e 43f4 999b d297198d302a 1 0 low res Cont
  • React-Native 博览会 POST Blob

    我正在使用 React Native 和 expo 并尝试通过 fetch api 发布 blob 图像 我对正文使用表单数据格式 并且我有下一个代码 const blob await response blob const form ne
  • 调整表格上的列宽

    目前 如果表格的宽度不大于容器的宽度 我可以调整表格列的大小 我希望发生的是在调整列大小时表格的宽度增加 以便滚动条出现在表格下方 基本上允许我调整大小而不受容器宽度的限制 这是一个小提琴 https jsfiddle net thatOn
  • Flask:缓存静态文件(.js、.css)

    我真的找不到任何这方面的资源 那么如何将视图 函数的缓存与静态文件 即 css js 分开 我想将静态对象缓存一周 另一方面 我只需要缓存函数 视图几分钟 当我执行以下操作时 from flask ext cache import Cach
  • 现在 JavaScript 的无限循环会导致浏览器崩溃吗?

    我正在学习 JavaScript 对编程很陌生 碰巧遇到了这些无限循环 据说这些循环会永远持续下去并使浏览器崩溃 但是当我用这些代码创建一个循环时 i 0 while i lt 10 document write i 浏览器只是继续加载它
  • (无限?)JavaScript 代码中的循环

    我有以下 JavaScript 代码来在网站上 显示 XML function createChild node tabindex var child node childNodes var r var tabs for i 0 i
  • antd上传控件需要action函数,但我不需要它

    我正在使用 ant design 组件 并且有一个上传输入 https ant design components upload https ant design components upload 根据文档 需要对道具进行操作 但是 我不
  • 当 querySelectorAll 在不使用库的情况下不可用时,按属性获取元素?

    p 你怎样才能做到相当于 document querySelectorAll data foo where 查询选择器全部 https developer mozilla org en DOM Document querySelectorA
  • 如何从 angularJS 模板调用encodeURIComponent?

    我的 Angular JS 模板中有一个块 a href foos foo id foo name a 但是 foo id 属性有时可能包含时髦字符 我想做这样的事情 a href foos encodeURIComponent foo i
  • 计算网站上多个文件的下载次数的最佳方法[关闭]

    Closed 这个问题需要多问focused help closed questions 目前不接受答案 问题是 计算网站上多个文件的下载次数的最佳方法 我正在尝试做的事情 跟踪并统计多个文件的下载数量 对于具有不同扩展名的文件 foo z
  • 现已弃用使用 Google Places API 获取多种类型

    谷歌最近宣布 自 2016 年 2 月 16 日起 types 参数已被弃用 取而代之的是新的类型参数 每个搜索请求仅支持一种类型 我的问题是 现在有什么方法 不使用已弃用的参数 从单个 API 调用中获取多个地点类型吗 谢谢 None
  • Nodejs Base64 中的读取文件

    我正在尝试从客户端读取以 base64 编码的图像 如何使用nodejs进行阅读 My code add to buffer base64 image var encondedImage new Buffer image name base
  • 通过 javascript 将 onsubmit 添加到表单

    您将如何仅通过 Javascript 将 OnSubmit 属性插入到表单中 我对 javascript 还很陌生 所以如果您能够提供详细的示例代码 那将是最有帮助的 情况是这样的 我通过 Chargify 支付平台 使用托管注册页面来处理
  • Firefox 扩展中的 localStorage

    我正在尝试从 Firefox 扩展访问页面的 localStorage 我的理解是content给出了参考window当前页面的 当我尝试访问页面的 localStorage 时content localStorage 我想我正在得到它的参
  • 来自 geoJSON 的 Google 地图航点

    我想从 geoJSON 文件加载行程 目前来说 它是有效的 但只有两点 但我需要添加 4 或 5 个航路点 我的代码只读取前两个点并将它们设置为起点和目的地 这是我的代码 google maps event addListener map
  • 所有人共享的 First Load JS 在 next.js 中相当重

    I have a project on Next js framework and the problem is that First Load JS shared by all pages is rather heavy I want t
  • 让 hashchange 事件在所有浏览器(包括 IE7)中工作

    我有一些代码 由另一位开发人员编写 在 WordPress 内部进行 AJAX 页面加载 例如 没有页面重新加载 当您单击导航项时 AJAX 会刷新主要内容区域 我的问题是它在 IE7 中被破坏了 我不知道从哪里开始调试 最初的开场白是 v
  • 用圆形雷达数学方法表示点

    我正在编写一个简单的应用程序 它可以向您显示您周围的朋友 但不是在法线地图中 而是在像 UI 这样的真正圆形雷达上 https i stack imgur com Au3IP png https i stack imgur com Au3I

随机推荐