download progress & js #51
Comments
|
https://stackoverflow.com/questions/35711724/upload-progress-indicators-for-fetch https://developer.mozilla.org/zh-CN/docs/Web/API/Response/status function consume(stream, total = 0) {
while (stream.state === "readable") {
var data = stream.read();
total += data.byteLength;
console.log("received " + data.byteLength + " bytes (" + total + " bytes in total).");
}
if (stream.state === "waiting") {
stream.ready.then(() => consume(stream, total));
}
return stream.closed;
}
fetch("https://cdn.xgqfrms.xyz/json/data.json")
.then(res => consume(res.body))
.then(() => console.log("consumed the entire body without keeping the whole thing in memory!"))
.catch((e) => console.error("something went wrong", e)); |
Fetch & Streams API
https://fetch-progress.anthum.com/ |
axios & progresshttps://github.com/axios/axios {
// `onUploadProgress` allows handling of progress events for uploads
onUploadProgress: function (progressEvent) {
// Do whatever you want with the native progress event
},
// `onDownloadProgress` allows handling of progress events for downloads
onDownloadProgress: function (progressEvent) {
// Do whatever you want with the native progress event
},
} |
"use strict";
/**
*
* @author xgqfrms
* @license MIT
* @copyright xgqfrms
*
* @description Fetch & Streams API & Progress Indicator Examples
* @link https://github.com/xyz-data/fetch-progress-indicators
* @augments
* @example fetchProgress();
*
*/
const fetchProgress = (url = `https://cdn.xgqfrms.xyz/json/data.json`, debug = false) => {
const streamConsume = (stream, total = 0) => {
while (stream.state === "readable") {
let data = stream.read();
total += data.byteLength;
console.log(`received ${data.byteLength} bytes; (${total} bytes in total).`);
}
if (stream.state === "waiting") {
stream.ready.then(() => consume(stream, total));
}
return stream.closed;
};
fetch(url)
.then(res => streamConsume(res.body))
.then(() => console.log("consumed the entire body without keeping the whole thing in memory!"))
.catch((e) => console.error("something went wrong", e));
};
export default fetchProgress;
export {
fetchProgress,
};
|
wangEditor
http://www.wangeditor.com/index.html https://www.kancloud.cn/wangfupeng/wangeditor3/335769 $ npm i -S wangeditor
var E = window.wangEditor;
var editor = new E('#div1');
editor.create();https://github.com/wangfupeng1988/wangEditor/blob/master/example/demo/in-react/src/App.js // React refs
|
|
$ npm audit
$ npm audit fix
|
Chinese character bug
|
FormDatahttps://www.raymondcamden.com/2016/05/10/uploading-multiple-files-at-once-with-fetch/ function processForm(e) {
e.preventDefault();
var formData = new FormData();
if($f1.val()) {
var fileList = $f1.get(0).files;
for(var x=0;x<fileList.length;x++) {
formData.append('file'+x, fileList.item(x));
}
}
fetch('http://localhost:3000/upload', {
method:'POST',
body:formData
}).then(function(res) {
console.log('Status', res);
}).catch(function(e) {
console.log('Error',e);
});
} |
xgqfrms
added
FormData & Fetch
download progress & js
https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest#Monitoring_progress
https://stackoverflow.com/questions/18126406/how-can-i-get-the-progress-of-a-downloading-script
https://stackoverflow.com/questions/16690740/how-to-show-loading-status-in-percentage-for-ajax-response
https://stackoverflow.com/questions/18323152/get-download-progress-in-node-js-with-request
https://www.w3schools.com/howto/howto_js_progressbar.asp
https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_progressbar_3
https://ourcodeworld.com/articles/read/56/how-to-get-the-progress-of-an-upload-or-download-with-jquery-ajax
https://zinoui.com/blog/ajax-request-progress-bar
https://coderwall.com/p/je3uww/get-progress-of-an-ajax-request
The text was updated successfully, but these errors were encountered: