Embed iframe cross domain - asp.net-mvc-3

I need to have an iframe script which I can give to my different clients, so that they can embed it in their sites. Just like Youtube or facebook does.
But it does not get rendered due to cross domain restrictions.
I have gone through every documentation for x - frame options , crossDomain ajax call.
The problem with crossDomain ajax call is that I have only JSONP to work with.
I have tried this - just go to any youtube video and get its Embed code. Its a plain iframe script e.g. <iframe width="420" height="315" src="http://www.youtube.com/embed/7N5OhNplEd4" frameborder="0" allowfullscreen></iframe>
If you inject the above script in your html, it will get rendered , but as soon as you edit the src of the iframe to youtube.com itself , it will go blank.
Facebook's iframe too gets rendered everywhere smoothly.
I am hell tortured by this thing.
Please guide me on this. Thanks in advance!

IF you look at the response headers from youtube.com it is returning "X-Frame-Options:SAMEORIGIN" so they are adding the header on the server to stop people from displaying youtube (website pages) via a iframe.

Related

Ajax not working on wordpress inside embedded page

link to bellow website is working perfectly fine,
https://soalsrv1.soaltech.com/jobs.nsf/xp_jobs_kupplin.xsp
but each time I use it in an embeded form like this:
<iframe src="https://soalsrv1.soaltech.com/jobs.nsf/xp_jobs_kupplin.xsp#" width="100%" height="600"> </iframe>
it doesn't work with iframe but I need to add this as iframe to my website if any one knows the solution 'll be really Thankful :)
Sometimes iframes doesn't work on Wordpress, I've tried many times to put an Iframe of a simple Youtube video on an article page and it never appeared, I've read that Wordpress blocks them for security reasons but I think that with some payable plugin you can make it :/

Facebook Profile images not loading on FireTV Firefox browser?

I'm building a webapp that I want to use on a FireTV browser (Firefox) and when I do so, my Facebook images are appearing as broken links.
The images appear normally on all other devices/browsers I've tested (multiple on OSX, Android)
Initially I thought the the firetv browser wasn't liking hot-linked images for some reason as I'm loading them via the graph API, however I'm able to get images hotlinked from other sites to show up just fine on the fireTV as well.... It seems to be something specific about the facebook URLs it doesn't like? Does anyone have any ideas, or know of any tools to help debug it better?
This is what the img elements look like that I'm rendering, for example:
<img src="https://graph.facebook.com/v2.6/112816289586034/picture?type=large" />
Facebook Graph API returns a profile photo URL with a 302 redirect, which apparently is not Amazon FireTV friendly.
The solution was to include redirect=false as a url parameter on the API request, which causes FB to return a JSON object including regular image url that loads as expected.

Going back in an iphone AJAX Webapp

I have a problem:
I want to play a video from a full screen web app, not using html embed, but using an image banner which redirects to the video url (for example url: http://example.com/media/vid.mp4),
because this can't be done using hrefs, i'm just calling a javascript event:
HTML:
<img src='http://example.com/media/banner01.jpg' id='play_video' />
JavaScript:
<script>
$("#play_video").click(function(){
window.location = "http://example.com/media/vid.mp4";
});
</script>
But because it's just an AJAX page, once video finishes playing, the user is back to the 1st page, however, I have a unique url for each page (for social networking), but how can I inject it to the browser's history, or perhaps some other method of playing the video?
I've been through a similar thing recently, and have found jQuery.address to be a great solution. It handles changing the URL in an AJAXy way, lovely.
Of course, if your users are running in standalone full-screen mode, you'll need to implement some controls for navigating the site without the usual browser chrome.

How does a website load only part of the page and still display full on URLs?

I am looking at the Gawker blogs (http://io9.com, http://lifehacker.com/) and I'm curious about how they are made.
When I click for on a link only the article part of the page reloads displaying a loading icon while it does.
But what I can't figure out is that links point to new URLs like io9.com/something/something and its not something like I see on ajax pages that they put a site.com/#something tag at the end of the url from javascript to mark the page after an ajax request.
Can I change the full blown URL from javascript or what is happening?
When it happens, the website is using the HTML5 History API. This API can change the url (via JavaScript) without changing the page.
See caniuse.com for browser support.
If you would like to implement it in yout website, backbonejs.org would be very useful.

Loading Ajax Response Data with Adsense Codes inside

I'm 10000000% sure that this question has been asked before, however, the majority of the responses that I came across were from back in 2005, 2006 and so on. Not to mention, almost all of the questions themselves were too general. Therefore, I'm asking this so that for anyone else needs to find this out, then they won't need to dig through about 50 webpages to get an idea.
My question is simply that I have a webpage that has Google Ads embedded into the HTML of the website. The website was first developed as a static HTML site where each link reloaded a new page. Nevermind the backend technology of the website - the website itself produces purely dynamic content. The website is close to completion and now a fully-ajax listener has been added to all the links. When any of the links are clicked, JavaScript takes over, parses the link and sets that using popstate or the hashbang. The page itself is then queried to the server via AJAX and the content is updated using document.getElementByID('container').innerHTML=ajax.responseText; This way, there is almost a 100% method of accessing content that was replaced by AJAX.
This all works fine, but the responseText itself may, WILL contain Google Ads, and I was just wondering how to display them as if it were a static page. Clearly this doesn't work. Here are the options that I've come across:
Use an IFrame:
An IFrame seems to be an effective way to load the content; just stick the adsense codes a simple adsense.html iframe file and let the browser and
directly into page, it isn't possible
it's against their TOS
there is document.write() omitted in ajax request
Your chance is:
Create simple iframe
<iframe src="advert.html"></iframe>
and in advert.html, add your advert code
It's then loaded fine without problems.
Good luck

Resources