如何解决什么是 Rails 6 加载网络工作者的方式?
我正在使用带有 webpacker 的标准 Rails 6 设置。我正在为 JavaScript 使用 Stimulus,但这并不重要。
对于我的应用程序,我有一个计时器,即使浏览器选项卡未处于活动状态,它也需要继续运行。由于 setInterval
似乎可以在选项卡未处于活动状态时停止,因此我已深入编写网络工作者。我已阅读 this question,但它的解决方案似乎不适合现代 Rails。
我希望我可以通过我的 Stimulus 控制器来处理这一切,但我的理解是 web worker 文件需要分开,所以我想弄清楚如何正确加载它。
我为工作人员创建了一个文件,timer.js
。我应该把这个文件放在哪里,我怎样才能引用它的 URL 来启动它?
- 我需要能够在我的一个视图 ERB 文件中呈现其 URL,以便我可以将其 URL 传递给 Stimulus 控制器,然后使用
new Worker(theUrl)
启动工作程序。但是,<%= javascript_path(...) %>
似乎仅适用于资产管道。 - 我想在我的工作文件中使用
import Rails from "@rails/ujs"
以便我可以使用它轻松地发出 AJAX POST 请求,所以我假设工作文件需要以某种方式与 webpack 绑定。
目前我只是把它放在 public/timer.js
,但我在加载时在浏览器控制台中出现错误,所以我认为我做错了:
SyntaxError: import declarations may only appear at top level of a module
在 Rails 6 中加载网络工作者的正确方法是什么?
timer.js
这是工作文件的内容,以防万一。 (我知道这很粗糙;这只是草稿。)
import Rails from "@rails/ujs";
let timerInterval = null;
let timeRemaining = null;
let postFailures = 0;
let postUrl = null;
function finishActivity() {
Rails.ajax({
type: "POST",url: postUrl,success: () => {
postFailures = 0;
},error: () => {
postFailures++;
if (postFailures < 5) {
setTimeout(finishActivity,1000);
} else {
alert("Error.");
}
},});
}
self.addEventListener("message",(event) => {
if (event.data.timeRemaining) {
timeRemaining = event.data.timeRemaining;
if (timerInterval) clearInterval(timerInterval);
timerInterval = setInterval(() => {
if (timeRemaining > 0) {
timeRemaining = timeRemaining - 0.01;
postMessage({ timeRemaining: timeRemaining });
} else {
timerInterval = null;
clearInterval(timerInterval);
finishActivity();
}
},10);
}
if (event.data.postUrl) {
postUrl = event.data.postUrl;
}
},false);
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。