added code to upload files

This commit is contained in:
bitscuit 2021-10-30 14:25:33 +00:00
parent 2ec217ebd3
commit af72bcb51f
4 changed files with 181 additions and 14 deletions

3
.gitignore vendored
View File

@ -1,3 +1,6 @@
# ---> Fawkes
fawkes/
# ---> Vim
# Swap
[._]*.s[a-v][a-z]

View File

@ -13,7 +13,7 @@
You should have received a copy of the GNU General Public License along with
this program. If not, see <https://www.gnu.org/licenses/>.
This project is hosted on https://git.bitscuit.be/bitscuit/Scrawl
This project is hosted on https://git.bitscuit.be/bitscuit/Fawkes
-->
<html>
<head>
@ -30,10 +30,39 @@
</head>
<body style="padding-top: 10px;">
<div id="main" class="container" style="text-align:center;">
<div id="main" class="container" style="text-align: center;">
<h1>Fawkes</h1>
<p>Protect your images from facial recognition.</p>
<p>TODO: add more info</p>
</div>
<div class="container">
<p>The table below shows the status for each image you've uploaded. You can select the files you want to protect using the <i>Browse</i> and <i>Upload</i> buttons below.</p>
<div class="row">
<div class="twelve columns">
<label for="input-file">Your Image</label>
<input class="u-full-width" type="file" id="input-file">
</div>
</div>
<button id="button-upload" class="button button-primary"><i class="fas fa-upload"></i>&nbsp;&nbsp;&nbsp;Upload</button>
</div>
<div class="container">
<table id="table-images" class="u-full-width">
<thead>
<tr>
<th>Image Name</th>
<th>Status</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
<p id="text-no-images" style="text-align: center;">You haven't uploaded any images yet.</p>
</div>
<div class="footer">
<p>Many thanks to the people who made <a href="http://sandlab.cs.uchicago.edu/fawkes/">Fawkes</a>!<br/>Copyright &copy; 2021 Thomas Van Acker<br/>Project hosted on <a target="_blank" href="https://git.bitscuit.be/bitscuit/Fawkes">Gitscuit</a></p>
</div>
@ -43,11 +72,66 @@
<script src="/socket.io/socket.io.js"></script>
<script>
// Vars
var files = {};
// Start socket.io
var socket = io();
// Init listeners
document.getElementById("button-upload").addEventListener("click", function(){
if(document.getElementById("input-file").files.length != 0){
var file = document.getElementById("input-file").files[0];
// Add file to files list
var id = Date.now();
files[id] = file;
// Add file to table
var table = document.getElementById("table-images").getElementsByTagName("tbody")[0];
var row = "";
row += "<tr id='row-"+id+"'>";
row += "<td>"+file.name+"</td>";
row += "<td id='status-"+id+"'><i class='fas fa-spinner fa-pulse'></i>&nbsp;&nbsp;&nbsp;Initializing Upload</td>";
row += "</tr>";
table.innerHTML += row;
document.getElementById("text-no-images").style.display = "none";
// Send request to server
socket.emit("FILE_START", {name:id, length:file.size});
}else{
// No file selected
alert("Please select a file using the 'Browse' button.");
}
});
socket.on("FILE_ERROR", function(data){
// When error while uploading
document.getElementById("status-"+data.name).innerHTML = "<i class='fas fa-exclamation-triangle'></i>&nbsp;&nbsp;&nbsp;Upload Error";
document.getElementById("status-"+data.name).title = data.error;
});
socket.on("FILE_ACK", function(data){
// When can send next file segment
var file = files[data.name];
var offset = data.nextSegment * 100000;
var fileSegment = file.slice(offset, Math.min(offset + 100000, file.size));
var fileReader = new FileReader();
fileReader.onload = function(event){
socket.emit("FILE_DATA", {name:data.name, data:event.target.result, segment:data.nextSegment});
};
fileReader.readAsBinaryString(fileSegment);
// Update status
document.getElementById("status-"+data.name).innerHTML = "<i class='fas fa-spinner fa-pulse'></i>&nbsp;&nbsp;&nbsp;Uploading ("+Math.floor(100*data.nextSegment/data.numSegments)+"%)";
});
socket.on("FILE_DONE", function(data){
// File upload done
document.getElementById("status-"+data.name).innerHTML = "<i class='fas fa-check'></i>&nbsp;&nbsp;&nbsp;Upload Complete";
});
</script>

