Next.js Discord

Discord Forum

Protect media in NextJS

Unanswered
Vespid wasp posted this in #help-forum
Open in Discord
Vespid waspOP
What would be the best way to protect media in a NextJS app? More specifically I have a PDF that's held on S3 and I'd like the user to be able to access this PDF, however we're a subscription service and therefore I don't want the user to be able to download or save the PDF locally in any way. I'm able to embed the PDF in my next app and my S3 bucket itself is protected but since I'm embedding the PDF the user can just download it. Are there any libraries or anything to help solve this? I tried using react-pdf to disable right clicks but that doesn't seem very secure + react-pdf is a pain.

18 Replies

Vespid waspOP
https://mozilla.github.io/pdf.js/web/viewer.html
this example from pdfjs is what i'm looking for (you can't download the pdf without clicking the download button) but idk how i'd recreate this in next
@Vespid wasp What would be the best way to protect media in a NextJS app? More specifically I have a PDF that's held on S3 and I'd like the user to be able to access this PDF, however we're a subscription service and therefore I don't want the user to be able to download or save the PDF locally in any way. I'm able to embed the PDF in my next app and my S3 bucket itself is protected but since I'm embedding the PDF the user can just download it. Are there any libraries or anything to help solve this? I tried using react-pdf to disable right clicks but that doesn't seem very secure + react-pdf is a pain.
joulev
1,
I'd like the user to be able to access this PDF
2,
I don't want the user to be able to download or save the PDF locally
1 and 2 cannot coexist – you cannot do both at the same time. Even if you don't show a PDF download button, even if you convert the PDF to image files on the server (so no PDF is sent to the browser), the user can always just... screenshot the images and save it to a new PDF
But if that's fine to you, convert the PDF to images then send those images to the browser
Vespid waspOP
yeah i should’ve clarified better, i don’t mind screenshots. all i want is to prevent the user from having that .pdf file in its full form
joulev
then you have to convert that pdf to a different format in your server, then render that different format in the browser
Vespid waspOP
even broken up segments of that pdf is fine, all i want to do is make it more difficult for the user to save it since as you said it’s not possible to fully prevent that
@Vespid wasp https://mozilla.github.io/pdf.js/web/viewer.html this example from pdfjs is what i'm looking for (you can't download the pdf without clicking the download button) but idk how i'd recreate this in next
joulev
this doesn't work because i can always just open the network tab and get the PDF url myself
Vespid waspOP
i used pspdfkit but had to move away from them due to their extremely high license costs and idk how they do it but even in my network tab i cant save the pdf
the blob of the pdf is there but it can’t be downloaded
i think my best bet is to use a library to convert each page into a seperate image and then just render tjay
that
joulev
yeah
you can split the images to several smaller pieces
Vespid waspOP
so the user would have to save every individual page as an image
joulev
and render them on the browser
@joulev you can split the images to several smaller pieces
Vespid waspOP
yeah this works too
thanks for the help