我尝试制作可以通过 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 回调中查找文件名(但这是小问题)。
问题出在 octokit.js 库中。