File uploading stuff
This commit is contained in:
parent
a2c9fdcd50
commit
ac1bd586c9
2 changed files with 63 additions and 18 deletions
|
@ -7,6 +7,8 @@
|
||||||
let files;
|
let files;
|
||||||
let preview;
|
let preview;
|
||||||
|
|
||||||
|
let progress = 0;
|
||||||
|
|
||||||
function getBase64(image) {
|
function getBase64(image) {
|
||||||
const reader = new FileReader();
|
const reader = new FileReader();
|
||||||
reader.readAsDataURL(image);
|
reader.readAsDataURL(image);
|
||||||
|
@ -15,19 +17,40 @@
|
||||||
uploadFunction(e.target.result);
|
uploadFunction(e.target.result);
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
async function uploadFunction(imageD) {
|
||||||
|
const imgData = imageD.split(',').pop();
|
||||||
|
|
||||||
async function uploadFunction(imgBase64) {
|
var images = [];
|
||||||
const imgData = imgBase64.split(',').pop();
|
|
||||||
|
|
||||||
var fData = (new FormData());
|
var fSize = 1024 * 256;
|
||||||
|
|
||||||
fData.append('img',imgData);
|
for (var i = 0; i * fSize < imgData.length + 1; i++) {
|
||||||
fData.append('extension',fileInput.value.split('.').pop());
|
images.push(imgData.substring(i * fSize, i * fSize + fSize));
|
||||||
|
}
|
||||||
|
|
||||||
|
var rId = (Math.random() + 1).toString(36).substring(7);;
|
||||||
|
var extension = fileInput.value.split('.').pop();
|
||||||
|
|
||||||
|
for (var i = 0; i < images.length; i++) {
|
||||||
|
var fData = (new FormData());
|
||||||
|
|
||||||
|
var image = images[i];
|
||||||
|
|
||||||
|
fData.append('img',image);
|
||||||
|
fData.append('extension',extension);
|
||||||
|
fData.append('last',i == (images.length - 1));
|
||||||
|
fData.append('id',rId);
|
||||||
|
|
||||||
form = await fetch(`/api/fileCreate`, {
|
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
body: fData
|
form = await fetch(`/api/fileCreate`, {
|
||||||
}).then(x => x.json());
|
method: 'POST',
|
||||||
|
body: fData,
|
||||||
|
}).then(x => x.json());
|
||||||
|
|
||||||
|
progress = (i+1) / (images.length);
|
||||||
|
|
||||||
|
await setTimeout(() => new Promise.resolve(),100);
|
||||||
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
@ -42,13 +65,16 @@
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<form action='/api/postCreate' method='POST' >
|
<form action='#' method='GET' >
|
||||||
{#if preview}
|
{#if preview}
|
||||||
<img src={preview} alt="Image preview"/>
|
<img src={preview} alt="Image preview"/>
|
||||||
{:else}
|
{:else}
|
||||||
<img src='/icon_sanifae.svg' alt="Image preview"/>
|
<img src='/icon_sanifae.svg' alt="Image preview"/>
|
||||||
{/if}
|
{/if}
|
||||||
<input class="hidden" id="file-to-upload" type="file" bind:files bind:this={fileInput} on:change={() => getBase64(files[0])}/>
|
<input class="hidden" id="file-to-upload" type="file" bind:files bind:this={fileInput} on:change={() => getBase64(files[0])}/>
|
||||||
|
<p>
|
||||||
|
Progress: {progress * 100}%
|
||||||
|
</p>
|
||||||
<p>
|
<p>
|
||||||
<Button class="upload-btn" clickFunc={ () => fileInput.click() }>Upload</Button>
|
<Button class="upload-btn" clickFunc={ () => fileInput.click() }>Upload</Button>
|
||||||
</p>
|
</p>
|
||||||
|
|
|
@ -6,7 +6,9 @@ const AUTH_ACTIONS = [
|
||||||
'vote'
|
'vote'
|
||||||
];
|
];
|
||||||
|
|
||||||
const fileSizeLimit = 1024*1024*5;
|
const fileSizeLimit = 1024*1024*16;
|
||||||
|
|
||||||
|
var ridArray = {};
|
||||||
|
|
||||||
import sqlite3 from 'sqlite3'
|
import sqlite3 from 'sqlite3'
|
||||||
import { open } from 'sqlite'
|
import { open } from 'sqlite'
|
||||||
|
@ -132,6 +134,8 @@ backend.login = async ({user, pass, cookies}) => {
|
||||||
}
|
}
|
||||||
|
|
||||||
backend.postCreate = async ({content, user}) => {
|
backend.postCreate = async ({content, user}) => {
|
||||||
|
if (!content) return {'success': 'No post provided.'}
|
||||||
|
|
||||||
var lengthCheck = checkLength(content,'Post content',1,10240);
|
var lengthCheck = checkLength(content,'Post content',1,10240);
|
||||||
|
|
||||||
if (lengthCheck)
|
if (lengthCheck)
|
||||||
|
@ -247,20 +251,35 @@ backend.token = async ({cookies}) => {
|
||||||
return {data: existingAccounts[0].username};
|
return {data: existingAccounts[0].username};
|
||||||
}
|
}
|
||||||
|
|
||||||
backend.fileCreate = async({img, extension}) => {
|
backend.fileCreate = async({img, extension,id, last }) => {
|
||||||
const imgHash = createHash('md5').update(img).digest('hex');
|
if (ridArray[id] !== '' && !(ridArray[id])) {
|
||||||
|
ridArray[id] = img;
|
||||||
|
} else {
|
||||||
|
ridArray[id] += img;
|
||||||
|
}
|
||||||
|
|
||||||
let lengthCheck = checkLength(img,'Image',fileSizeLimit);
|
const imgData = ridArray[id];
|
||||||
|
|
||||||
if (lengthCheck)
|
if (last != 'true') {
|
||||||
return lengthCheck;
|
return {'success': 'Image still proccessing...'}
|
||||||
|
} else {
|
||||||
|
ridArray[id] = false;
|
||||||
|
}
|
||||||
|
|
||||||
const extensionSafe = extension.replace(/(\s+)/g, '\\$1');
|
const imgHash = createHash('md5').update(imgData).digest('hex');
|
||||||
|
|
||||||
if (extensionSafe != 'png' && extensionSafe != 'jpg' && extensionSafe != 'svg' || extensionSafe != 'gif')
|
if (!imgHash)
|
||||||
|
return {'success': 'Image not provided.'}
|
||||||
|
|
||||||
|
if (imgHash.length > fileSizeLimit)
|
||||||
|
return {'success': 'Image too big.'}
|
||||||
|
|
||||||
|
const extensionSafe = extension.replace(/[^a-zA-Z]+/g, '\\$1');
|
||||||
|
|
||||||
|
if (extensionSafe != 'png' && extensionSafe != 'jpg' && extensionSafe != 'svg' && extensionSafe != 'gif')
|
||||||
return { success: 'Illegal file extension.' };
|
return { success: 'Illegal file extension.' };
|
||||||
|
|
||||||
writeFile(`${process.cwd()}/db/post-${imgHash}.${extensionSafe}`,img,{encoding: 'base64'});
|
writeFile(`${process.cwd()}/db/post-${imgHash}.${extensionSafe}`,imgData,{encoding: 'base64'});
|
||||||
|
|
||||||
return { success: 'Successfully uploaded file.', 'href': `/img/${imgHash}.${extensionSafe}`};
|
return { success: 'Successfully uploaded file.', 'href': `/img/${imgHash}.${extensionSafe}`};
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue