Web开发者助手 FeHelper

写在前面

确实有不少网友希望FeHelper能出一个Firefox版本，昨晚上抽了点儿时间倒腾了下，绝大部分常用功能，在Firefox下还是可以很好的work起来的！针对兼容性不太好&不太常用的功能，在配置项中已直接禁用掉，具体看下面的图。

Firefox add-ons

官网下载地址：https://addons.mozilla.org/zh-CN/firefox/addon/web%E5%89%8D%E7%AB%AF%E5%8A%A9%E6%89%8B-fehelper

如下图：

安装后的样子

今天收拾电脑，发现有个以前开发Firefox插件时候写的类库----用Javascript实现文件下载。

放到博客上，给自己沉淀一下，以后还会用得上：

var Baidufe = window.Baidufe || {};
 
/**
 * 处理网络文件的操作，如下载等
 * @author 赵先烈
 */
Baidufe.FileNetwork = function(){};
 
/**
 * 获取默认的本地目录
 */
Baidufe.FileNetwork.getDefaultDiretory = function(){
    var file = Components.classes["@mozilla.org/file/directory_service;1"]
                .getService(Components.interfaces.nsIProperties)
                .get("Home",Components.interfaces.nsIFile);
     
    return file.path;
};
 
/**
 * 选择一个本地存储的目录
 */
Baidufe.FileNetwork.selectDirectory = function(){
    const nsIFilePicker = Components.interfaces.nsIFilePicker;
    var fp = Components.classes["@mozilla.org/filepicker;1"].createInstance(nsIFilePicker);
    fp.init(window,"",nsIFilePicker.modeGetFolder);
    var result = fp.show();
    if(result == nsIFilePicker.returnOK) {
        return fp.file.path;
    } else {
        return null;
    }
};
 
/**
 * 下载文件到本地
 * @param {Object} config   下载参数，格式为：
 * {
 *      uri : "",文件源地址
 *      dir : "" , //本地存储目录
 *      callback : function(file,fileName){}, //下载完成的回调
 *      fileName : ""   //文件名
 * }
 */
Baidufe.FileNetwork.downLoadFile = function(config){
    var ios = Components.classes["@mozilla.org/network/io-service;1"].getService(Components.interfaces.nsIIOService);
    var fileURI = ios.newURI(config.uri, null, null); 
    var channel = ios.newChannelFromURI(fileURI); 
    var observer = {
        onStreamComplete: function(loader, context, status, length, result){
            var file = Components.classes["@mozilla.org/file/local;1"].createInstance(Components.interfaces.nsILocalFile);
            file.initWithPath(config.dir);
            if( !file.exists() || !file.isDirectory() ) { // if it doesn't exist, create
                file.create(Components.interfaces.nsIFile.DIRECTORY_TYPE, 0777);
            }
            file.appendRelativePath(config.fileName);
            var stream = Components.classes["@mozilla.org/network/safe-file-output-stream;1"].createInstance(Components.interfaces.nsIFileOutputStream);
            stream.init(file, -1, -1, 0);
            var bstream = Components.classes["@mozilla.org/binaryoutputstream;1"].createInstance(Components.interfaces.nsIBinaryOutputStream);
            bstream.setOutputStream(stream);
            bstream.writeByteArray(result, length);
            if (stream instanceof Components.interfaces.nsISafeOutputStream) {
                stream.finish();
            } else {
                stream.close();
            }
            if (typeof config.callback == "function") {
                config.callback(file, config.fileName);
            }
        }
    };
    var streamLoader = Components.classes["@mozilla.org/network/stream-loader;1"].createInstance(Components.interfaces.nsIStreamLoader);
    streamLoader.init(observer);
    channel.asyncOpen(streamLoader, channel);
};

Firefox倒腾的Firefox OS1.0版本出炉了，windows pc / mac 用户，可以直接在Firefox浏览器中安装插件”Firefox OS Simulator“尝鲜。

插件安装地址：

安装完成后，运行插件，在dashboard中Running即可，确实挺炫的。

对于咱们Coder来说，更关心的，应该是如何在这个OS上开发App。

不过Firefox OS主打HTML5，所以，应该不难想象，fOS的App，也就是咱们FE的专长了：HTML5+CSS3+Javascript

不过这个OS后面发展如何，就拭目以待了！