Cara menggunakan pcs api untuk memuat naik dan memuat turun fail untuk membebaskan kemahiran disk_javascript rangkaian Baidu

Cakera awan peribadi Baidu mempunyai ruang yang besar, percuma sepenuhnya, dan menyediakan API PCS untuk memanggil dan mengendalikan fail Ia sangat praktikal untuk menyimpan beberapa fail dalam projek harian.

Persediaan alam sekitar:

Dayakan membaca dan menulis kebenaran cakera rangkaian dan dapatkan access_token: http://blog.csdn.net/langyuezhang/article/details/47206621

Dokumen api pcs rasmi Baidu: http://developer.baidu.com/wiki/index.php?title=docs/pcs/overview Terdapat SDK dalam pelbagai bahasa Saya menggunakan laravel5 dan mengimportnya secara langsung SDK tidak boleh digunakan lagi. Ia perlu diubah suai sedikit sebelum boleh digunakan.

Selepas membaca dua artikel di atas, anda pada asasnya boleh menggunakannya Berikut ialah API untuk melihat terus imej yang dipilih oleh pengguna dan memuat naiknya ke cakera rangkaian:
https://pcs.baidu.com/rest/2.0/pcs/file?method=upload&path=%2fapps%2wp2pcs%2f1.JPG&access_token=***Bahagian merah dibetulkan kerana hanya memuat naik ke direktori ini sahaja yang dibenarkan , Direktori yang sepadan dengan cakera rangkaian ialah My Network Disk/My Application Data/wp2pcs Tidak perlu membuat direktori sebelum memuat naik fail Anda hanya perlu menentukan laluan dan ia akan dibuat secara automatik ingin memuat naik gambar ke /apps/wp2pcs/ Di bawah img, tulis sahaja /apps/wp2pcs/img/1.jpg sebagai laluan. Berikut ialah kod untuk memuat naik imej yang dipilih oleh pengguna pada halaman web terus ke cakera rangkaian selepas melihatnya, merujuk kepada contoh di Internet: Pratonton:

//图片上传预览 IE是用了滤镜。
function previewImage(file, product)
{
getPhotopty();
console.log("previewImage");
uploadAndSubmit(product);
var div = document.getElementById('preview' + product);
var fileName = file.value;
//upload();
if (file.files)
{
var i = 0;
var funAppendImage = function () {
var _file = file.files[i];
if (_file) {
var reader = new FileReader()
reader.onload = function (evt) {
fileName = _file.name;
div.innerHTML += '<div class="col-xs-6 col-md-3"><a style="float:right;cursor:pointer;" onclick="del(this)">X</a><div class="thumbnail"><img id=imghead' + product + fileName + '></div></div>';
var img = document.getElementById('imghead' + product + fileName);
img.src = evt.target.result;
i++;
funAppendImage();
}
reader.readAsDataURL(_file);
}
};
funAppendImage();
}
$('#coverBg').show();
$('#coverDiv').show();
//$("#uploadFrm" + product).submit();
}

Muat naik:

var access_token = "***********";
var baseUrl = "https://c.pcs.baidu.com/rest/2.0/pcs/";
function uploadAndSubmit(product) {
console.log("start uploadAndSubmit");
if (typeof FileReader == 'undefined') {
alert("你的浏览器不支持FileReader接口！");
}
var taskName = $("#txtTask").val() + "-" + $("#txtTask2").val();
var form = document.forms["uploadFrm" + product];
console.log("form:" + form);
var fileCtrl = "filectrl" + product;
console.log("filectrl:" + fileCtrl);
//if (form[fileCtrl].files.length > 0)
console.log($("#filectrl" + product)[0]);
if ($("#filectrl" + product)[0].files.length > 0)
{
for (var i = 0; i < $("#filectrl" + product)[0].files.length; i++)
{
var file = form[fileCtrl].files[i];
console.log(file.name);
var filePath = "%2fapps%2fwp2pcs%2f" + taskName + "%2f" + file.name;
console.log("add exif info to db");
getExifIinfo(taskName, file, product, filePath);
//document.getElementById("bytesRead").textContent = file.size;
console.log("start XMLHttpRequest");
var xhr = new XMLHttpRequest();
console.log(access_token);
var url = baseUrl + "file&#63;method=upload&path=%2fapps%2fwp2pcs%2f" + taskName + "%2f" + file.name + "&access_token=" + access_token + "&ondup=overwrite&count=" + i;
console.log(url);
xhr.open("POST", url, true);
var formData = new FormData();
formData.append("file", file);
console.log("onreadystatechange");
xhr.onreadystatechange = function () {
console.log("onreadystatechange start");
//console.log(xhr.status);
if (xhr.readyState == 4) {
if (xhr.status == 200) {
console.log("upload complete");
console.log("response: " + xhr.responseText);
var result = $.parseJSON(xhr.responseText);
if (result.hasOwnProperty("path"))
{
$("#reusltMsg").append('<div class="alert alert-success" role="alert"> 上传成功.</div>');
} else
{
$("#reusltMsg").append('<div class="alert alert-danger" role="alert"> 上传失败.</div>');
}
} else
{
$("#reusltMsg").append('<div class="alert alert-danger" role="alert"> 上传失败(200).</div>');
}
}
$('#coverBg').hide();
$('#coverDiv').hide();
}
xhr.send(formData);
}
} else
{
alert("Please choose a file.");
$('#coverBg').hide();
$('#coverDiv').hide();
}
}