4

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

 9 months ago
source link: https://www.liesauer.net/blog/post/how-to-block-index-html-loading-with-node-main-in-nw-js.html
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
neoserver,ios ssh client

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

bootstrap.html

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



  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1">
  6. <title>启动中</title>
  7. </head>
  8. <body>
  9. <p>启动中...</p>
  10. </body>
  11. </html>

bootstrap.js

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



  1. // 启动逻辑
  2. const main = nw.Window.get();
  3. // 注意
  4. // 此时可能启动页都还没有加载,此时的网址为“about:blank”,需要定时器判断是否已经加载了启动页才能开始跳转
  5. // 否则可能会出现这种情况:about:blank -> /index.html -> /bootstrap.html
  6. main.window.location.href='/index.html';

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


About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK