nw.js如何处理拖放操作 其实拖放(drag-drop)操作是Html5的功能,不是nw.js的内置API,那么我们采用Html5应用一般的处理方法就可以了。...nw.js会按照chrome浏览器默认处理文件的方式来处理拖放的文件,能显示的会直接显示,不能显示的会变成资源下载。 这肯定不是桌面应用想要的效果,那么Html5是如何处理拖放的呢?
NW.js的用途 NW.js 基于 Chromium 和 Node.js,从而可以在桌面app中使用浏览器开发技术并直接调用 Node.js 资源,甚至将一个web应用打包到本地也轻而易举。...安装NW.js 可以从官网下载; 推荐在开发时下载是sdk版,以使用DevTools 非sdk版也应同时下载,在发布时使用 写一个 Hello World!...title> Hello NWJS~ == 右键单击可看到菜单 == //此处演示调用`NW.js...sdk版程序包的.zip文件”所在的目录,填入"Download location",并且不勾选"SDK build"选项 点击右下角的Export按钮,即可发布,默认路径是output mac下的dmg安装包制作参考...http://www.macx.cn/thread-2099005-1-1.html windows安装包参考 http://www.aichengxu.com/diannao/4906106.htm
默认情况下,nw.js发布的nw.exe文件请求的是普通权限,当我们的应用需要访问一些特殊目录或者注册表等,就需要程序启动的时候以管理员权限运行。...首先我们找一款使用nw.js开发的软件,这里我推荐AxeSlide,首先去下载软件,安装。...如果我们软件安装之后,使用的是非Administrator用户登录的话,启动软件的时候,就会弹出UAC提升框,提醒我们该软件请求以管理员身份运行,是否同意。那么AxeSlide是如何做到的呢?
nw.js就是使HTML, CSS, JavaScript写的原本在浏览器上运行的程序,也可以在桌面端运行。...image nw的安装与使用 下载安装包安装(建议大家下载带有开发包的 便于调试) 官网下载nw.app的压缩包 解压以后即可使用 附官网地址: https://github.com.../nwjs/nw.js 效果图: image image 使用命令行安装 (命令行下载比较慢 所以不是特别建议) sudo npm install -g nw nw的打包流程...$ npm install && npm start 项目截图 image image electron的安装与打包工具的安装 全局安装electron...从license上来看,Electron是Github的,NW.js则是Intel。 nw 在mac上只能构建mac的应用 ,windows下只能构建windows的。
在实际的NW.js程序开发中,我们可能在程序启动时做一些加载前逻辑,比如更新等等,那如何实现等待这些逻辑完成后才开始加载index.html呢?
[I] 概述 - NW.js原生界面(Native UI)APIs 要构建一个像样的桌面应用,除了由NodeJS处理底层功能,以及由Webkit来应付窗口GUI外,还需要诸如操作窗口、访问剪贴板或隐藏到系统托盘区等和系统图形界面交互的能力...而前面提到的两者,要么无法访问GUI,要么受限于API边界,均无法提供 NW.js Native UI APIs 则在其他JS层的顶部提供了这些完整的功能 1.1 获取nw实例 旧版本中可以用 var...App API - 应用的核心 2.1 打开关联类型的文件 NW.js应用有多种办法打开文件,此处谈论的是打开关联的文件类型;也就是说如果我们开发一个文本编辑器,那么我们希望在系统中右键单击一个txt文件出现的...Window API - 操作NW.js窗口 在NW.js中,Window API 只不过是对DOM中window对象的一层包装,很多(并非所有)方法和属性继承了后者的用法,同时window对象也是 Node.js...在NW.js里,同样的操作只是传递文件路径字符串而已,而非拷贝其内容;同时一些浏览器中的安全限制被解除,并赋予其一些增强的能力,从而使用户体验更接近原生应用
中仅保存极少量信息且会过期),数据持久化(Data Persistence)是本地应用开发中的常见需求,通俗的讲就是将瞬时数据(比如内存中的数据,断电即失效)保存为持久数据(比如写入数据库中长久保存); 由于NW.js...直接存储数据到本地文件 正如之前的文章提到过的,NW.js提供了App.dataPath来访问系统的应用数据目录, 可以利用其方便的存储应用配置文件等 不同平台上的具体指向: Win: $LOCALAPPDATA...) }); db.get('mittens').then(function (doc) { return db.remove(doc); }); https://github.com/nwjs/nw.js
Node.js常用来构建高并发的C/S应用,将这种模式移植到NW.js程序中虽然可行且费不了什么功夫,但仅仅这样做并不能发挥出平台所有的潜力;要知道NW.js允许直接在DOM中和Node.js交互,而这将大大加快程序的运行和简化开发...模块 内部模块 var fs = require('fs') 第三方模块 npm install 之后 var _ = require('underscore') C/C++ 模块 global对象 NW.js...process也是一个在窗口中和Node.js上下文中都可以访问到的全局对象 除了可以访问固有的 process.env.HOME 得到主目录等,还添加了如下属性: process.version['NW.js
包大小较大:由于Flutter应用需要打包Dart运行时和Flutter框架,导致应用的安装包大小较大。...另外,由于需要打包JavaScript引擎和React Native框架,导致应用的安装包大小较大,且内存占用较高。...包体积大,内存占用高:由于需要打包JavaScript引擎和React Native框架,导致应用的安装包大小较大,且内存占用较高。...包体积较大:由于需要打包 Qt 库和应用程序代码,Qt 应用程序的安装包大小可能较大。...包大小:相比其他框架,Tauri 应用程序的包大小相对较小,这有助于减少应用程序的安装包大小。
说到 node.js 的 GUI 开发方案,首先想到的就是 electron 和 nw.js。但除了它们之外,是否存在其它更轻量级的技术方案可供选择呢?...工具的源码已经丢失,现在用的电脑里也没有再安装 winform 相关的开发环境。于是决定使用 node.js 重写工具。...在这个基础上,再加上个方便操作的 GUI 就好了,于是首先想到的方案自然就是 electron 或者 nw.js。...但在我的 Windows 环境下似乎水土不服,安装失败(貌似是需要 MSVC++ 而不是 VS2013 的缘故)。...发现挺方便的,安装完 Python 就能使用,但能实现的效果似乎很有限;PyQt 更强大、美观,但需要花时间去学习 QT,没法现在就立刻动手做。
1、下载nw.js https://nwjs.io/ 最好下载sdk版本。 2、解压打开安装包 下载完之后,解压打开 图中的app文件夹是我自己创建的,你也需要自己创建一个,里面放你项目文件。...下载链接打开它,选中app.exe然后将你刚才下好的nw.js里原始文件(除去你自己生成和创建的文件或文件夹)。
2 nw.js工具 nwjs官网下载 nw.js的github地址 nw.js的使用流程: 测试可用 解压下载包后,双击nw.exe,可以正常启动,则说明可以使用node-webkit。...当然也可以写简单点,如下: "name": "index-demo", "main": "index.html", //入口 文件准备 把上面的 index.html 和 package.json 放置到 nw.js...在官网下载Enigma Virtual Box,然后傻瓜式安装下; (1)导入项目exe文件 (2)选择输出路径 (3)添加default文件夹 (4)添加nwjs文件 (5)点击process...参考文章: 让HTML网页变成一个exe执行程序(node-webkit或HTMLRunExe或hta) NW.js构建桌面应用
1、下载nw.js https://nwjs.io/ 最好下载sdk版本。 2、解压打开安装包 下载完之后,解压打开 图中的「app文件夹」是我自己创建的,你也需要自己创建一个,里面放你项目文件。...下载链接打开它,选中「app.exe」然后将你刚才下好的nw.js里原始文件(除去你自己生成和创建的文件或文件夹)。
---- 一、使用 NW.js 打包 NW.js基于Chromium和Node.js。它允许您直接从浏览器调用Node.js代码和模块,并在应用程序中使用Web技术。...官网:NW.js 官网 优点:免开发、门槛低、体积小 1.1 下载、解压 NW.js 1.1.1 下载 NW.js 进入 NW.js 官网,点击下载最新版,如下图所示。...1.1.2 解压 NW.js 接着我们将压缩包解压到指定目录,解压成功后如下图所示。...2.2.2 安装依赖、编译项目 若你的电脑没有配置 node.js 和 Vue 脚手架,或者不知道如何安装 VsCode,可以移步 Vue 环境配置讲解。...安装完成后,界面如下图所示。 接着使用 npm run build 命令,生成编译文件,编译成功后如下图所示。
同样基于 Chromium + Node.js 的,还有 NW.js,我们先来看看它们之间有什么不一样吧。...Electron 与 NW.js说到 Node.js 的桌面应用,基本上大家都会知道 Electron 和 NW.js。...例如 VsCode 就是基于 Electron 写的,而小程序开发工具则是基于 NW.js 来开发的。...那么,Electron 和 NW.js 都分别是怎样管理 Node.js 和 Chromium 的呢?NW.js 内部架构NW.js 是最早的 Node.js 桌面应用框架,架构如图1。...在 NW.js 中,将 Node.js 和 Chromium 整合在一起使用,其中做了几件事情,我们来分别看下。
它的优势是可以复用系统当中已存在的webview2二进制资源, 也就是说它虽然封了一个Chromium浏览器核心,但如果你可以确定客户电脑已经存在了基于webview2开发的应用,你的安装包体积可以足够小...https://zhuanlan.zhihu.com/p/428560381 webview https://github.com/webview/webview 这个库使用操作系统的浏览器引擎来达到减小安装包体积的问题...TAURI https://tauri.studio/ 采用的技术方案与webview类似,所以安装包也足够小,非常新,还没发布稳定版,开源免费。...webview框架碰到的问题TAURI都有, 使用Rust开发,将来会支持Deno,作者说将来会直接使用webview的技术来支持多平台, NW.js https://nwjs.io/ NW.js最早把...NW.js基于MIT开源,可以无忧使用。 微信小程序开发工具是用NW.js开发的。作者是英特尔的员工,英特尔的一些工具也是用NW.js开发的。
找了一圈发现NW.js挺容易上手,分享给大家。...NW.js 官网https://nwjs.io/ 1.下载适合当前版本的js 【这里下载的SDK版本,方便后续调试】 2.解压到本地 3.构建自己的project index.html...4.把项目放到nw.js解压后的同一目录下 5.命令进入到当前文件夹 输入 nw myapp 也可以直接把项目拖到nw.exe 6.将应用打包成app.nw文件,进入myapp文件夹中
桌面应用程序具有更广泛的功能,并且由于用户显式地下载、安装和打开应用程序,所以对它们所能做的限制更少。然而,当你在浏览网页时,您正在执行没有选择安装在计算机上的代码。...用户显式地下载和安装Electron应用程序,就像任何其他本机应用程序一样。您可以像任何本机桌面应用程序或服务器端Node进程那样自由地访问文件系统。...NW.js Electron与另一个名为NW.js(以前称为node-webkit)的项目类似。这两者有很多共同之处。...表1.1 Electron和NW.js之间的主要区别的比较 Electron NW.js 平台 支持官方最新的Chromium版本 Chromium分支版本 进程模型 分离进程模型 共享Node进程...电子还包括自动下载更新和错误崩溃上报,NW.js不支持。 NW.js应用程序从HTML页面启动,每个浏览器窗口共享一个Node 进程。如果打开多个窗口,它们都共享同一个Node进程。
经过笔者的查找发现确实存在这个一样框架,那就是nw.js这个框架。这个框架使用了谷歌浏览器的内核,而该框架的其中一个功能就是可以直接在前端页面中调用node.js代码。...到这里我们就可以还原一个猜测可行的漏洞利用链如下:1.某个漏洞扫描器使用nw.js框架来显示应用的页面。2.该漏洞扫描器通过x-powered-by这个头部来获取扫描目标的版本信息。...3.该漏洞扫描器在某个页面中将获取到的版本信息未经过滤及其他处理直接显示在nw.js框架编写的页面中。...4.由于nw.js框架编写的页面会直接触发xss,导致xss payload中的onerror方法触发,加载远程的node.js代码。...5.由于nw.js框架中可以直接执行node.js对应的代码,导致node.js代码直接执行。6.node.js代码下载恶意文件在主机上获取敏感信息用于溯源攻击者。
安装工具和依赖模块 下载微信小程序开发者工具 开发者工具是用 NW.js 模拟的环境,在微信中,则是 JavascriptCore 环境。 不过不用担心, 只是两个不同的 VM,本质是一样的。...NW.js 可能存在一些小 bug,写代码的时候注意一下就好。 用 npm 命令开始一个微信小程序项目 开始安装必要的依赖模块 由于除了小程序运行时需要的模块,还有构建所需要的模块。...接下来,我们安装打包工具 webpack: 我们只需要对代码进行打包,不需要 dev server 和 hot module replace 功能。...因此,我们只需要安装 webpack module 本身即可,无需安装其他扩展和插件。...接下来,我们来安装 Redux: 需要注意的是,由于在实际应用中,我们经常会需要异步调用 API 服务器的接口,因此我们还需要 redux-thunk 这个模块,来处理异步行为。
领取专属 10元无门槛券
手把手带您无忧上云