sim1222/nca10.net
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Fix #2773 (#2841)

Browse Source 
* Added an API endpoint to check the existence of the file

* fix #2773: Now we can prevent users from posting the same images

* bug fix
This commit is contained in:
sei0o inoue
2018-10-07 16:51:46 +09:00
committed by syuilo
parent d0570d7fe3
commit 3e897727ca
3 changed files with 106 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

94
src/client/app/common/views/components/uploader.vue
View File

@ -20,6 +20,7 @@
<script lang="ts">
import Vue from 'vue';
import { apiUrl } from '../../../config';
import getMD5 from '../../scripts/get-md5';
export default Vue.extend({
data() {
@ -28,53 +29,78 @@ export default Vue.extend({
};
},
methods: {
upload(file, folder) {
checkExistence(fileData: ArrayBuffer): Promise<any> {
return new Promise((resolve, reject) => {
const data = new FormData();
data.append('md5', getMD5(fileData));
(this as any).api('drive/files/check_existence', {
md5: getMD5(fileData)
}).then(resp => {
resolve(resp.file);
});
});
},
upload(file: File, folder: any) {
if (folder && typeof folder == 'object') folder = folder.id;
const id = Math.random();
const ctx = {
id: id,
name: file.name || 'untitled',
progress: undefined,
img: undefined
};
this.uploads.push(ctx);
this.$emit('change', this.uploads);
const reader = new FileReader();
reader.onload = (e: any) => {
ctx.img = e.target.result;
};
reader.readAsDataURL(file);
this.checkExistence(e.target.result).then(result => {
console.log(result);
if (result !== null) {
this.$emit('uploaded', result);
return;
}
const data = new FormData();
data.append('i', this.$store.state.i.token);
data.append('file', file);
// Upload if the file didn't exist yet
const buf = new Uint8Array(e.target.result);
let bin = "";
// We use for-of loop instead of apply() to avoid RangeError
// SEE: https://stackoverflow.com/questions/9267899/arraybuffer-to-base64-encoded-string
for (const byte of buf) bin += String.fromCharCode(byte);
const ctx = {
id: id,
name: file.name || 'untitled',
progress: undefined,
img: 'data:*/*;base64,' + btoa(bin)
};
if (folder) data.append('folderId', folder);
this.uploads.push(ctx);
this.$emit('change', this.uploads);
const xhr = new XMLHttpRequest();
xhr.open('POST', apiUrl + '/drive/files/create', true);
xhr.onload = (e: any) => {
const driveFile = JSON.parse(e.target.response);
const data = new FormData();
data.append('i', this.$store.state.i.token);
data.append('file', file);
this.$emit('uploaded', driveFile);
if (folder) data.append('folderId', folder);
this.uploads = this.uploads.filter(x => x.id != id);
this.$emit('change', this.uploads);
};
const xhr = new XMLHttpRequest();
xhr.open('POST', apiUrl + '/drive/files/create', true);
xhr.onload = (e: any) => {
const driveFile = JSON.parse(e.target.response);
xhr.upload.onprogress = e => {
if (e.lengthComputable) {
if (ctx.progress == undefined) ctx.progress = {};
ctx.progress.max = e.total;
ctx.progress.value = e.loaded;
}
};
this.$emit('uploaded', driveFile);
xhr.send(data);
this.uploads = this.uploads.filter(x => x.id != id);
this.$emit('change', this.uploads);
};
xhr.upload.onprogress = e => {
if (e.lengthComputable) {
if (ctx.progress == undefined) ctx.progress = {};
ctx.progress.max = e.total;
ctx.progress.value = e.loaded;
}
};
xhr.send(data);
})
}
reader.readAsArrayBuffer(file);
}
}
});