NW.js中node-main如何阻塞index.html加载

LiesAuer

发布于 2023-09-14 08:13:58

1930

发布于 2023-09-14 08:13:58

文章被收录于专栏：LiesAuer's BlogLiesAuer's Blog

在实际的NW.js程序开发中，我们可能在程序启动时做一些加载前逻辑，比如更新等等，那如何实现等待这些逻辑完成后才开始加载index.html呢？

bootstrap.html

准备一个App启动页bootstrap.html，并在package.json中的main入口指向bootstrap.html，不再指向index.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>启动中</title>
</head>
<body>
    <p>启动中...</p>
</body>
</html>

bootstrap.js

package.json中的node-main入口指向bootstrap.js，这是在Node上下文中执行的启动逻辑，等待逻辑完成后我们就可以主动跳转到index.html。

// 启动逻辑

const main = nw.Window.get();

// 注意
// 此时可能启动页都还没有加载，此时的网址为“about:blank”，需要定时器判断是否已经加载了启动页才能开始跳转
// 否则可能会出现这种情况：about:blank -> /index.html -> /bootstrap.html
main.window.location.href='/index.html';

这样子我们就能实现“阻塞”index.html的加载了。

本文参与腾讯云自媒体分享计划，分享自作者个人站点/博客。

如有侵权请联系 cloudcommunity@tencent.com 删除

bootstrap