ファイルをWebブラウザにドラッグ&ドロップするためのVue.js用のメソッド(Blob及びPromise使用)

drop_file_with_blob_and_promise.js

// Inside a Vue instance...
	dragOver(event) {
		event.preventDefault();
	},
	dropFile(event) {
		event.preventDefault();	dropFile() {
    		if (event.dataTransfer.files.length != 1) {
      			alert("Only one file can be dropped");
			return;
	  	}
		if (event.dataTransfer.items.length != 1 ||
			(event.dataTransfer.items[0].webkitGetAsEntry() &&
			 event.dataTransfer.items[0].webkitGetAsEntry().isDirectory)) {
			alert("Only tex file is available.");
			return;					  
		}
	  	if (event.dataTransfer.files[0].name.slice(-3) !== "tex") {
			alert("Only tex file is available.");
			return;
		}
    		event.dataTransfer.files[0].arrayBuffer()
    			.then(buffer => {
      				let r = new Uint8Array(buffer);
				const rr = function*() {
        				for (let i = 0x20; i < 0xff; i++) {
			    			if (i != 0x7f) {
							yield i;
						}
					}
				}
				const textChars = [7,8,9,10,12,13,27, ...rr()];
				if (r.every(e => textChars.includes(e))) {
					// Put code to append string to textarea.
				} else {
					alert("Binary file is not available.");
				}					  
			})
			.catch(error => {
		  		alert("Error occurred. Status: "+error);
			});
		}