added code to upload files
This commit is contained in:
parent
2ec217ebd3
commit
af72bcb51f
|
@ -1,3 +1,6 @@
|
|||
# ---> Fawkes
|
||||
fawkes/
|
||||
|
||||
# ---> Vim
|
||||
# Swap
|
||||
[._]*.s[a-v][a-z]
|
||||
|
|
|
@ -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> 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 © 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> 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> 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> 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> Upload Complete";
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
|
|
|
@ -0,0 +1,4 @@
|
|||
#!/bin/bash
|
||||
cd $(dirname $0)
|
||||
rm fawkes/files/* -rf
|
||||
node main.js
|
100
main.js
100
main.js
|
@ -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});
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
|
|
Loading…
Reference in New Issue