A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

在刚刚发布的 2018 JavaScript 现状调查报告中,可能有人注意到里面提到了一个新的 Headful Node 应用框架 —— Carlo 。Carlo 是 Google Labs 近日推出的一个开源项目,官方将其描述为 “ Node 应用 Web 渲染界面”。
Carlo 为 Node 应用提供 Chrome 渲染功能,使用 Puppeteer 项目与本地安装的浏览器实例进行通信,并实现远程调用基础架构,以便在 Node 和 Chrome 之间进行通信。

不同于 Electron 和 NW.js ,Carlo 并不会尝试将特定版本的 Chrome 和 Node.js 打包在一起,而是依赖于用户电脑上已安装的任意版本的 Chrome ,该项目的动机之一是演示本地安装的浏览器如何与开箱即用的 Node 一起使用。此外,Carlo 会分离 Node v8 和 Chrome v8 引擎,提供可维护的 model ,能够独立更新底层组件。
Carlo 并不提供构建真正桌面应用的功能,像是修改应用图标或自定义菜单,Carlo 更专注于生产力和 Web/Node 的互操作性。不过,你也可以使用 pkg 将 Carlo 应用打包到可执行二进制文件中。
示例 - 显示本地环境
Save file as example.js

[JavaScript] 纯文本查看 复制代码
const
 carlo 
=
 
require
(
'carlo'
);
(
async 
()
 
=>
 
{
  
// Launch the browser.
  
const
 app 
=
 await carlo
.
launch
();
  
// Terminate Node.js process on app window closing.
  app
.
on
(
'exit'
,
 
()
 
=>
 process
.
exit
());
  
// Tell carlo where your web files are located.
  app
.
serveFolder
(
__dirname
);
  
// Expose 'env' function in the web environment.
  await app
.
exposeFunction
(
'env'
,
 _ 
=>
 process
.
env
);
  
// Navigate to the main page of your app.
  await app
.
load
(
'example.html'
);
})();

Save file as example.html
[JavaScript] 纯文本查看 复制代码
<script>
async 
function
 run
()
 
{
  
// Call the function that was exposed in Node.
  
const
 data 
=
 await env
();
  
for
 
(
const
 type in data
)
 
{
    
const
 div 
=
 document
.
createElement
(
'div'
);
    div
.
textContent 
=
 
`
$
{
type
}:
 $
{
data
[
type
]}`;
    document
.
body
.
appendChild
(
div
);
  
}
}
</script>
<body
 
onload
=
"
run
()
"
>
运行应用
  • node example.js



点击有惊喜

0 个回复

您需要登录后才可以回帖 登录 | 加入黑马