8 Free Ways to Download Embedded Videos from Websites
Video streaming and VOD are embraced more than ever. But sometimes, people still want to download embedded videos from a web page to the local drive or external hard drive. For digital hoarders, nothing compares to the peace of mind when you save videos offline, knowing that you will always have access to a favorite clip even if the source file is removed from a server. There are other benefits too. With offline videos, you can scrub through them quickly, without waiting for network buffering; you can also transfer it to an iPad or any other devices to watch on the go.
So, how to download embedded videos from a specific webpage? It’s less likely that you can simply right-click on a video and save it as MP4 nowadays.
Websites embed video in different ways, by various video services. The tool that works for one site might struggle with another. Embedded videos root from various kinds of hosting services, such as YouTube videos, Vimeo, Wistia Video. There are also videos embedded in JW Player, an HTML5 Video Player for self-hosting and video-hosting companies. Already discouraged? There are also HSL streaming m3u8 playlists and DASH videos.
This post covers 8 free ways to grab those embedded videos, so that you can flexibly resort to a method in specific situations. The methods include using a dedicated desktop downloader, leveraging the developer tools in Chrome and Firefox, or resorting to website tools, browser add-ons, and VLC player.
Mục lục
1. Download Embedded Videos Easily with Desktop Client
Downloading embedded videos usually include these process: find the page link that contains a video, parsing the link to detect the actual video link, analyzing available assets (most video hosting sites offers multiple video resolutions), and save the media to the local disk.
The problem is, do you want to do the entire process manually or resort to a dedicated software to find the link.
Programmers and geeks may have fun mingling with codes. For common users, however, the most convenient way is to have a tool that can automate the process. That’s where VideoProc Converter comes to help. It can analyze the website URL of the the embedded videos, and find out the corresponding link that truly contains the video file. Let’s see how it works:
Preparation: Download and install VideoProc Converter on your Windows or Mac computers.
Step 1. Launch the program, and click the Downloader icon from the main screen.
This app is light-weight and works for both Windows and Mac computers.
Step 2. Click the Add Video button, and paste the link of the website page that contains the video you want to download.
Bonus Tip:
Certain sites have more restrictions to prevent the downloader from analyzing the video URL. But don’t worry, you can follow the steps in method 4 to find the correct URL, and then pasted it into VideoProc Converter to download the embedded video.
Step 3. Hit the blue analyze button, and choose the output file format and resolution when the analysis is done.
You can repeat the process to add multiple videos into the queue.
Step 4. Hit the Download button to save all the videos on the queuing list to your local disk.
Bonus Tip:
VideoProc Converter also helps you to record live-streaming videos, at original high quality, and preserve sounds in the video. With a built-in editor and converter, this App allows you to cut and edit videos with ease. You can trim unwanted parts off, enhance video quality, remove background noise from the video, etc.
Disclaimer: Make sure you have permission from the content owner before downloading, or grab videos that are in the public domain.
2. Download an Embedded Video with Chrome Developer Tool
More often than not, you cannot directly see the true link address of the video. Gone are the times when you can right-click on the video and select copy address. With the help of Developer Tool, you might be able to find out the video link. Let’s jump into the steps:
Step 1. On the website page with the video you want to download, right-click and select the Inspect option (also known as the Developer Tool). If websites that block right-click, there are three ways to bring up the Inspect tool:
- Press F12 on the keyboard.
- Press Ctrl+Shift+I simultaneously (for Mac, replaces Ctrl with Cmd ⌘ key).
- Click the settings (a three-dot icon in the upper right corner) in Chrome > More Tools > Developer Tools.
Tips:
The inspection tool is docked to right by default. If it somehow changes position, and you feel the layout unfamiliar, you can click the settings icon and choose the dockside again.
Step 2. Click the Network tab. It sits between the Sources and Performance tabs.
Step 3. Under the Network tab, click the Media tab, which is next to JS, CSS, and Img.
Step 4. Now start playing the video on that page, and you will see a media file with an extension of MP4 or other video formats.
Note:
1. If there are too many items displayed in the Media, you can refresh the browser, pause and restart playing the video.
2. If you don’t see anything under the media, you need to refresh the page and make sure the video is playing. Because this feature in the developer tool is trying to record what’s going on, and if the video is stopped/paused, you won’t see it show up as network activity.
To recap, here is what to do when media isn’t showing up:
- Press the Refresh icon (F5) to refresh the page; you can even press Ctrl+F5 to force refresh the page (Cmd+F5 on Mac).
- Make sure the video is playing.
- Hit Ctrl+R to record the reload of the network activity.
Step 5. Right-click on that media > Copy > Copy link address. It will be an address that ends with the file extension.
Tips: You can also download embedded flash video files with this method. Simply find the address that ends with .swf instead of .mp4. But you have to be quick because the Flash videos are being phased out in popular browsers. Adobe will stop supporting Flash on Dec. 31, 2020.
Step 6. Open up a new tab in your browser, paste that address, and hit Enter.
The browser’s default player will play the video, and also gives you the option to save it.
Step 7. Right-click on the video, hover to the option Save video as.
Step 8. Select an output folder on your local drive. You can also rename the file during this process. Click Save and wait until the downloading finishes.
It relies on the downloading utility of your browser, and can be unstable sometimes, especially for large size videos. It’s a nightmare when the downloading is stuck at 99%, and resume downloading starts all over again instead of finishing that last one percent.
3. Download an Embedded Video with Firefox Page Info Tool
Downloading embedded video via Firefox is slightly different from Chrome, but the inherent logic is to find the true URL of that video file. If you right-click on the page, go to Inspect Elements > Network > Media as one normally does on Chrome, there might be nothing in Firefox.
Instead, you can find the URL in Page Info. Here is the detailed instruction:
Step 1. Right-click on the web page that contains the video you want to save.
Step 2. Click View Page Info.
Step 3. Hit the Media tab, and find the address of the video file type.
If there are too many elements on the page, you can enable the Type filter to view Address by Type.
Step 4. Copy and paste the link in a new tab, and right-click on the player to save the video.
4. How to Download Video from Embed Code
To download video from a specific website, especially when the video is embedded with a media player that is less popular, the trick is to find its embed code to save the video.
If you see a Share option, chances are that you can find the chuck of HTML link to embed the video. Generally, videos embedded on a page use the HTML <iframe> tag or <div> tag, with which you shall see code like this:
Step 1. Copy the embed code of the video.
You can click the Share button (if available) on the video player embedded on a website page, hit the “Embed” tab, and copy and paste the code into a text editor such as Word from Microsoft Office, or Notepad.
Alternatively, you can also use the Inspect Tool of the browser (the developer tool) to see the source code, and press Ctrl+F to find something within the <iframe></iframe> tag.
Step 2. Find the string src=”https://www.xxx.xxx”. The URL inside the quotation mark is the embedded video.
Example:
Here is the embed code of a video embedded on a dog food blog:
You need to find the link within the scr=”” string.
Note: Once you find the embedded video link, you still cannot directly download it. You need to use a dedicated Video Downloader software to analyze the link to save the video.
The recommended tool is VideoProc Converter introduced in method 1 above.
Step 3. Copy and paste the URL into VideoProc Converter to extract the embedded video from the website.
Free download VideoProc Converter to extract embedded videos from websites now:
5. Save Embedded Videos to Local Disk with VLC
VLC supports playing online videos directly inside the VLC player, or convert the URL into an MP4 or other video formats. However, it does not support parsing the webpage link to find out the URL of the video file. You still need to manually find out the link before pasting it into VLC.
You may wonder, why not use the developer tools introduced in the previous part? The fact is, not all the link addresses can be directly downloaded using the browser’s default downloader. For instance, besides MP4, WebM, or FLV files, there are media files streamed via m3u8 playlists. With VLC, you can convert m3u8 to mp4 easily and safely.
Taking twitter embedded videos as an example:
Step 1. In the develop tools window (F12), when you navigate to Network > Media, and refresh the page, you cannot find something that ends with MP4. Let’s try searching m3u or m3u8 instead.
Step 2. You shall see some results. Copy out the code and paste it in a text editor, such as Microsoft Office Word.
Step 3. Find the address that ends with .m3u8 in that large chunk of code.
It is something that looks like this:
https:\/\/video.twimg.com\/amplify_video\/blahblah\/pl\/blahblah.m3u8
Step 4. Replace \/ with // and you will get something like this:
https://video.twimg.com/amplify_video/blahblah/pl/blahblah.m3u8
With the link at hand, now let’s see how it works in VLC:
Step 5. Download and install VLC from its official site.
Step 6. From the menu, click Media > Open Network stream (For Mac version: File > Open Network). The hotkey is Ctrl/Cmd+N.
Step 7. Copy and paste the video address into the box.
Step 8. Switch the option from Play into Convert.
For Mac users, the option is slightly different. Check the Stream output box, and click Settings.
Step 9. In the newly opened window, select the output format and destination folder. Name your file while selecting the local folder.
Step 10. Click Start and wait until VLC finishes its job. You shall see the blue progress bar reaches the end, and go open the destination folder to check the video.
6. Download Embedded Videos with Extensions
Using online extensions for Chrome and Firefox, you can rip embedded videos from websites easily. Below are some of the popular tools and tutorials to use them.
Video DownloadHelper
Video DownloadHelper is available in Chrome Webstore and Firebox add-on store. Do not search it directly in the extension store, because there are tons of extensions sharing similar names. Make sure the one you install has an icon of red, yellow, and blue balls.
It can parse the address link of the website videos and save them to your local disk. The success rate is relatively high, and it supports videos embedded and streaming under different protocols, including HLS (HTTP Live streaming) and DASH videos.
How to download embedded video with this add-on:
Step 1. Install the extension to your browser. If it doesn’t appear in the extension bar, you can manually enable it and pin this extension.
- For Firefox users, go to Settings > Add-ons. You can also use the shortcut key Ctrl+Shift+A.
- For Chrome users, go to Settings > More tools > Extensions.
Step 2. Refresh the page that contains the video you want.
If the Video DownloadHelper is greyed out, or it says “No video to process in the current tab”, make sure you have hit the Play button of the video. Then you shall see the icon turns colorful, and can detect the video that’s playing.
Step 3. Click on the extension, and select a format and resolution preset you like. If you have high-speed network, you can download 1080p or even 4k videos.
This extension also allows you to download image galleries and intuitively name the video files. It can block ads and annoying pop-ups.
FVD (Flash Video Downloader)
FVD downloader has been around for years and has more than 2 million users. Flash video technology is indeed outdated, and Adobe will no longer be supporting it after Dec. 31, 2020. FVD still works for other types of online videos, despite its name that mainly targets Flash videos. If the above extension fails, you can switch to FVD to grab videos on a website page. Here is the detailed guide:
Step 1. Visit Google Webstore for extentions.
Step 2. Search for Flash Video Downloader. Many extensions are sharing an identical name. Make sure you find the one offered by NextGenDev.
Step 3. Click Add to Chrome. The browser will start downloading this extension, and automatically install it after downloading. If the installation doesn’t start, you can click the downloaded file to manually install it.
You shall be able the see the extension appeared in the upper right corner of the browser. If you cannot find it, click the extension settings (a jigsaw-shaped icon) and pin FVD downloader to the bar.
Step 4. Go to the website page that embeds video, and click FVD to parse the video address.
Step 5. Click the download button.
The download button will trigger the default downloader of Chrome. If you fear network error will break large file downloading and lose everything, you can also click the Copy Link icon, and Paste the link to other dedicated downloaders that support resume downloading.
7. Download Embedded Videos with Online Tools
You can also extract embedded videos from websites using online downloaders. These online tools work more or less the same: copy and paste the webpage addresses, wait for the tool to analyze, select output settings, and start downloading. Some online tools will automatically open up new tabs in every process, or require you to watch ads and then go ahead downloading. There are still other tools that go without ads, but put limitations on video length.
There are other concerns. Some online tools only work for a specific hosting service. For instance, there are dedicated Dailymotion downloaders that may not work for Facebook or Twitch videos.
Therefore, when it comes to online tools, it’s more about which tools to use than about how-tos.
Once you encounter an embedded video on a page, the first thing is to determine which server is hosting that video. For instance, YouTube and Vimeo videos have different player interface designs that you can quickly recognize it.
- For embedded YouTube videos, we tested and verified these tools nice and ads free: You can read detailed reviews and tutorials in this Free YouTube Clippers post.
- For Twitch videos, tools offered by getfvid.com and untwitch.com are handy and efficient.
- For videos embedded on Reddit, redditsave.com works nicely with sound and audio preserved too.
8. Capture Videos from Websites to Save Embedded Videos
For websites with specific restrictions and codes to prevent you from finding the video URL, the workaround is to capture the embedded video.
With professional video capture software, you can save the embedded video from a website at a high resolution that your display device permits.
FAQ
How do I download an embedded video from a news website?
There are generally 4 ways to download videos embedded on a news website: 1. Using a dedicated video downloader to analyze its link; 2. Using the developer tool to find the network activity and thus identifying its video URL; 3. Use browser extensions; 4. Capture the video. Sometimes, analyzing the webpage link won’t work, so you need to find out the true link pointing to the video, using the methods listed on this page.