Uncaught SecurityError: The frame named https://www.google.com is blocked, from where you access the frame with the source code "http://my.site.com".

I am using google reCaptcha v2.0 and it works on the same domain when I try to do it with an example html page, but the same does not work when I try to integrate with a full production page. After you click on the reCaptcha checkbox, it will keep loading at times, and after that it will detail below.

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

I tried to remove http, https and just keep // so the site protocol can match but no luck. It would be very helpful if someone has a solution.

Thanks in advance.