Bro after uploading when i click on the link which sent by the cloudinary api its shows failed to load PDF document how to fix this? Should I give any permission?
There are many reasons due to which it can occur. First test your api through postman just to be sure that issue is with fronted. If you are not able to solve the issue dm me on instagram @the_debug_arena
The physical pdf is actually stored in your server. I suppose it'd be better to place it somewhere online, such as using Firebase or any cloud platform.
Yes buddy you are correct. When you will host your website you can give path to some folders of your server and this method will work. But this is also good way to store pdf at some cloud platform and then get from there. I will be making video on this also very soon.
@@thedebugarena Yeah, thanks for the video. I love to build and share for improvement. My thought on the approach in the video is that it's not scalable.
I have a doubt how to handle the validation in the backend for the title (because even if title is not present file upload is happening) I have the same case , but with image upload with title and description. If title or description is not present in the request then no need to upload, only when all 3 (title, description and proper image is present ) then only upload. But in my case the upload is happening (with valid image, but without title or description given). How to handle this scenario ? I need to prevent the upload process if a title or description is not present
It is pretty simple. In backend api we are accepting image and title through req.body so after accepting req.body add condition that if(req.body.title==null) return res.json() Make sure to modify condition as per your requirement and don't forgot to add return before sending the response. Try this and if you are not able to do this then dm me on instagram.
@@thedebugarena Thanks for the quick reply, below is my code - I am testing from postman - type as form data app.post("/uploads", (req, res, next) => { upload.single("photo")(req, res, (err) => { const { title, description } = req.body; if (!title || !description) { return res .status(400) .json({ error: "Title and description are required" }); } if (err instanceof multer.MulterError) { return res.status(400).json({ error: err.message }); } if (!req.file) { console.log(req.file); return res.status(400).json({ error: "File not uploaded." }); } res.send(req.file); }); }); This code works fine but only issue in validation. First validate and if ok then only upload, but even though the title/description is not present file upload is happening.
yes bro still i have problems .i passed the form data to back end but when i console req.body it shows an empty object. But when i console req.file it shows undefined
@@thedebugarena I think he is talking about how you used require instead of using exports and imports, maybe I'm not sure. A good video nonetheless 👍
@@thedebugarena Your logic is pretty good but the thing you are missing are proper file structure and and proper seperation of logic. You could have easily broken down your code into more manageable components.(That's what react helps the most with) cheers !! Great effort !!
thanks brother...
You saved my day. I've been struggling with this for last 2 days straight...
thanks alot
Thanks. I am able to complete my project watching only your video..
Bro after uploading when i click on the link which sent by the cloudinary api its shows failed to load PDF document how to fix this?
Should I give any permission?
Thanku bro it was really helpful 😄 , subscribed you !
i get this error
Module not found: Error: Can't resolve 'pdfjs-dist/build/pdf.worker.min.js'
Try to install pdfjs package again
I got axios network error how can I solve it
There are many reasons due to which it can occur. First test your api through postman just to be sure that issue is with fronted. If you are not able to solve the issue dm me on instagram @the_debug_arena
Same please help
i couldn't get the folder "files" created after writing the code. How to resolve?
Try manually creating the folder and then upload the image or Dm me on instagram
@@thedebugarena sortedd! Thankyou
If it works for me, truly, I’m gonna pray for you to get all the things you want in this life❤
how to take formData on backend side req.file or req. ?
There are many ways you can take but commonly used method is req.body. if you want more information you can watch first video of this playlist
can we upload both images, pdf with separate multer middleware & having both together >? if yes suggest some resources
Yes we can upload both images and pdf with separate middleware. You can ask Chat GPT he will provide solution.
@@thedebugarena ok nice
The physical pdf is actually stored in your server. I suppose it'd be better to place it somewhere online, such as using Firebase or any cloud platform.
Yes buddy you are correct. When you will host your website you can give path to some folders of your server and this method will work. But this is also good way to store pdf at some cloud platform and then get from there. I will be making video on this also very soon.
@@thedebugarena Yeah, thanks for the video. I love to build and share for improvement. My thought on the approach in the video is that it's not scalable.
@@hoangng16 you are absolutely correct. Thanks for sharing your thoughts.
Bro i wanna attach image of pdf and pdf itself and display respectively, how do i do it
Didn't get you.
Great video mahn..thanks a lot
I have a doubt how to handle the validation in the backend for the title (because even if title is not present file upload is happening)
I have the same case , but with image upload with title and description. If title or description is not present in the request then no need to upload, only when all 3 (title, description and proper image is present ) then only upload. But in my case the upload is happening (with valid image, but without title or description given). How to handle this scenario ?
I need to prevent the upload process if a title or description is not present
It is pretty simple. In backend api we are accepting image and title through req.body so after accepting req.body add condition that if(req.body.title==null) return res.json()
Make sure to modify condition as per your requirement and don't forgot to add return before sending the response.
Try this and if you are not able to do this then dm me on instagram.
@@thedebugarena Thanks for the quick reply, below is my code - I am testing from postman - type as form data
app.post("/uploads", (req, res, next) => {
upload.single("photo")(req, res, (err) => {
const { title, description } = req.body;
if (!title || !description) {
return res
.status(400)
.json({ error: "Title and description are required" });
}
if (err instanceof multer.MulterError) {
return res.status(400).json({ error: err.message });
}
if (!req.file) {
console.log(req.file);
return res.status(400).json({ error: "File not uploaded." });
}
res.send(req.file);
});
});
This code works fine but only issue in validation.
First validate and if ok then only upload, but even though the title/description is not present file upload is happening.
what i've been searching for. Thank You
When i console req.file it shows undefined
Try req.body and if issue is still there dm me on instagram
yes bro still i have problems .i passed the form data to back end but when i console req.body it shows an empty object. But when i console req.file it shows undefined
@@amal-uz1cj dm me on instagram
@@thedebugarena link?
@@amal-uz1cj the_debug_arena
You are a god to me now. Thank you so much.
need your help where can we connect
Dm me on instagram @the_debug_arena
Thank you sir....very helpful
thank you bro!! , it is very helpfull
Thanks, very helpful. Really thanks.
if i want to do this for jpg , pdf and docx all then ? let assume that we dont know which type of file user will be upload
You can just change the file type to all. In input box just give type='file' nothing much then it will accept all types of files.
It doesn't work for hosted api bro. It is not a good practice.
It's should work you will have to modify that properly
what a wonderful video
This was excellent! thanks !
thank you so much bro
Next part is also out on how to show that pdf in react make sure to checkout that also. Thnx.
when it uploaded @@thedebugarena
@@sonasreedhar5867 2 days ago only you can find link at the end of this video
Thanks sir
Stay Tune for more
Thank you
Amazing!
📌
Following the worst practices, don't follow him guys.
Can you please mention the mistake also
Reason?
@@thedebugarena I think he is talking about how you used require instead of using exports and imports, maybe I'm not sure.
A good video nonetheless 👍
@@destrobro7044 yes that's another way to import will use that In some other video.
@@thedebugarena Your logic is pretty good but the thing you are missing are proper file structure and and proper seperation of logic. You could have easily broken down your code into more manageable components.(That's what react helps the most with) cheers !! Great effort !!
thank you bro!! , it is very helpfull