Topik ini menjelaskan pertanyaan umum dan solusi terkait Browser.js SDK.
Bagaimana cara memanggil STS?
Browser merupakan lingkungan yang tidak tepercaya. Menyimpan ID AccessKey dan Rahasia AccessKey secara langsung di browser menimbulkan ancaman keamanan yang tinggi. Gunakan mode Security Token Service (STS) untuk memanggil operasi API OSS di browser.
Setelah memperoleh token STS, lakukan inisialisasi SDK.
<script type="text/javascript">
$.ajax("http://your_sts_server/",{method: 'GET'},function (err, result) {
let client = new OSS({
authorizationV4: true,
accessKeyId: result.AccessKeyId,
accessKeySecret: result.AccessKeySecret,
stsToken: result.SecurityToken,
region: 'yourRegion',
bucket: 'yourBucketName'
});
});
</script>
Bagaimana cara mengaktifkan akses HTTPS?
Untuk mengaktifkan akses HTTPS, atur secure:true saat inisialisasi SDK. Untuk informasi selengkapnya, lihat Inisialisasi (Browser.js SDK).
Bagaimana cara mengatasi masalah lintas domain di browser?
Sebelum menggunakan SDK di browser, Anda harus mengonfigurasi aturan lintas domain untuk bucket tersebut. Untuk informasi selengkapnya, lihat Persiapan.
Bagaimana cara mengatur metadata yang ditentukan pengguna, tipe MIME, dan header permintaan untuk file yang diunggah?
Informasi lebih lanjut dapat ditemukan di Unggah Sederhana.
Bagaimana cara kerja unggah yang dapat dilanjutkan di browser?
Simpan checkpoint ke penyimpanan lokal browser. Teruskan parameter checkpoint pada pemanggilan berikutnya untuk melanjutkan unggahan. Untuk informasi selengkapnya, lihat Unggah yang dapat dilanjutkan (Browser.js SDK).
Bagaimana cara mengunggah file ke folder tertentu?
Untuk mengunggah file ke folder tertentu, tentukan awalan pada nama objek.
let OSS = require('ali-oss')
let client = new OSS({
authorizationV4: true,
region: 'yourRegion',
accessKeyId: 'yourAccessKeyId',
accessKeySecret: 'yourAccessKeySecret',
bucket: 'yourBucketName'
});
client.multipartUpload('base-dir/' +'object-key', 'local-file', {
progress: async function (p) {
console.log('Progress: ' + p);
}
});
console.log(result);
}).catch((err) => {
console.log(err);
});
Bagaimana cara mengunggah citra yang dikodekan Base64?
Pertama, ubah data Base64 menjadi citra dengan format tertentu. Kemudian, panggil operasi unggah OSS untuk mengunggah citra tersebut. Untuk informasi selengkapnya, lihat contoh di GitHub.
/**
* Mengonversi Base64 menjadi file.
* @param dataurl Konten Base64.
* @param filename Tetapkan ekstensi yang bermakna. Anda juga dapat mengatur tipe MIME di opsi.
* @returns {File|*}
*/
const dataURLtoFile = function dataURLtoFile(dataurl, filename) {
const arr = dataurl.split(',');
const mime = arr[0].match(/:(.*?);/)[1];
const bstr = atob(arr[1]);
let n = bstr.length;
const u8arr = new Uint8Array(n);
while (n--) {
u8arr[n] = bstr.charCodeAt(n);
}
return new Blob([u8arr], { type: mime });// jika lingkungan mendukung File, Anda juga dapat menggunakan ini: return new File([u8arr], filename, { type: mime });
};
// client adalah instans klien OSS.
const uploadBase64Img = function uploadBase64Img(client) {
// Konten Base64.
const base64Content = 'data:image:****';
const filename = 'img.png';
const imgfile = dataURLtoFile(base64Content, filename);
// key adalah kunci objek untuk unggahan. imgFile adalah citra yang dikembalikan setelah diproses oleh dataURLtoFile.
client.multipartUpload(key, imgfile).then((res) => {
console.log('upload success: %j', res);
}).catch((err) => {
console.error(err);
});
};Bagaimana cara membatasi ukuran file yang diunggah?
Di browser, Anda dapat memperoleh ukuran file yang diunggah dalam byte melalui document.getElementById("file").files[0].size. Untuk informasi selengkapnya tentang permintaan POST, lihat Unggah data ke OSS dari browser.
Bagaimana cara mendapatkan progres unggahan?
Anda dapat memperoleh progres unggahan melalui unggah multi-bagian. Untuk informasi selengkapnya, lihat Unggah multi-bagian (Browser.js SDK).
Bagaimana cara mendapatkan progres unduhan?
Anda tidak dapat memperoleh progres unduhan di browser. Panggil metode signatureUrl untuk memperoleh URL unduhan. Untuk informasi selengkapnya, lihat Referensi.
Bagaimana cara mendapatkan URL yang ditandatangani untuk suatu objek?
Anda dapat memanggil metode signatureUrl untuk mendapatkan URL unduhan. Untuk informasi selengkapnya, lihat Pratinjau atau unduh file (Browser.js SDK).
Bagaimana cara menggunakan URL yang ditandatangani yang dihasilkan SDK untuk mengunggah resource?
URL yang ditandatangani sering digunakan untuk memberikan akses pihak ketiga guna mengunggah dan mengunduh resource. SDK menyediakan metode signatureUrl untuk mengembalikan URL yang ditandatangani. Anda dapat menggunakan URL ini untuk mengunggah atau mengunduh resource. Untuk contoh pengunggahan resource menggunakan URL yang ditandatangani, lihat proyek contoh SDK: Contoh mengunggah resource menggunakan URL yang ditandatangani.
Bagaimana cara menggunakan formulir untuk mengunggah resource ke server OSS?
Untuk informasi selengkapnya, lihat Unggah data ke OSS dari browser.
Bagaimana cara menjalankan proyek contoh?
Buka direktori ali-oss/example dan jalankan npm run start.
Bagaimana cara menambahkan callback unggahan?
const uploadFile = function uploadFile(client) {
if (!uploadFileClient || Object.keys(uploadFileClient).length === 0) {
uploadFileClient = client;
}
const file = document.getElementById('file').files[0];
const key = document.getElementById('object-key-file').value.trim() || 'object';
console.log(`${file.name} => ${key}`);
const options = {
progress,
partSize: 500 * 1024,
timeout:60000,
meta: {
year: 2017,
people: 'test',
},
callback: {
// Posisi tempat callback unggahan ditambahkan.
url: 'https://example.aliyundoc.com/v2/sync',
/* host: 'oss-cn-shenzhen.aliyuncs.com', */
/* eslint no-template-curly-in-string: [0] */
body: 'bucket=${bucket}&object=${object}&var1=${x:var1}',
contentType: 'application/x-www-form-urlencoded',
customValue: {
var1: 'value1',
var2: 'value2',
},
},Untuk informasi selengkapnya tentang callback unggahan, lihat Cara kerja.
Apakah browser mendukung penjelajahan file per chunk?
Tidak.
Bagaimana cara mengumpulkan log dengan OSS JS SDK?
Untuk informasi selengkapnya, lihat GitHub.