4
launch Executable file
View File

@ -0,0 +1,4 @@
#!/bin/bash
cd $(dirname $0)
rm fawkes/files/* -rf
node main.js

100
main.js
View File

@ -28,8 +28,7 @@ const crypto = require("crypto");
const hostname = "192.168.0.128"; // Enter your local IP address here
const port = 8001; // Enter a port number here
var ids = [];
var sockets = [];
var files = {};
// Create HTTP server
@ -62,27 +61,104 @@ io.on("connection", (socket) => {
console.log("New user connected!");
// Give user unique ID
sockets.push(socket);
var userId = sha256("USER"+rand(0,9999999)+"TIME"+Date.now()).substr(0, 10);
ids.push(userId);
console.log("userId = "+userId);
// Init directory structure
fs.mkdirSync("fawkes/files/"+userId);
// Init socket listeners
// Disconnect
socket.on("disconnect", () => {
console.log("User "+userId+" disconnected!");
console.log(userId+": disconnect");
// Remove from user lists
var index = sockets.indexOf(socket);
if(index != -1){
// When in users list
ids.splice(index, 1);
sockets.splice(index, 1);
}
// Remove all files from this user
fs.rmSync("fawkes/files/"+userId, {recursive: true});
});
// File upload
socket.on("FILE_START", (data) => {
console.log(userId+": file upload ("+data.name+", "+data.length+" bytes)");
// Check length
if(data.length > 20000000){
console.log(userId+": file too large (data.length = "+data.length+")");
socket.emit("FILE_ERROR", {name:data.name, error:"File too large. Max size = 20MB"});
return;
}
// Check if exists
if((userId+data.name) in files){
console.log(userId+": file already exists (data.name = "+data.name+")");
socket.emit("FILE_ERROR", {name:data.name, error:"File had already been uploaded."});
return;
}
// Create file
var name = data.name;
var path = "fawkes/files/"+userId+"/"+name;
var file = {
length: data.length,
name: data.name,
path: path,
numSegments: data.length/100000 + 1,
nextSegment: 0
};
files[userId+data.name] = file;
// Ask client to begin upload
socket.emit("FILE_ACK", {name:file.name, nextSegment:file.nextSegment, numSegments:file.numSegments});
});
// File contents upload
socket.on("FILE_DATA", (data) => {
console.log(userId+": file data ("+data.name+", segment "+data.segment+", "+data.data.length+" bytes)");
// Check if file exists
if(!((userId+data.name) in files)){
console.log(userId+": received segment for unknown file (data.name = "+data.name+")");
socket.emit("FILE_ERROR", {name:data.name, error:"Received segment for unknown file."});
return;
}
// Get file
var file = files[userId+data.name];
// Check size
if(data.data.length > 100000){
console.log(userId+": segment too large (data.name = "+data.name+", data.data.length = "+data.data.length+")");
socket.emit("FILE_ERROR", {name:data.name, error:"Segment too large."});
return;
}
// Check segment number
if(data.segment != file.nextSegment || data.segment >= file.numSegments){
console.log(userId+": unexpected segment (data.name = "+data.name+", data.segment = "+data.segment+")");
socket.emit("FILE_ERROR", {name:data.name, error:"Unexpected segment."});
return;
}
// Write data
fs.appendFile(file.path, data.data, 'Binary', function(err){
if(err){
// Error
console.log(userId+": couldn't write to file (error = "+err+")");
socket.emit("FILE_ERROR", {name:data.name, error:"Internal server error. Couldn't write to file."});
}else{
file.nextSegment++;
if(file.nextSegment < file.numSegments-1){
// Ask for new segment
socket.emit("FILE_ACK", {name:file.name, nextSegment:file.nextSegment, numSegments:file.numSegments});
}else{
// When file fully uploaded
socket.emit("FILE_DONE", {name:file.name});
}
}
});
});
});