We have an Ruby on Rail app that allows the user to save a number of video embed codes into a into our data model. The form allows the user to enter any number of embed codes, press submit and save everything to the database. The app then redirects the user to a page that has a list of all the embed codes.
This workflow works fine for IE, Safari, and Firefox.
On Chrome, however, the first time the page is loaded none of the videos appear on the page. I see the following error in the console, once for each video:
Refused to execute a JavaScript script. Source code of script found within request.
On subsequent page loads, the videos load fine and that error is not displayed.
When I view source, the page is reloaded for the view-source operation so I cannot tell if the source is coming through as expected.
When I inspect element on the block where the video should be, I see the following:
<iframe src="" width="400" height="225" frameborder="0">
<html>
<head></head>
<body></body>
</html>
</iframe>
This occurs for both the iframe style embed codes as well as for the "old-style" tag code for both YoutTube and Vimeo videos.
Related:
Other things you can try: Reload the video at a later point in time or immediately. Update the Adobe Flash Player. Upgrade your browser. Delete cache and cookies.
On a computer, go to the YouTube video or playlist you want to embed. From the list of Share options, click Embed. From the box that appears, copy the HTML code. Paste the code into your website HTML.
To embed a video in an HTML page, use the <iframe> element. The source attribute included the video URL. For the dimensions of the video player, set the width and height of the video appropriately.
Embed means to integrate external content into another website or page. You embed something when you place a block of code — called an embed code — into the HTML editor of another website. When you hit 'Save' or 'Publish,' the media then renders on the published page. Embedded content is referenced with HTML.
It's how Chrome prevents XSS (cross-site scripting), as your reference above.
When you submit your embed codes, and redirect to another page to display them, Chrome sees that the submitted embed codes (via HTTP POST))and the responded embed codes are the same, so it prevents to load them and displays error in the console.
When you refresh the page, no more HTTP POST submitted (because you redirected it before), so it should display correctly.
I have same problem, and I resolved it by auto reloading the page after it redirected.
I reload the iframes via javascript (with jquery) as workarround..
I therefore store the src elsewhere cause chrome removes it..
I added the url twice as src and src2, and reloaded then with src2.
I also gave all the iframes that need reloading a special class 'webkitIframeHack'.
<script type="text/javascript">
$(function(){
if ($.browser.webkit) {
$("iframe.webkitIframeHack").each(function(){
$(this).attr('src', $(this).attr('src2'));
});
};
});
</script>
(I can't use html5 data-* attributes, i think they would be more fitted..)
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With