I typed "Rendering a web page by browsers" in google and I obtained the following link.
According to this description HTTP requests for every resource connected with one page are made via separated TCP socket. I always thought that only one TCP socket is established and all resources (images, CSS and JS files) are sent through this socket. If am not clear enough: You type www.example.com in address bar of the browser. Let's say the web page under this address has N pictures and M CSS and JS files. How many TCP socket are opened by browser? 1+N+M?
Yes HTTP is a stateless protocol. Every resource a page needs is downloaded sepperately by your browser. That is html, flash / silverlight etc, images, css, js and so on. To optimize load times it's recommended to merge all css and all js into one file to reduce the ammount if requests needed to load a page.
Related
I have an excel-online embedded document on an Iframe element. The file is served by a WOPI host to client.
I want to be able have the Iframe communicate with the parent window the same way that an oline file served from OneDrive can communicate with its parent window using the Excel Services JavaScript API (https://msdn.microsoft.com/en-us/library/office/hh315812(v=office.14).aspx). I want to be able to read elements such as a cell that is in focus etc.
Wopi protocol suggest using HTML PostMessage which has limitation as it does not allow for manipulation of the embedded file the same way Excel Services JavaScript API does.
Is there a way to achieve this with an Iframe embedded excel-oline file served through a WOPI host?
I have one requirement. I need to access one of our servers (web site) and need to read the content using the URLs and render it on the browser.
In our Application, I am using HttpClient API to access the web pages of one server (http://10.x.xxx.87). I am able to get html content/ web pages in the form of HttpResponse of HttpClient API. The content is sent from my application to the client, where the content is rendered in the browser.
Some of the lines from response,
href="/web/common/images/favicon.ico" type="image/x-icon"
href="/web/common/css/login.css" type="text/css
href="/web/common/css/overlay.css" type="text/css"
This href is pointing to the server I am referring from my application. I think this href location is trying to find the images or css files in my local server. I want the images to be read from the server which is I am accessing from my application.
How to solve this issue ? Help would be appreciated.
I was able to solve this issue. When the client request for the following image, href="/web/common/images/favicon.ico" type="image/x-icon", I am using servlet to read the response from other website.
I need to create a custom Facebook Page Tab app which will show an external site in an iframe. This need to have adverts on it but I'm not sure if this is possible as the site is hosted externally.
I'm not sure if I need to sign up to the Facebook Audience Network to get approved etc. either?
Any help or advice would be great.
Many browsers have this limitation of not allowing external sites to be shown in an iframe. Imagine the case when you are working hard to create a site and others show all your content in iframes. That is, naturally frustrating.
However, there is a candidate-solution: Let's suppose you create a page which sends a request to the other site and appends all the content into the body and head of your page. This is very much possible, so the solution is to:
Create a page in your site, let's call it outsider
In the server-side code of your outsider page send a request to the desired page to be shown
You will get the html of the page. Process it and include its content into the head and body of outsider. This includes:
3.1. Checking all the CSS to be reached, as the target page might refer to local CSS, which is unreachable locally at your end. Process the URLs of CSS files
3.2. Checking all the Javascript to be reached, as the target page might refer to local JS, which is unreachable locally at your end. Process the URLs of JS files
3.3. Apply the idea described in 3.1. and 3.2. for other resources, like images, until you are satisfied with the content of outsider
Create an iframe, having the source to point to outsider. outsider is inside your scope, so it should be shown
NOTE: If the site owning the target page does not like the possibility of you showing their content inside iframes, they might protect it by, let's say, having Javascript in their code, which checks whether the page is inside an iframe. Remove that code while processing the response to your request. If nothing else prevents you from showing the page in an iframe, then you should achieve success.
I've run a Pingdom.com test on my page and found out that identical JS files from Facebook are being loaded twice. Once from http://s-static.ak.facebook.com/ and another time from http://static.ak.fbcdn.net. Pingdom is reporting that the page size is 753.7kB. That's a lot, and if you exclude Facebook resources, the page size goes down more than 60%—what a waste! Is there any way to mitigate this problem? Thanks!
You may need to use a channel file:
The channelUrl parameter is optional, but recommended. Providing a
channel file can help address three specific known issues. First,
pages that include code to communicate across frames may cause Social
Plugins to show up as blank without a channelUrl. Second, if no
channelUrl is provided and a page includes auto-playing audio or
video, the user may hear two streams of audio because the page has
been loaded a second time in the background for cross domain
communication. Third, a channel file will prevent inclusion of extra
hits in your server-side logs. If you do not specify a channelUrl, you
can remove page views containing fb_xd_bust or fb_xd_fragment
parameters from your logs to ensure proper counts.
The channelUrl must be a fully qualified URL matching the page on
which you include the SDK. In other words, the channel file domain
must include www if your site is served using www, and if you modify
document.domain on your page you must make the same document.domain
change in the channel.html file as well. The protocols must also
match. If your page is served over https, your channelUrl must also be
https. Remember to use the matching protocol for the script src as
well. The sample code above uses protocol-relative URLs which should
handle most https cases properly.
I am writing an app within a facebook iframe and am unsure how best to write this. I originally wrote all the code within the main canvas.php file but found everything was running too slow before results were being loaded into the iframe.
I then tried using the php header location method so to try and load different pages into the iframe, thus reducing page load time. However, the header location is ignored.
I have also tried using javascript to get the page to load within the iframe instead, this does load in the new page but the page experiences lots of problems. It wil not pass parrameteres to itself using $_GET.
Basically, I need to perform some checks when the canvas page is first loaded in the iframe and then re-direct to another file to avoid the checks being perfomed on every page load as this seriously shows everything down. I then need to have page reloads with different parrameteres in the URL to populate the iframe with different results, again this is very slow as it has to perfomr all the checks again.
Therefore, how can I achieve a smooth workflow as a normal site within a facebook iframe?
[EDIT] Just thought is Ajax a valid option?
Many thanks in advance.
Most people experience slow response times due to not having a channelURL specified. See http://developers.facebook.com/docs/reference/javascript/
Channel File
The channel file addresses some issues with cross domain communication
in certain browsers. The contents of the channel.html file can be just
a single line:
It is important for the channel file to be cached for as long as
possible. When serving this file, you must send valid Expires headers
with a long expiration period. This will ensure the channel file is
cached by the browser which is important for a smooth user experience.
Without proper caching, cross domain communication will become very
slow and users will suffer a severely degraded experience. A simple
way to do this in PHP is:
The channelUrl parameter is optional, but recommended. Providing a
channel file can help address three specific known issues. First,
pages that include code to communicate across frames may cause Social
Plugins to show up as blank without a channelUrl. Second, if no
channelUrl is provided and a page includes auto-playing audio or
video, the user may hear two streams of audio because the page has
been loaded a second time in the background for cross domain
communication. Third, a channel file will prevent inclusion of extra
hits in your server-side logs. If you do not specify a channelUrl, you
can remove page views containing fb_xd_bust or fb_xd_fragment
parameters from your logs to ensure proper counts.
The channelUrl must be a fully qualified URL matching the page on
which you include the SDK. In other words, the channel file domain
must include www if your site is served using www, and if you modify
document.domain on your page you must make the same document.domain
change in the channel.html file as well. The protocols must also
match. If your page is served over https, your channelUrl must also be
https. Remember to use the matching protocol for the script src as
well. The sample code above uses protocol-relative URLs which should
handle most https cases properly.