|
[index.js]
export class Overview extends SampleBase {
hostUrl = 'http://localhost:62869/';
onbeforeDownload(args) {
args.cancel = true;
var obj = {
action: 'download',
path: args.data.path,
names: args.data.names,
data: args.data.data,
};
var xhr = new XMLHttpRequest();
xhr.open('POST', 'http://localhost:62869/api/FileManager/Download', true);
xhr.responseType = 'blob';
xhr.onload = function () {
if (this.status === 200) {
var name = '';
// Getting file name from content-disposition header
let header = xhr.getResponseHeader('Content-Disposition');
if (header && header.indexOf('attachment') !== -1) {
var regex = /name[^;=]*=((['"]).*?\2|[^;]*)/;
var matches = regex.exec(header);
if (matches != null && matches[1])
name = matches[1].replace(/['"]/g, '');
}
//saving the file locally using anchor tag
var blob = new Blob([this.response], {
type: xhr.getResponseHeader('Content-Type'),
});
var anchorUrl = window.URL.createObjectURL(blob);
if (name) {
var anchor = document.createElement('a');
anchor.rel='nofollow' href = anchorUrl;
anchor.download = name;
anchor.click();
} else {
window.location = anchorUrl;
}
setTimeout(function () {
URL.revokeObjectURL(anchorUrl);
}, 100);
}
};
var fdata = new FormData();
fdata.append('downloadInput', JSON.stringify(obj));
//Custom
Header Added to XHR
xhr.setRequestHeader('Custom-Header', 'TokenValue');
xhr.send(fdata);
}
render() {
return (
<div>
<div className="control-section">
<FileManagerComponent
id="overview_file"
ajaxSettings={{
url: this.hostUrl + 'api/FileManager/FileOperations',
getImageUrl: this.hostUrl + 'api/FileManager/GetImage',
uploadUrl: this.hostUrl + 'api/FileManager/Upload',
downloadUrl: this.hostUrl + 'api/FileManager/Download',
}}
beforeSend={this.onBeforeSend.bind(this)}
beforeDownload={this.onbeforeDownload.bind(this)}
searchSettings={{ allowSearchOnTyping: false }}
view={'Details'}
>
</FileManagerComponent>
...
|
