// backend/server.ts
import express, { Application, Request, Response } from 'express';
import mongoose from 'mongoose';
import cors from 'cors';
import dotenv from 'dotenv';
const multer = require('multer')
const upload = multer({ dest: 'uploads/' })
const { mongoDBURL } = require('./config');
dotenv.config();
const app: Application = express();
// Middleware
app.use(cors());
app.use(express.json());
// Database connection
const MONGODB_URI = mongoDBURL;
mongoose.connect(MONGODB_URI)
.then(() => console.log("MongoDB connection established"))
.catch(error => console.error("MongoDB connection failed:", error.message));
// Routes
app.get('/', (req: Request, res: Response) => {
res.send('Hello from Express + TypeScript Server');
});
// Start server
const PORT: number | string = process.env.PORT || 5001;
app.listen(PORT, () => {
console.log(`Server is running on port: ${PORT}`);
});
app.post('/upload', upload.fields([{ name: 'video', maxCount: 1 }, { name: 'subtitle', maxCount: 1 }]), (req: Request, res: Response) => {
const files = (req as any).files; // Use type assertion here
if (files) {
res.send({ message: 'Files uploaded successfully.', files: files });
} else {
res.status(400).send({ message: 'File upload failed.' });
}
});
I am attempting to upload 1 video file and 1 subtitle file at the same time to my mongo database. I am very new to this so I am sorry if my code is gross. When I try and upload the files I get a console message saying it was successful and shows me some of the data.
const UploadComic: React.FC = () => {
// State to store the uploaded files
const [videoFile, setVideoFile] = useState<File | null>(null);
const [subtitleFile, setSubtitleFile] = useState<File | null>(null);
// Handlers for file selection
const handleVideoFileSelect = (file: File | null) => {
setVideoFile(file);
};
const handleSubtitleFileSelect = (file: File | null) => {
setSubtitleFile(file);
};
// Inside your component
const handleAddToLibrary = () => {
if (!videoFile || !subtitleFile) {
alert('Missing files');
return;
}
const formData = new FormData();
formData.append('video', videoFile); // Assuming 'video' is the field name expected by the server
formData.append('subtitle', subtitleFile); // Assuming 'subtitle' is the field name expected by the server
axios.post('http://localhost:5001/upload', formData, {
headers: {
'Content-Type': 'multipart/form-data',
},
})
.then((response) => {
console.log('Files uploaded successfully1', response.data);
// Handle success
})
.catch((error) => {
console.error('Error uploading files', error);
// Handle error
});
};
Im not sure what im doing wrong but it will not upload to mongodb, It did one time but I could not replicate what happened. If you have any suggestions or even if my code is bad that would be helpfup too, it is important to note i have asked chatgpt for help so any random code could be caused by that.
I have tried a couple different ways but I was expecting it to upload or to throw an error but neither happened.