How to Download a Webpage - javascript

I'm trying to download a webpage from Instagram for offline use.
The result looks like plain HTML.
Any suggestion on how to download a webpage from Instagram so I could access it offline? but with the original site design.
Thanks.
I tried to Ctrl+S and save it as "Webpage, Complete", but the result is the webpage without any design.
I checked that the CSS files were downloaded, and saw them so they're not missing.
I also verified that the HTML file is referring to the correct location of the CSS files (and javascript), and it does.
Tried Chrome and Firefox
Windows 11.

Related

Chrome does not show the updated page after successfully uploading new files to the server

I use Hostinger for hosting. Although I uploaded my files successfully, Chrome won't show the changes, while windows Explore does. It seems that the browser remembers the old version of the page and doesn't download the new files. It's the same on my friend's computer and phone, whom I showed the page before the update.
The page is pure HTML, CSS, and a bit of JavaScript. How can tell my browser it's a new version of a page? Without manually clearing the browser history etc.
www.michalrucinski.com
https://github.com/michalrutz/porto
You could rename index.html to index.htm so the old file would longer exist and the browser would be forced to search for an alternative file.
Or you can set up cache control in the HTTP headers, e. g. using .htaccess if your hosting plan supports it.

Downloading an mp4 file using javascript

How do I allow users to download mp4 files from a different server that isn't owened by me? No approach I've come across has worked so far. Here's what I've tried:
The download attribute for a tags: Download - not working for me (as in - the attribute doesn't have an effect. Tested in Google Chrome)
Place a hidden <iframe> on the page - doesn't work either since I can't change the MIME-type, the video simply gets played back
Download using ajax - not a good solution as well, since this loads the entire file into the user's RAM. Some videofiles are 1GB+.
Is there any other method? Thanks!

Modifying local files embedded in a Google Chrome Extension using JS

I have been doing a lot of research and have been unable to find an answer to my exact question. I understand that having a google chrome extension that can write to local user files would be a major security breach and thankfully isn't possible. However in my extension is a .json file that is used to make a HTML webpage with links via JavaScript. The JS reads the .json file and inserts the lines of code on the html page. I am attempting to make a user interface that allows them to update and edit the .json file that is inside the extension in order to add new lines of code to the webpage, but have been unable to find anything that could make this work due to security issues. I was thinking that since the file is in the extension users should be able to modify it.
If that was confusing here is a flow of what I want to happen and where it is not working:
Works:
Users clicks on button that takes them to a webpage hosted in the extension -> when page is loaded, the javascript runs -> the JS looks at a .json file in the extension using an XMLHttpRequest, parses the data, and then inserts it into the html -> The user now see's the content that was contained in the .json file on the html page.
Doesn't work:
After this I would like to have an interface that will allow the user to edit this .json file in order to update the page as they see fit, all in the extension itself.
If it was just me using this extension I could simply use the chrome storage api's available, however this is for my team at work, who are wanting to make edits as we need. Which means we will all be editing the same .json file.
Any information regarding this would be very beneficial. Even if it's as simple as it can't be done. Either way manually editing the .json file without a simple UI is much easier than editing the html directly.
Thanks in advance!
Posts/Articles I have looked at regarding this question:
Access Local Files using a Google Chrome Extension
https://developer.chrome.com/extensions/storage
Local file access with javascript
Allow Google Chrome to use XMLHttpRequest to load a URL from a local file

<a href /> download tag not working on Firefox/Safari for a PDF file

I have a personal website made with ReactJS hosted on github pages.
I have a pdf file located at /docs/resume.pdf
When I try and use:
Download
The browser navigates to https://mydomain.me/docs/resume.pdf but just displays my main ReactJS page.
From googling around, this may be caused by the React router? I am not a web developer, but I tried to use the download tag as a solution.
However,
Download
only works for Chrome or if I right-click download the link on Firefox/Safari. If I left click in Firefox/Safari, a download pop-up appears but the file that is downloaded is under 1kb and is corrupted.
When examining the above process in the Firefox dev tools, there is a GET request for my resume.pdf but no response. I want to reiterate that the process works fine on Chrome and the resume.pdf file is present and accessible on the server.
Does anyone have any idea what is causing this or how to solve it?
Edit: It's not related to using an external link, I'm using a relative link to my file.

How to embed a pdf into a html page for android browsers

So,
At the moment I embed a base64 encoded pdf into a html page using iframe and I have no problem with this but I want to display it also on android browsers like chrome and firefox.
I also tried object or embed tag but none worked.
What should I do ?
You should try Viewer.JS or PDF.JS. If none of those work, you could possibly use Google Docs Viewer. This site will help you generate the URL for that : iTools.com. I prefer Google Docs currently because the performance is a little sluggish using both of those Javascript viewers. Keep in mind that in order for the Google Docs Viewer to work, you must have the file published to the web and accessible for Google's servers.
Another option would be to use a conversion library (such as imageMagick) to turn the PDF into an image and then offer a link to the full file. If your html is going to be viewed by other devices such as desktops, you could always check to see if Adobe Reader is installed and then, if not, offer an image instead with a link to the file. I use PluginDetect to check for support for PDFs.
There are other commercial options like iSSUU or FlexPaper but I don't have any experience with those. iSSUU is a software service that allows embedding viewers on your website and FlexPaper is a software that you buy and install to your website.
This is assuming you're trying to embed a PDF to a website. :/

Categories

Resources