I've successfully integrated the FileReader() that renders a file from a BLOB so the user can view and interact with it, however the revised criteria states that the user shouldn't be allowed to download the document now.
The requirement is that the download icon is removed from the FileReader() but I can't seem to find a way of doing this, as it's baked into the actual Web API.
I started to write my own PDF viewer using a basic Vue to PDF package and adding custom controls but this is a bit of a monster and I'd like to avoid a complete re-write to remove one action.
Is there any way of removing the download CTA before it renders the PDF?
More context..
The PDF is rendered in the DOM from a BLOB that's passed via an end point I hook into with Axios. I then readAsDataURL(blob) and finally create the FileReader() result as a URL.createObjectURL(blob) to give me the data that I render as the canvas src to enable the PDF viewer. Unfortunately this can't be a PNG as it needs multi pages. Thee issue is that it's sensitive docs that can only be viewed on the portal, so it's to prevent users from easily downloading (aware they could just print screen).
Related
I am currently using flutter InAppWebView Plugin. I want to save a web page as a pdf file when the url of the page is given. I have used the printCurrentPage() method of the InAppWebView plugin but it does not return the filepath back to the app after saving the file so that it can be shown in a list view in the app itself. Can anyone help me save the webpage as a pdf and show the saved files as a list view.
I have tried webcontent_converter plugin too but it looses some content of the page like images and icon to include in the pdf file.
I am working on a project using Gatsby, Strapi and Cloudinary. I am deploying the frontend on Netlify and the Strapi app on Heroku (with the addition of a Postgresql database instance).
I have been searching for weeks now and but I cannot seem to find a way to lazy-load images sourced through Cloudinary.
I have replaced the default rich content editor on Strapi with the ckeditor so editors can add photos to their content. These are automatically uploaded and served by Cloudinary.
My question is, is there a way to lazy-load the images, and if so, should this be done when serving them from Cloudinary, should I do this as a Strapi middleware or simply through Gatsby?
Note: I am not sourcing the images anywhere on the front-end since it's parsed as html from Strapi. All I'm currently doing in passing the fetched content to a div using
dangerouslySetInnerHtml.
With dangerouslySetInnerHtml directive you are inserting whatever is inside your rich text as HTML content so you lose control of customizing the behavior of that content. Hence, it will be rendered all at once.
There's no built-in way of doing this except by parsing your rich text with a third-party dependency (which I haven't been able to find)/custom method that will give you the capability of wrapping your images with any custom component. The idea, either way, is to parse your rich text blocks to customize the output.
In addition, check if the images tag (<img>) comes with the loading=lazy property attached:
<img src="image.jpg" alt="..." loading="lazy">
The application has to show invoice PDF inside <div> which is currently rendered in Webapp itself.
For example :
The web app already has the PDF generation functionality which generates by clicking on generate_pdf function.
I want to show the same PDF by using the same function which is currently available for the public.
Example URL:
http://URL/index.php/pulic/view/generate_invoice_pdf/Smgr4NX7yiWfu3J6qhdtRzF9lVT0kLs2
I have tried InAppBrowser however, it opens up outside the app just want to show inside the app.
DocumentViewer is not supported since it does not contain .pdf in URL
Anyone who needs the solution
I use fileTranfer to download the file and File to show it on the device.
I want to use something along the lines of JQuery file upload (i'm open minded) in a form with lots of other fields for the UI (ex. image previews, delete, file sizes .etc), but I want to submit the files along with the form as if i used a normal HTML file field.
Is this at all possible?
If you console.log() the form after submission you will get an object in return that has a bunch of information. Among that information you can find for example file information of the file you just upload.
You can check this http://jsfiddle.net/1r0Lprkj/1/ and open your console after you've submitted the form.
Then if you want to go deeper into this, then you can check out the Javascript FileReader which lets you do a bunch of cool stuff with the uploaded file. https://developer.mozilla.org/en-US/docs/Web/API/FileReader
To answer your question; Yes it is possible to achieve without AJAX.
I'm currently using the CKEditor and have it working with image upload and browse functionality. In another area of my application, I want to let the user upload an image to the server, but there is no need for a text area at this point. Is it possible to create a simple link or button that launches the upload functionality from CKEditor without actually plopping the textarea/html editor in the space I want my button?
i.e this would be perfect (with javascript too, of course)
<i class="icon-picture"></i> Upload