6

I have a Meteor app which lets users register through facebook oauth through meteor's accounts-facebook package. I have set-up all the neccesary packages and UI, and deployed the app on Heroku (free plan) with an mLab database (sandbox). I have set up facebook app and authentication, and the login works fine for me. I have registered on the app through my facebook multiple times successfully.

However when one of my fellow developers who lives in Hong Kong (I am in India) tried to do the same, the app wouldn't register him, and the popup browser printed this error in the console after he gave permission to access his public profile -

DOMException: Blocked a frame with origin "https://myapp.herokuapp.com" from accessing cross-origin frame.

This error seemed to be coming from end_of_popup_response.js:18 in the oauth package.

Is there any particular fixable reason to this error?

Dev Agrawal
  • 311
  • 4
  • 9
  • Can you add your (cleaned) nginx configuration? – Jankapunkt Jul 05 '18 at 08:45
  • It's a meteor app. I am using [this buildpack](https://github.com/AdmitHub/meteor-buildpack-horse/) though, so I don't know if this buildpack uses nginx behind the scenes. But I don't think nginx is being used. – Dev Agrawal Jul 05 '18 at 17:52
  • Can this be of a help to you? https://github.com/meteor/meteor/issues/6707 – Harry Adel Jul 08 '18 at 21:32

2 Answers2

1

there is a policy in JavaScript named Same-origin. and by that policy if you want to access a frame, Protocol, Hostname and Port must be the same of your domain.

read this for some examples: SecurityError: Blocked a frame with origin from accessing a cross-origin frame

Majid Roustaei
  • 850
  • 1
  • 10
  • 25
  • I know about the policy, I just can't figure out how it is not a problem in my case but it is a problem for the HK devs – Dev Agrawal Jul 11 '18 at 09:51
0

When you create an account on the facebook developers console (https://developers.facebook.com/), you needed to register your domain so that your facebook authentication app will allow a cross-origin request. You probably did this and registered your localhost but forgot to go back and register your heroku domain once you deployed.

It looks like this

And then at the bottom of the page you should see something like this

And then at the bottom of the page you should see something like this

borbesaur
  • 661
  • 3
  • 10
  • I never used localhost as the site url. I registered my heroku domain, and used my heroku-deployed app to register through facebook, and it worked. But the exact same process didn't work for the HK devs – Dev Agrawal Jul 11 '18 at 09:53