atom实现上传JSON数据，获取服务器生成文件并下载到本地。

最新推荐文章于 2024-09-10 08:38:12 发布

原创最新推荐文章于 2024-09-10 08:38:12 发布 · 354 阅读

0 ·

CC 4.0 BY-SA版权

转载必须得到本人许可，未经允许，不得转载

文章标签：

#atom #插件 #下载文件

本文介绍如何在Atom编辑器中通过GET请求从服务器下载Word文档，并保存到本地。涉及electron、http和fs模块的使用，包括弹出保存对话框、处理二进制文件及Base64编码。

综述：

使用atom，向服务器发送get请求。生成文件，下载到本地。

先看源码

function getDocxFromServer(documentTrees, modalPanel){

    const { dialog } = require('electron').remote;
    let savePath = dialog.showSaveDialog({filters:[{name:'Word', extensions:['docx']}]});
    // 如果已经存在了，会被提示的是否覆盖的。
    console.log(savePath);
    console.log("showOpenDialogEnd");
    if (savePath == undefined){
        return;
    }
    if(savePath.split(".").length == 1){
        // 用户没有添加后缀
        savePath = savePath + ".docx";
    }

    console.log(savePath);
    let suffix = savePath.split(".")[savePath.split(".").length - 1];
    if (suffix !== "docx"){
        console.log(suffix + "   不是docx文件");
        return;
    }

    let http = require('http');
    let postData = JSON.stringify({
        massage:{
            userName: "userName",
            fileSuffix: suffix,
        },
        data: documentTrees
    });

    let options = {
      hostname: 'localhost',
      port: 8080,
      path: '/getDocx',
      method: 'GET',
      headers: {
        'Content-Type': 'application/json; charset=utf-8',
        'Content-Length': Buffer.byteLength(postData)
      }
    };
    let fs = require('fs');
    if (fs.existsSync(savePath)) {
        fs.unlinkSync(savePath); //删除文件
        // console.log(savePath + "   被删除");
    }

    modalPanel.show();
    let chunkString = "";

    let req = http.request(options, (res) => {
      // console.log("请求数据长度" + Buffer.byteLength(postData));
      // console.log(`状态码: ${res.statusCode}`);
      // console.log(`响应头: ${JSON.stringify(res.headers)}`);

      res.setEncoding('utf-8');

      res.on('data', (chunk) => {
          console.log(chunk);
          chunkString += chunk;
      });

      res.on('end', () => {
          // console.log('响应中已无数据。');

          let bufferTemp = new Buffer(chunkString, "base64");
          fs.appendFileSync(savePath, bufferTemp, function(error){
              if(error){console.log('写入失败');}else{console.log('写入成功');}
          });
          modalPanel.hide();

      });
    });

    req.on('error', (e) => {
      // console.error(`请求遇到问题: ${e.message}`);
      modalPanel.hide();
    });


    // 写入数据到请求主体
    req.write(postData);
    req.end();

}

坑有点多，但踩过来了。

1. 以下代码弹出saveAs窗口（支持win和mac）

    const { dialog } = require('electron').remote;
    let savePath = dialog.showSaveDialog({filters:[{name:'Word', extensions:['docx']}]});

用户选择对号对应文件后，获取到savePath中。对于shouSaveDialog有以下参数可以使用：

2. 调用request发送JSON。

let req = http.request(options, (res) => {

3. 写入资源

在使用fs写入文件的时候，不能在on('data')的时候调用，会导致fs抢占资源，文件破损。

对于二进制文件，只能选择Base64编码，在使用二进制直接write时候，会导致不可描述的错误（各种二进制也都不行，所以最后只能采用Base64编码）

4. 对用户的提醒

我直接将Panel传入该方法了，可以调用Panel来控制atom页面，防止用户继续操作（生成错误数据）。

如下图所示

创建Panel 在项目名-view.js 中。

然后在activate中引用