HTML5 文件 api 和 octokit.js 以及二进制文件

问题描述 投票:0回答:1

我尝试制作可以通过 octokit.js 将二进制数据上传到 github 的表单。例如一些 pdf 或图像(二进制 blob)。我的问题是我所有的尝试都以 github 端的数据损坏而告终。

最小工作示例:http://jsfiddle.net/keddie/7r3f4q77/

var _arrayBufferToBase64 = function (buffer) {
  var binary = '';
  var bytes = new Uint8Array(buffer);
  var len = bytes.byteLength;
  for (var i = 0; i < len; i++) {
   binary += String.fromCharCode(bytes[i]);
  }
  return window.btoa(binary);
};

var go = function () {
var config = {
    user: $('#user').val(),
    repo: $('#repo').val(),
    token: $('#token').val(),
    handler: document.getElementById('file').files[0]
};

var reader = new FileReader();
var github = new Octokit({
    token: config.token
});
var repo = github.getRepo(config.user, config.repo);
var branch = repo.getBranch();

reader.onloadend = function (evt) {
    var files = {};
    if (evt.target.readyState == FileReader.DONE) {

        /* Anothers attempts:
        files[ 'x1.pdf' ] = {
            isBase64: true,
            content: evt.target.result
        };
        files[ 'x2.pdf' ] = {
            isBase64: true,
            content: evt.target.result.substring('data:application/octet-stream;base64,'.length)
        };
        */
        files['x4.pdf'] = {
            isBinary: true,
            isBase64: true,
            content: _arrayBufferToBase64(evt.target.result)
        };
    } else {
        console.warn(evt.target.error);
    }
    branch.writeMany(files, "API test commit 1").then(function (res) {
        if (res) {
            console.log('ok');
            $('#result').text('OK');
        } else {
            console.error(res);
            $('#result').text('Error');
        }
    });
 };
 var blob = config.handler.slice(0, config.handler.size);
 //reader.readAsDataURL(blob);   
 reader.readAsArrayBuffer(blob);
};

$(document).ready(function () {
  $('#submit').click(go);
});

和 HTML:

<p>User:
 <input type="text" id="user" />
</p>
<p>Repo:
 <input type="text" id="repo" />
</p>
<p>Token:
 <input type="text" id="token" />
</p>
<p>File:
 <input type="file" id="file" />
</p>
<p>
 <button id="submit">Submit</button>
</p>
<p id="result"></p>

我的第二个问题是如何在 reader.onloadend 回调中查找文件名(但这是小问题)。

相关的是这个问题:https://github.com/philschatz/octokit.js/issues/44

javascript html git blob html5-filesystem
1个回答
0
投票

问题出在 octokit.js 库中。

我准备了拉取请求:https://github.com/philschatz/octokit.js/pull/72

© www.soinside.com 2019 - 2024. All rights reserved.