I had a similar error where the JS error was:

&gt; Blocked a frame with origin &quot;https://www.youtube.com&quot; from accessing a
&gt; frame with origin &quot;http://www.yourdomain.com&quot;.  The frame requesting
&gt; access has a protocol of &quot;https&quot;, the frame being accessed has a
&gt; protocol of &quot;http&quot;. Protocol/Protocols must match, YouTube has CORS
&gt; (Cross Origin Resource Sharing) enabled to allow across domains.

Try getting rid of the `https://` in your YouTube iframe tag? 

You could also take a look at your closing iframe tags. Iframe tags are not singleton tags and must end with a `&lt;/iframe&gt;` and not a `/&gt;`.

It seems that today, using the protocol-free &quot;//youtube.com&quot; URL that YouTube puts IN THEIR OWN EMBED CODE SNIPPET TOOL is throwing protocol matching errors.  (sigh)  This worked fine earlier this week.

If I add the https: to the embed URL it stops throwing errors and the iframe JS API works.  It will continue to throw your &quot;Blocked a frame with origin ...&quot; error, but the JS API will function as expected.

I currently use service/$resource to make ajax calls (GET in this case), and IE caches the calls so that fresh data cannot be retrieved from the server.  I have used a technique I found by googling to create a random number and append it to the request, so that IE will not go to cache for the data.

Is there a better way than adding the cacheKill to every request?

