时间戳

首页 > 解决方案 > 如何在同一个函数中使用不同的 uri

javascript - 如何在同一个函数中使用不同的 uri

问题描述

我正在尝试通过 url 制作下载功能

在 HTML 中有 3 个按钮（下载、暂停、重启）调用 download_file()、pause22()、restart_test()。

它们使用在包含请求对象的 download_file() 中声明的相同变量 [req]。

如果我只打电话一次，它就可以了。

但问题是我需要制作下载列表。所以每个 download_file() 需要使用不同的 URL，它会被用户同时调用很多次。同样，当请求结束时，需要在单击的按钮处显示一条消息。

我可以重用函数吗？

如果我通过 url 制作每个不同的功能，那将是愚蠢的。

我怎么能区分点击了什么？

js

function download_file(event, fileURL) {
  req = request({
    method: 'GET',
    uri: fileURL,
  });
  var out = fs.createWriteStream(finalPath);
  req.pipe(out); 
  req.on('data', function(chunk) {
    received_bytes += chunk.length;
  });
  req.on('end', function() {
    subW = test.substring(9, 18).trim();
    $("." + subW).text('finished');
    endV = 2;
  });
}

//resume function
function restart_test() {
  req = request({
    method: 'GET',
    uri: fileURL
  });
  var out = fs.createWriteStream(finalPath);
  req.pipe(out); 
  req.on('data', function(chunk) {
    received_bytes += chunk.length;
  });
  req.on('end', function() {
    subW = test.substring(9, 18).trim();
    $("." + subW).text('finished');
    endV = 2;
  });
}
//pause
$('#btn-pause').click(function(e) {
  console.log('pause function called');
  req.pause();
});

html

<tr>
        <td class="test"><a class="checkBtn checkBtn2" onclick="download_file(event, '100mb.bin')">download</a></td>
        <td><a class="pauseBtn pauseBtn2" id="btn-pause" value="ACTION">pause</a><a class="resumeBtn resumeBtn2" onclick="restart_test();" value="ACTION">restart</a></td>
      </tr>
      <tr>
        <td class="test"><a class="checkBtn checkBtn2" onclick="download_file(event, '1000mb.bin')">download</a></td>
        <td><a class="pauseBtn pauseBtn2" id="btn-pause" value="ACTION">pause</a><a class="resumeBtn resumeBtn2" onclick="restart_test();" value="ACTION">restart</a></td>
      </tr>

标签： javascriptnode.js

解决方案

我认为您应该将 req 保存到对象中。

JS

var listReqs = {};

function download_file(event, filename) {
  var req = request({
    method: 'GET',
    uri: fileURL,
  });
  var out = fs.createWriteStream(finalPath);
  req.pipe(out); 
  req.on('data', function(chunk) {
    received_bytes += chunk.length;
  });
  req.on('end', function() {
    subW = test.substring(9, 18).trim();
    $("." + subW).text('finished');
    endV = 2;
  });
  listReqs[filename] = req;
}

//resume function
function restart_test(filename) {
  var req = listReqs[filename];
  var out = fs.createWriteStream(final path);
  req.pipe(out); 
  req.on('data', function(chunk) {
    received_bytes += chunk.length;
  });
  req.on('end', function() {
    subW = test.substring(9, 18).trim();
    $("." + subW).text('finished');
    endV = 2;
  });
}
//pause
$('.pauseBtn2').click(function(e) {
  console.log('pause function called');
  var filename = $(this).attr('filename');
  listReqs[filename].pause();
});

html

<tr>
        <td class="test"><a class="checkBtn checkBtn2" onclick="download_file(event, '100mb.bin')">download</a></td>
        <td><a class="pauseBtn pauseBtn2" filename="100mb.bin" value="ACTION">pause</a><a class="resumeBtn resumeBtn2" onclick="restart_test('100mb.bin');" value="ACTION">restart</a></td>
      </tr>
      <tr>
        <td class="test"><a class="checkBtn checkBtn2" onclick="download_file(event, '1000mb.bin')">download</a></td>
        <td><a class="pauseBtn pauseBtn2" filename="1000mb.bin" value="ACTION">pause</a><a class="resumeBtn resumeBtn2" onclick="restart_test('1000mb.bin');" value="ACTION">restart</a></td>
      </tr>

推荐阅读