<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="https://cdn.tailwindcss.com"></script>
</head>
<body>
<form method="post" enctype="multipart/form-data"></form>
<label
class="block mb-2 text-sm font-medium text-gray-900 dark:text-gray-300"
for="default_size">Default size</label>
<input
class="block mb-5 w-full text-sm text-gray-900 bg-gray-50 rounded-lg border border-gray-300 cursor-pointer dark:text-gray-400 focus:outline-none dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400"
id="upload"
name="upload"
onchange="wew()"
type="file">
</form>
</body>
<script>
async function wew(){
let formData = new FormData();
let fileupload = document.querySelector("#upload");
formData.append("upload", fileupload.files[0]);
await fetch('/upload', {
method: "POST",
mode: "no-cors",
body: formData
}).then(res=>{
return res.text()
}).then(res=> {
console.log(res)
})
}
</script>
</html>
//NODE JS
const express = require('express');
const fs = require('fs');
const path = require('path')
const formidable = require('formidable');
const app = express();
const http = require('http');
const server = http.createServer(app);
app.post("/upload", (req, res) => {
let form = new formidable.IncomingForm()
form.parse(req, async (err, fields, file) => {
let filepath = file.upload.filepath
let newpath = './object_detection/upload/';
newpath += file.upload.originalFilename;
console.log(__dirname)
fs.rename(filepath, newpath, function () {
res.write('NodeJS File Upload Success!');
res.end();
});
});
});
app.get('/', (req, res) => {
res.sendFile(__dirname + '/object_detection/index.html');
});
server.listen(3000, () => {
console.log('listening on *:3000');
});