Bandwidth Data implications of embedding Youtube videos in my website - youtube

If I embed a Youtube video on my web page, what are the data usage implications on my server?
I have a shared web hosting plan for my website with a data transfer limit of 5 GB/month. When a user plays video on my site, is my server taxed for data transfer i.e. if the video is of size 1GB, is my data transfer limit decreased by 1GB?
And is my server processor taxed for video streaming?
What other things should I be concerned about?
Is there any link you can point me towards? That will be helpful.
Thanks

Both the youtube player and the video content is streamed from Youtube's server. The only price you pay is the few bytes it takes to add the video player embed code in your HTML pages.

When you embed a YouTube video, it streams directly from YouTube's servers.
Your server is not involved.

When you insert youtube or any embed code in your html page, your server serves the html content to the user's web browser / client (technically means user's web browser). And this html content is processed and translated by the client/ user's web browser. This means that it is served by your server as a link, but when the client translates it, it becomes an action; an action to pull content from the somewhere. So the client (user's web browser pulls the video from the specified url embedded in the iframe. In turn, the bandwith been used are calculated from

In addition to what Etienne Perot said,
There are 3 nodes in play here, namely:
Your server
Youtube Servers
The Client (i.e the user accessing you website)
In simple words: embed is an html tag that allows you include a link to a resource. And since youtube's embed goes in the form of youtu.be/foo or youtube.com/foo. Your browser simply parses (processes the link) and gets the content from that link, thereby visiting youtube website (underground) to fetch the referenced link without going through your server nor anything like that.
Meanwhile when you insert youtube or any embed code in your html page, your server serves the html content to the visitor's web browser / client (technically means visitor's web browser). And this html content is processed and translated by the client / user's web browser.
This means that it is served by your server as a link, but when the client translates it, it becomes an action; an action to pull content from the somewhere. So the client (user's web browser pulls the video from the specified url embedded in the iframe.
In turn, the bandwith been used are calculated from
The client (i.e the bandwidth used to access in the internet and the video's url) - calculated or billed by your ISP from your data active subscription.
Youtube's Server (i.e the bandwidth from the server that serves the content being streamed) - calculated or billed by google cloud service from their inhouse cloud resource allocation.
If you use the google chrome browser, you can check this our by right clicking on the video and clicking inspect element, then switching to the network tab; you might have to hit refresh so that the page tries to get all the content loaded all over again: the purpose of this is to see where the content is loaded from.
See Network Analysis Reference on how to use the network tab in google chrome developer tools. Mozilla firefox and some named browsers also have the inspect element and network monitor feature.
I hope this helps somebody.

Related

How to find out what my live stream URL is?

I am trying to stream from obs or similar to maybe restream, but I also want to send the feed to a custom RTMP player on my site, it's asking for the Live Streaming URL. How can I find that?
I believe obs asks you to connect to a streaming platform (I think this is what you meant by "restream"). Depending on the platform you are streaming to (Twitch, Youtube, etc), then you would need to get the URL from that site. Connect to one of these first and it should give you a URL. I think YouTube requires 24 hours to enable live streaming.
If you can stream directly to your website I am not aware of it. Reason being, in most cases you have a dynamic IP or port that is not open for your website to view the original stream from your Obs software/computer.

Images are not loaded in WAPT Pro

I am trying to record a web test for an ajax based web application using WAPT Pro. Web site images, css, javascript are not captured by WAPT Pro.
Is there any setting available to record capture the images of ajax web application?
WAPT captures all HTTP requests issued by your browser. By default, css, js and image files are recorded as page elements. You can find them on the "Page Elements" tab. Note also that it is highly recommended to clear browser cache before recording. Otherwise some page elements may be taken from the cache instead of loading them. You can select the corresponding option in the "Recording Options" dialog.

How does this website detect the user's current URL from a different domain?

This is a website which is relevant to the topic that I am researching - getting an IFrame's current URL address from another domain.
Here it is: http://hidemyipaddress.org/ (to use it simply go to the bottom, enter a website address and click "go").
You can surf any website through their website - and the amazing thing is that they can keep track of your current location, and even show it to you. (Here is a picture to illustrate: http://img199.imageshack.us/img199/6343/image2eb.jpg)
The reason I am asking is because I am trying to do the same thing.
How is this possible, isn't that XSS or something? Thanks for taking your time on this.
This is web based proxy. When you enter an address into the proxy address input and hit search, you are requesting that the proxy server retrieves the website for you. The proxy server requests the page you have asked for, parses the HTML so that all URIs are "proxied URIs", adds any additional HTML such as banners and then returns the page in the http response.
If there were an iframe, the current URL of the iframe would actually be on the same domain. It's a proxy, so the server at hidemyaddress.org is actually returning the html to your client. Furthermore the address of an iframe would be irrelevant. The uri in that address box would just displays the address that you requested. It would not reflect on the src of an iframe or the current location of that frame.

YouTube embed/API player redirects from HTTP -> HTTPS, API is inaccessible

When I attempt to load an embedded video onto my page, using the following:
<embed src="http://www.youtube.com/v/BzC135ql_wA?version=3&enablejsapi=1"></embed>
the request is automatically redirected from HTTP to HTTPS- as a result the API is inaccessible, because of browser security limitations.
This appears to be related to my Google account, as it doesn't redirect if I try from an incognito window. However, this worries me- some users of my site won't be able to use the page as I intended, and as far as I can see I will have no way of knowing.
Is there any way to force HTTP, or anything else I can do here, short of hosting my own site on HTTPS?
There are a number of browser extensions that automatically translate http:// URLs into https:// for a specific set of domains. I'd imagine that you're using one such extension, which would explain why you don't see that behavior in an Incognito window. I can't tell you which extension you might be using—I know that HTTPS Everywhere is popular on Firefox, but not sure which are commonly used on Chrome—but take a look at chrome://extensions/ for any likely culprits.

What are the steps involved from entering a web site address to the page being displayed on the browser?

And how can the process be speeded up from a developer point of view?
There are a lot of things going on.
When you first type in an address, the browser will lookup the hostname in DNS, if it is not already in the browser cache.
Then the browser sends a HTTP GET request to the remote server.
What happens on the server is really up to the server; but it should respond back with a HTTP response, that includes headers, which perhaps describe the content to the browser and how long it is allowed to be cached. The response might be a redirect, in which case the browser will send another request to the redirected page.
Obviously, server response time will be one of the critical points for perceived performance, but there are many other things to it.
When a response is returned from the server, the browser will do a few things. First it will parse the HTML returned, and create it's DOM (Document Object Model) from that. Then it will run any startup Javascript on the page; before the page is ready to be displayed in the browser. Remember, that if the page contains any ressources such as external stylesheets, scripts, images and so on, the browser will have to download those, before it can display the page. Each resource is a separate HTTP get, and there are some latency time involved here. Therefore, one thing that in some cases can greatly reduce load times is to use as few external ressources as possible, and make sure they are cached on the client (so the browser don't have to fetch them for each page view).
To summarize, to optimize performance for a web page, you want to look at, as a minimum:
Server response time
Bandwith /content transfer time.
Make sure you have a small and simple DOM (especially if you need to support IE6).
Make sure you understand client side caching and the settings you need to set on the server.
Make sure you make the client download as little data as possible. Consider GZipping resources and perhaps dynamic content also (dependent on your situation).
Make sure you don't have any CPU intensive javascript on Page load.
You might want to read up on the HTTP Protocol, as well as some of the Best Practices. A couple of tools you can use are YSlow and Google Page Speed
What are the steps involved from entering a web site address to the page being displayed on the browser?
The steps are something like:
Get the IP address of the URL
Create a TCP (HTTP) connection to the IP address, and request the specified page
Receive/download the page via TCP/HTTP; the page may consist of several files/downloads: e.g. the HTML document, CSS files, javascript files, image files ...
Render the page
And how can the process be speeded up from a developer point of view?
Measure to discover which of these steps is slow:
It's only worth optimizing whichever step is the slow one (no point in optimizing steps which are already fast)
The answer to your question varies depending on which step it is.

Resources