Mirrors/sftpgo
1
0
Fork 0
mirror of https://github.com/drakkan/sftpgo.git synced 2025-12-07 14:50:55 +03:00
Code Issues Packages Projects Releases Wiki Activity

web client: use fetch to upload files

Browse Source 
also add REST API to upload a single file as POST body
This commit is contained in:
Nicola Murino
2021-12-08 19:25:22 +01:00
parent 5b4ef0ee3b
commit c153330ab8
19 changed files with 851 additions and 161 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
examples/webclient-integrations/test.html
View File

@@ -10,11 +10,14 @@
</head>
<body>
<textarea id="textarea_test" name="textarea_test" rows="6" cols="80">The text here will be sent to SFTPGo as blob</textarea>
<textarea id="textarea_test" name="textarea_test" rows="10" cols="80">The text here will be sent to SFTPGo as blob</textarea>
<br>
<button onclick="saveBlob(false);">Save</button>
<br>
<button onclick="saveBlob(true);">Save binary file</button>
<br><br>
<b>Logs</b>
<pre id="log"></pre>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script type="text/javascript">
@@ -24,7 +27,7 @@
// in real world usage set the origin when you call postMessage, we use `*` for testing purpose here
$(document).ready(function () {
if (window.opener == null || window.opener.closed) {
console.log("window opener gone!");
printLog("window opener gone!");
return;
}
// notify SFTPGo that the page is ready to receive the file
@@ -33,30 +36,34 @@
window.addEventListener('message', (event) => {
if (window.opener == null || window.opener.closed) {
console.log("window opener gone!");
printLog("window opener gone!");
return;
}
// you should check the origin before continuing
console.log("new message: "+JSON.stringify(event.data));
printLog("new message: "+JSON.stringify(event.data));
switch (event.data.type){
case 'readyResponse':
// after sending the ready request SFTPGo will reply with this response
// now you know the file name and the SFTPGo user
fileName = event.data.file_name;
sftpgoUser = event.data.user;
console.log("ready response received, file name: " + fileName+" SFTPGo user: "+sftpgoUser);
printLog("ready response received, file name: " + fileName+" SFTPGo user: "+sftpgoUser);
// you can initialize your viewer/editor based on the file extension and request the blob
window.opener.postMessage({type: 'sendBlob'}, "*");
break;
case 'blobDownloadStart':
// SFTPGo may take a while to read the file, just before it starts reading it will send this message.
// You can initialize a spinner if required for this file or simply ignore this message
console.log("blob download start received, file name: " + fileName+" SFTPGo user: "+sftpgoUser);
printLog("blob download start received, file name: " + fileName+" SFTPGo user: "+sftpgoUser);
break;
case 'blobDownloadError':
// SFTPGo was unable to download the file and return it as blob
printLog("blob download failed, file name: " + fileName+" SFTPGo user: "+sftpgoUser+" error message: "+event.data.message);
break;
case 'blob':
// we received the file as blob
var extension = fileName.slice((fileName.lastIndexOf(".") - 1 >>> 0) + 2).toLowerCase();
console.log("blob received, file name: " + fileName+" extension: "+extension+" SFTPGo user: "+sftpgoUser);
printLog("blob received, file name: " + fileName+" extension: "+extension+" SFTPGo user: "+sftpgoUser);
if (extension == "txt"){
event.data.file.text().then(function(text){
$("#textarea_test").val(text);
@@ -65,25 +72,25 @@
break;
case 'blobSaveResult':
// event.data.status is OK or KO, if KO message is not empty
console.log("blob save status: "+event.data.status+", message: "+event.data.message);
printLog("blob save status: "+event.data.status+", message: "+event.data.message);
if (event.data.status == "OK"){
console.log("blob saved, I'm useless now, close me");
printLog("blob saved, I'm useless now, close me");
}
break;
default:
console.log("Unsupported message: " + JSON.stringify(event.data));
printLog("Unsupported message: " + JSON.stringify(event.data));
}
});
function saveBlob(binary){
if (window.opener == null || window.opener.closed) {
console.log("window opener gone!");
printLog("window opener gone!");
return;
}
// if we have modified the file we can send it back to SFTPGo as a blob for saving
console.log("save blob, binary? "+binary);
printLog("save blob, binary? "+binary);
if (binary){
// we download and save the SFTPGo logo
// we download and save the SFTPGo logo. In a real application check errors
fetch('https://raw.githubusercontent.com/drakkan/sftpgo/main/docs/howto/img/logo.png')
.then(response => response.blob())
.then(function(responseBlob){
@@ -101,5 +108,11 @@
},"*");
}
}
function printLog(message){
console.log(message);
var logger = document.getElementById('log');
logger.innerHTML += message + '<br>';
}
</script>
</body>