4

I've added a G+ login button on my website, but I keep seeing this issue. In most cases this comes first time and if you try to connect after refreshing the page, it works.

Here's the error:

Uncaught SecurityError: Blocked a frame with origin .com" from accessing a frame with origin "https://accounts.google.com". The frame requesting access has a protocol of "http", the frame being accessed has a protocol of "https". Protocols must match.

I saw this post Google + SignIn Button Blocked Frame but the solution isn't relevant to me.

Community
  • 1
  • 1
n0nChun
  • 720
  • 2
  • 8
  • 21

1 Answers1

0

First, I want to emphasize that you really should be using https when handling user credentials. If you can, get an SSL certificate and serve your content over https. By using HTTPS, you can prevent MiTM attacks and user information leaks.

That aside, there are a number of potential sources triggering the warning:

  1. If you are using the Sign-in button from a page serving HTTP instead of the more secure HTTPS, sometimes communication with the sign-in servers gets blocked. If sign-in sometimes works and sometimes doesn't, this may be the cause.

  2. If your authorized JavaScript origin protocol (http / https) doesn't match, the Google authorization server will reject your client (http://yoursite.com when you meant https://yoursite.com)

  3. If your authorized JavaScript origin does not match (e.g. you put .com in the authorized origin, when you meant yoursite.com) then the OAuth server will reject your frame.

Listing your authorized origins (obfuscated for security) from the Google Developer Console and the site might help to determine what's going on in your case.

A few things you can change to see if it helps:

  • Try changing your cookie policy to either 'single_host_origin' or to 'http://yoursite.com'.
  • Try cleaning the authorized origins in the developer console to only include your http:// domain.
  • Try accessing your site from an incognito tab, if this works, your browser cookies may be in a bad state for the site.
  • Try using Chrome network diagnostics to see if specific requests are failing.
  • Try replacing any includes that use an explicit protocol with includes referencing a relative protocol (e.g. replace <script src="https://foo.bar/include.js" /> with <script src="//foo.bar/include.js" />)
class
  • 8,621
  • 29
  • 30
  • Any solution for this? I'm also experiencing the same thing and checked everything in class' answer, all seems ok on my end. For me it used to sometimes work and sometimes fail (usually after refresh it would work) but now it looks like it's always failing. I'm trying to have the sign in button on a page without SSL. – Guy Jun 01 '15 at 12:32