factory code

    .factory(&#39;UserDeviceService&#39;, function ($resource) {
    
            return $resource(&#39;/users/:dest&#39;, {}, {
                query: {method: &#39;GET&#39;, params: {dest: &quot;getDevicesByUserID&quot;}, isArray: true }
            });


Call from the controller

    

    $scope.getUserDevices = function () {
            UserDeviceService.query({cacheKill: new Date().getTime()},function (data) {
                //logic
            });
        }

Better Way to Prevent IE Cache in AngularJS?

I&#39;m sure this was solven 1000 times before: I got a canvas in the size of 960*560 and a room in the size of 5000*3000 of which always only 960*560 should be drawn, depending on where the player is. The player should be always in the middle, but when near to borders - then the best view should be calculated). The player can move entirely free with WASD or the arrow keys. And all objects should move themselves - instead of that i move everything else but the player to create the illusion that the player moves.

I now found those two quesitons:

https://stackoverflow.com/questions/11464550/html5-creating-a-viewport-for-canvas works, but only for this type of game, i can&#39;t reproduce the code for mine.

https://stackoverflow.com/questions/8592872/changing-the-view-center-of-an-html5-canvas seems to be more promising and also perfomant, but i only understand it for drawing all other objects correctly relative to the player and not how to scroll the canvas viewport relative to the player, which i want to achieve first of course.

My code (simplified - the game logic is seperately):

    var canvas = document.getElementById(&quot;game&quot;);
    canvas.tabIndex = 0;
    canvas.focus();
    var cc = canvas.getContext(&quot;2d&quot;);
    
    // Define viewports for scrolling inside the canvas
    
    /* Viewport x position */   view_xview = 0;
    /* Viewport y position */   view_yview = 0;
    /* Viewport width */        view_wview = 960;
    /* Viewport height */       view_hview = 560;
    /* Sector width */          room_width = 5000;
    /* Sector height */         room_height = 3000;
    
    canvas.width = view_wview;
    canvas.height = view_hview;
    
    function draw()
    {
        clear();
        requestAnimFrame(draw);
    
        // World&#39;s end and viewport
        if (player.x &lt; 20) player.x = 20;
        if (player.y &lt; 20) player.y = 20;
        if (player.x &gt; room_width-20) player.x = room_width-20;
        if (player.y &gt; room_height-20) player.y = room_height-20;
    
        if (player.x &gt; view_wview/2) ... ?
        if (player.y &gt; view_hview/2) ... ?
    }

The way i am trying to get it working feels totally wrong and i don&#39;t even know how i am trying it... Any ideas? What do you think about the context.transform-thing?

I hope you understand my description and that someone has an idea. Kind regards

HTML5 Canvas camera/viewport - how to actually do it?

I&#39;m using the youtube iframe api and get the following console error relating to the blocking of a frame with origin http://www.youtube.com. Was wondering if anyone can explain why this error is only appearing in the chrome console and if there are any ways to prevent this happening?

**Error:**

Blocked a frame with origin &quot;http://www.youtube.com&quot; from accessing a frame with origin &quot;http://youtubetest.appspot.com&quot;. Protocols, domains, and ports must match.



Methods of removing the youtube iframe api console error - &quot;blocked a frame with origin...&quot; in chrome console

I'm using the youtube iframe api and get the following console error relating to the blocking of a frame with origin <a href="http://www.youtube.com" target="_blank" rel="noopener noreferrer">http://www.youtube.com</a>. Was wondering if anyone can explain why this error is only appearing in the chrome console and if there are any ways to prevent this happening?
Error:
Blocked a frame with origin "<a href="http://www.youtube.com" target="_blank" rel="noopener noreferrer">http://www.youtube.com</a>" from accessing a frame with origin "<a href="http://youtubetest.appspot.com&#x22;" target="_blank" rel="noopener noreferrer">http://youtubetest.appspot.com"</a>;. Protocols, domains, and ports must match.

I see this being used all the time in JavaScript:

    define([&#39;param1&#39;, &#39;param2&#39;], function() {

    });

What is the `define` function?




What is define([ , function ]) in JavaScript?

How to go to a URL using jQuery or JavaScript. 

    &lt;a href=&quot;javascript:void(0)&quot;  onclick=&quot;javascript:goToURL()&quot;&gt;Go To URL&lt;/a&gt;

    function goToURL(url){
    // some code to go to url

    }

I don&#39;t want to use window.location as I want to invoke this link from a popup. 

New link should also open in a popup.  I also don&#39;t want to use Ajax. Just simulate href in JavaScript.

How to go to a URL using jQuery?

Regarding `$location.search`, the [docs][1] say,

&gt; Return search part (as object) of current url when called without any parameter.


  [1]: http://docs.angularjs.org/api/ng.$location

In my URL, my query string has a param `?test_user_bLzgB` without a value. Also `$location.search()` returns an object. How do I get the actual text?

Getting values from query string in an URL using AngularJS $location

I want to be able to set the default/selected value of a select element using the JQuery Select2 plugin.

JQuery select2 set default value from an option in list?

Node.js servers are very efficient concerning I/O and large number of client connection. But why is node.js not suitable for heavy CPU apps in comparison to a traditional multithreading server?

I read it here [Felix Baumgarten](http://nodeguide.com/convincing_the_boss.html)

Why is node.js not suitable for heavy CPU apps?

I am attempting to embed a youtube video, however, I have not discovered a way to keep the bar at the top from showing when the mouse hovers over it. For my purposes it is important that users are not able to have a direct link back to the original video where they can re-watch the video. The following link gives commands for embed features within youtube:

https://developers.google.com/youtube/player_parameters#Overview

I have used the controls and disablekb features to limit viewers ability to skip and replay the video, what I need now is to disable the bar which appears at the top of the video. 

(Where I have gotten http://www.youtube.com/embed/bFEoMO0pc7k?controls=0&amp;disablekb=1&amp;egm=1)

How to hide the bar at the top of &quot;youtube&quot; even when mouse hovers over it?

I&#39;m trying to use the Modal feature from Bootstrap 3 to show my Youtube video. It works, but I can&#39;t click on any buttons in the Youtube video. 

Any help on this?

Here&#39;s my code:

    &lt;div id=&quot;link&quot;&gt;My video&lt;/div&gt;

    &lt;div id=&quot;myModal&quot; class=&quot;modal fade&quot; tabindex=&quot;-1&quot; role=&quot;dialog&quot; aria-labelledby=&quot;myModalLabel&quot; aria-hidden=&quot;true&quot;&gt;
        &lt;div class=&quot;modal-dialog&quot;&gt;
            &lt;div class=&quot;modal-content&quot;&gt;
                &lt;div class=&quot;modal-header&quot;&gt;
                    &lt;button type=&quot;button&quot; class=&quot;close&quot; data-dismiss=&quot;modal&quot; aria-hidden=&quot;true&quot;&gt;&#215;&lt;/button&gt;
                &lt;/div&gt;
                &lt;div class=&quot;modal-body&quot;&gt;
                    &lt;iframe width=&quot;400&quot; height=&quot;300&quot; frameborder=&quot;0&quot; allowfullscreen=&quot;&quot;&gt;&lt;/iframe&gt;
                &lt;/div&gt;
            &lt;/div&gt;
        &lt;/div&gt;
    &lt;/div&gt;

    &lt;script src=&quot;//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js&quot;&gt;&lt;/script&gt;
    &lt;script&gt;window.jQuery || document.write(&#39;&lt;script src=&quot;js/jquery-1.10.1.min.js&quot;&gt;&lt;\/script&gt;&#39;)&lt;/script&gt;
    &lt;script src=&quot;js/bootstrap.min.js&quot;&gt;&lt;/script&gt;
    &lt;script&gt;
        $(&#39;#link&#39;).click(function () {
            var src = &#39;http://www.youtube.com/v/FSi2fJALDyQ&amp;amp;autoplay=1&#39;;
            $(&#39;#myModal&#39;).modal(&#39;show&#39;);
            $(&#39;#myModal iframe&#39;).attr(&#39;src&#39;, src);
        });

        $(&#39;#myModal button&#39;).click(function () {
            $(&#39;#myModal iframe&#39;).removeAttr(&#39;src&#39;);
        });
    &lt;/script&gt;



Bootstrap 3 and Youtube in Modal

For instance I have a blog post that has the following `iframe`.

    &lt;iframe width=&quot;420&quot; height=&quot;315&quot; src=&quot;//www.youtube.com/embed/1sIWez9HAbA&quot; frameborder=&quot;0&quot; allowfullscreen&gt;&lt;/iframe&gt;

How can I extract the thumbnail from this `iframe`?

How to get a YouTube thumbnail from a YouTube iframe?

I&#39;m retrieving videos of a playlist using youtube v3 API and getting 50 items without any problem with this link:-

https://www.googleapis.com/youtube/v3/playlistItems?part=snippet&amp;maxResults=50&amp;playlistId=PLB03EA9545DD188C3&amp;key=MY_API_KEY

But the video count is 100 and I&#39;m only getting 50. How can I get the next 50 items?
I tried **start-index** but it does not work for v3 API.
Any help is appreciated.


Retrieve all videos from youtube playlist using youtube v3 API

We need a video list by channel name of YouTube (using the API).

We can get a channel list (only channel name) by using the below API:

    https://gdata.youtube.com/feeds/api/channels?v=2&amp;q=tendulkar

Below is a direct link of channels

    https://www.youtube.com/channel/UCqAEtEr0A0Eo2IVcuWBfB9g

Or
    
    WWW.YouTube.com/channel/HC-8jgBP-4rlI

Now, we need videos of channel &gt;&gt; UCqAEtEr0A0Eo2IVcuWBfB9g or HC-8jgBP-4rlI.

We tried

 https://gdata.youtube.com/feeds/api/videos?v=2&amp;uploader=partner&amp;User=UC7Xayrf2k0NZiz3S04WuDNQ
 https://gdata.youtube.com/feeds/api/videos?v=2&amp;uploader=partner&amp;q=UC7Xayrf2k0NZiz3S04WuDNQ

But, it does not help.

We need all the videos posted on the channel. Videos uploaded to a channel can be from multiple users thus I don&#39;t think providing a user parameter would help...


YouTube API to fetch all videos on a channel

We have used the YouTube API for android, but there is a problem with a fast closing and opening the same activity with the YouTube player and the YouTube player view. This problem appears in the sample application also, when I try to open `Fullscreen` activity (without clicking `fullscreenbutton`) then close activity with the back button and again and again. 

YouTube app is crashing like :
&gt;10-11 15:14:53.313: E/ActivityThread(22537): Activity com.example.myvideo.FullscreenDemoActivity has leaked ServiceConnection
com.google.android.youtube.player.internal.r$e@46095818 that was originally bound here

I have tried to override `OnStop` to release the player but with no positive result. Please somebody help!

`Fullscreen` activity modification - a few lines difference between original and this one :


    import static android.view.ViewGroup.LayoutParams.MATCH_PARENT;
    import static android.view.ViewGroup.LayoutParams.WRAP_CONTENT;
    import com.google.android.youtube.player.YouTubePlayer;
    import com.google.android.youtube.player.YouTubePlayer.PlayerStyle;
    import com.google.android.youtube.player.YouTubePlayerView;
    import android.content.Intent;
    import android.content.pm.ActivityInfo;
    import android.content.res.Configuration;
    import android.os.Build;
    import android.os.Bundle;
    import android.view.View;
    import android.view.ViewGroup;
    import android.widget.Button;
    import android.widget.CompoundButton;
    import android.widget.LinearLayout;
    import android.widget.LinearLayout.LayoutParams;
    
    
    /**
     * Sample activity showing how to properly enable custom fullscreen behavior.
     * &lt;p&gt;
     * This is the preferred way of handling fullscreen because of the default fullscreen implementation
     * will cause re-buffering of the video.
     */
    public class FullscreenDemoActivity extends YouTubeFailureRecoveryActivity implements
            View.OnClickListener,
            CompoundButton.OnCheckedChangeListener,
            YouTubePlayer.OnFullscreenListener {
    
        private static final int PORTRAIT_ORIENTATION = Build.VERSION.SDK_INT &lt; 9
                ? ActivityInfo.SCREEN_ORIENTATION_PORTRAIT
                : ActivityInfo.SCREEN_ORIENTATION_SENSOR_PORTRAIT;
    
        private LinearLayout baseLayout;
        private YouTubePlayerView playerView;
        private YouTubePlayer player;
        private Button fullscreenButton;
        private CompoundButton checkbox;
        private View otherViews;
        public boolean CanClose = false;
        private boolean fullscreen;
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            try {
                setContentView(R.layout.fullscreen_demo);
                baseLayout = (LinearLayout) findViewById(R.id.layout);
                playerView = (YouTubePlayerView) findViewById(R.id.player);
                fullscreenButton = (Button) findViewById(R.id.fullscreen_button);
                checkbox = (CompoundButton) findViewById(R.id.landscape_fullscreen_checkbox);
                otherViews = findViewById(R.id.other_views);
                checkbox.setOnCheckedChangeListener(this);
                // You can use your own button to switch to fullscreen too
                fullscreenButton.setOnClickListener(this);
                playerView.initialize(DeveloperKey.DEVELOPER_KEY, this);
                doLayout();
            } catch (Exception e) { }
        }
    
        @Override
        public void onInitializationSuccess(YouTubePlayer.Provider provider, YouTubePlayer player, boolean wasRestored) {
            try {
                this.player = player;
                player.setPlayerStyle(PlayerStyle.MINIMAL);
                //player.setShowFullscreenButton(true);
                setControlsEnabled();
                // Specify that we want to handle fullscreen behavior ourselves.
                player.addFullscreenControlFlag(YouTubePlayer.FULLSCREEN_FLAG_CUSTOM_LAYOUT);
                player.setOnFullscreenListener(this);
                if (!wasRestored) {
                    player.cueVideo(MainActivity.CurrentVideo);
                }
            } catch (Exception e) { }
        }
    
        @Override
        protected YouTubePlayer.Provider getYouTubePlayerProvider() {
            return playerView;
        }
    
        @Override
        public void onClick(View v) {
            player.setFullscreen(!fullscreen);
        }
    
        @Override
        public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
            try {
                int controlFlags = player.getFullscreenControlFlags();
                if (isChecked) {
                    // If you use the FULLSCREEN_FLAG_ALWAYS_FULLSCREEN_IN_LANDSCAPE, your activity&#39;s normal UI
                    // should never be laid out in landscape mode (since the video will be fullscreen whenever the
                    // activity is in landscape orientation). Therefore you should set the activity&#39;s requested
                    // orientation to portrait. Typically you would do this in your AndroidManifest.xml, we do it
                    // programmatically here since this activity demos fullscreen behavior both with and without
                    // this flag).
                    setRequestedOrientation(PORTRAIT_ORIENTATION);
                    controlFlags |= YouTubePlayer.FULLSCREEN_FLAG_ALWAYS_FULLSCREEN_IN_LANDSCAPE;
                } else {
                    setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_SENSOR);
                    controlFlags &amp;= ~YouTubePlayer.FULLSCREEN_FLAG_ALWAYS_FULLSCREEN_IN_LANDSCAPE;
                }
                player.setFullscreenControlFlags(controlFlags);
            } catch (Exception e) { }
        }
    
        private void doLayout() {
            try {
                LinearLayout.LayoutParams playerParams = (LinearLayout.LayoutParams) playerView.getLayoutParams();
                if (fullscreen) {
                    // When in fullscreen, the visibility of all other views than the player should be set to
                    // GONE and the player should be laid out across the whole screen.
                    playerParams.width = LayoutParams.MATCH_PARENT;
                    playerParams.height = LayoutParams.MATCH_PARENT;
                    otherViews.setVisibility(View.GONE);
                } else {
                    // This layout is up to you - this is just a simple example (vertically stacked boxes in
                    // portrait, horizontally stacked in landscape).
                    otherViews.setVisibility(View.VISIBLE);
                    ViewGroup.LayoutParams otherViewsParams = otherViews.getLayoutParams();
                    if (getResources().getConfiguration().orientation == Configuration.ORIENTATION_LANDSCAPE) {
                        playerParams.width = otherViewsParams.width = 0;
                        playerParams.height = WRAP_CONTENT;
                        otherViewsParams.height = MATCH_PARENT;
                        playerParams.weight = 1;
                        baseLayout.setOrientation(LinearLayout.HORIZONTAL);
                    } else {
                        playerParams.width = otherViewsParams.width = MATCH_PARENT;
                        playerParams.height = WRAP_CONTENT;
                        playerParams.weight = 0;
                        otherViewsParams.height = 0;
                        baseLayout.setOrientation(LinearLayout.VERTICAL);
                    }
                    setControlsEnabled();
                }
            } catch (Exception e) { }
        }
    
        private void setControlsEnabled() {
            checkbox.setEnabled(player != null &amp;&amp;
                    getResources().getConfiguration().orientation == Configuration.ORIENTATION_PORTRAIT);
            fullscreenButton.setEnabled(player != null);
        }
    
        @Override
        public void onFullscreen(boolean isFullscreen) {
            fullscreen = isFullscreen;
            doLayout();
        }
    
        @Override
        public void onConfigurationChanged(Configuration newConfig) {
            super.onConfigurationChanged(newConfig);
            doLayout();
        }
    
        @Override
        public void onStop() {
            if (player != null) {
                player.release();
                player = null;
            }
            super.onStop();
        }
    
        @Override
        public void finish() {
            Intent data = new Intent();
            setResult(RESULT_OK, data);
            super.finish();
        }
    }

Android Youtube Player API activity finish and create

I am trying to make an upload to YouTube from my Java based web app, I spent a few days to understand what and where is the problem and I cannot get it, for now I am pulling my hair out off my head.

I registered my web app in Google Console, so I got a pair of Client ID and Secret and a possibility to download JSON type file with my config.

So here is the config:

    {
        &quot;web&quot;:{
            &quot;auth_uri&quot;:&quot;https://accounts.google.com/o/oauth2/auth&quot;,
            &quot;client_secret&quot;:&quot;***&quot;,
            &quot;token_uri&quot;:&quot;https://accounts.google.com/o/oauth2/token&quot;,
            &quot;client_email&quot;:&quot;***&quot;,
            &quot;redirect_uris&quot;:[&quot;http://localhost:8080/WEBAPP/youtube-callback.html&quot;,&quot;http://www.WEBAPP.md/youtube-callback.html&quot;],
            &quot;client_x509_cert_url&quot;:&quot;***&quot;,
            &quot;client_id&quot;:&quot;***&quot;,
            &quot;auth_provider_x509_cert_url&quot;:&quot;https://www.googleapis.com/oauth2/v1/certs&quot;,
            &quot;javascript_origins&quot;:[&quot;http://www.WEBAPP.md/&quot;]
        }
    }

How is possible that I am getting the default URL from Google?

`The redirect URI in the request: http://localhost:8080/Callback did not match a registered redirect URI`

It always gives me the default `http://localhost:8080/Callback` URL instead of mine.

And IDE console shows me that:

`Please open the following address in your browser:
  https://accounts.google.com/o/oauth2/auth?client_id=***&amp;redirect_uri=http://localhost:8080/Callback&amp;response_type=code&amp;scope=https://www.googleapis.com/auth/youtube.upload
Attempting to open that address in the default browser now...`

I am using the last version of dependencies:
*google-api-services-youtube v3-rev99-1.17.0-rc* and *google-api-services-youtubeAnalytics v1-rev35-1.17.0-rc*

Google OAUTH: The redirect URI in the request did not match a registered redirect URI

With Youtube api v2, there&#39;s easy way to get videos. Just send a query like this:

http://gdata.youtube.com/feeds/mobile/videos?max-results=5&amp;alt=rss&amp;orderby=published&amp;author=OneDirectionVEVO

The Youtube api v2 also has an interactive demo page for building query:
http://gdata.youtube.com/demo/index.html


With Youtube api v3, I don&#39;t know the corresponding way. Please point me the way with api v3.

Thank you!

Content Type	Original Author	Original Content on Stackoverflow
Question	styler	View Question on Stackoverflow
Solution 1 - Javascript	Wulf Solter	View Answer on Stackoverflow
Solution 2 - Javascript	Andy	View Answer on Stackoverflow

Methods of removing the youtube iframe api console error - "blocked a frame with origin..." in chrome console

Javascript Problem Overview

Javascript Solutions

Solution 1 - Javascript

Solution 2 - Javascript

HTML5 Canvas camera/viewport - how to actually do it?

Better Way to Prevent IE Cache in AngularJS?

Attributions