Changes to DOM {: .doctitle}
<input type=”file”>
HTML5 does provided limited support for file dialogs with <input type="file" />
element, such as multiple
, accept
and webkitdirectory
. NW.js extended the file input to better support native apps.
Note
NW.js extended features are only enabled in Node frames for security reasons. See Security in NW.js for the differences of Node and normal frame.
fileinput.value
The property contains native path of the local file.
For example, you can read the file selected by user with Node.js API:
// Get the native path of the file selected by user
var fileinput = document.querySelector('input[type=file]');
var path = fileinput.value;
// Read file with Node.js API
var fs = nw.require('fs');
fs.readFile(path, 'utf8', function(err, txt) {
if (err) {
console.error(err);
return;
}
console.log(txt);
});
fileitem.path
HTML5 provides a files
attribute to return all files selected in a <input>
tag. NW.js provided an extra property fileitem.path
to each file item in files
, which is the native path of the selected file.
var fileinput = document.querySelector('input[type=file]');
var files = fileinput.files;
for (var i = 0; i < files.length; ++i) {
console.log(files[i].path);
}
Attribute: nwdirectory
nwdirectory
is a bit similar to webkitdirectory
, but it returns the path of directory instead of returning files in it.
For example:
<input type="file" nwdirectory>
Attribute: nwdirectorydesc
Set the description of the title in the file dialog for nwdirectory
. Default is Select Folder
.
Attribute: nwsaveas
nwsaveas
will open a ‘Save as’ dialog, which lets user enter the path of a file. It’s possible to select a non-existing file, which is different from the default file input tag.
For example:
<input type="file" nwsaveas>
And you can specify a value for the default file name to save:
<input type="file" nwsaveas="filename.txt">
Attribute: nwworkingdir
With nwworkingdir
, the file dialog starts in the given directory when the element is activated.
For example, following code enables the file dialog opening in /home/path/
by default:
<input type="file" nwworkingdir="/home/path/">
oncancel
event
This event is fired after user cancels the file dialog.
<iframe>
NW.js extended <iframe>
tag for easier developing native apps. Thoses features enables apps to bypass the restrictions of Sandbox and Same Origin Policy etc.
See also webview Tag for the new <webview>
tag.
Attribute: nwdisable
Make the frame and subframes normal frames.
Note
This attribute doesn’t prevent the page in normal frames accessing its parent and top frames. Then they can still get access to Node.js APIs. So usually you may want to use this attribute with nwfaketop
togather.
Attribute: nwfaketop
Prevent web page in the frame accessing the real window.parent
or window.top
. They will get the faked parent and top, which is its own window
object of the frame. Subframes will also be affected.
This attribute is usually used with nwdisable
.
Attribute: nwUserAgent
Override the default user-agent when loading the web page in the frame and sub frames. See user-agent
in manifest for details.
webview tag
added some methods to webview tag