CODEWITHSUNDEEP
javascriptnode.jsfacebookpassport.js
jcollum
jcollum

Reputation: 46603

How can I stop the momentary redirect with the #_=_ on the url when using Facebook Oauth?

I'm using Passport and Angular to log in to a site via Facebook. Code looks like: 

  facebookStrategy: function() {
    if (!process.env.FACEBOOK_APP_ID) {
      throw new Error("A Facebook App ID is required if you want to enable login via Facebook.");
    }
    if (!process.env.FACEBOOK_APP_SECRET) {
      throw new Error("A Facebook App Secret is required if you want to enable login via Facebook.");
    }
    return new FacebookStrategy({
      clientID: process.env.FACEBOOK_APP_ID,
      clientSecret: process.env.FACEBOOK_APP_SECRET,
      callbackURL: process.env.FACEBOOK_CALLBACK_URL || ("http://localhost:" + process.env.PORT + "/auth/facebook/callback")
    }, function(accessToken, refreshToken, profile, done) {
      var user;
      user = module.exports.findOrCreateOauthUser(profile.provider, profile.id);
      done(null, user);
    });
  }

(http://localhost? crap, need to fix that, this is some sample code that I'm adapting)

OK so the solution to this is (jade): 

script(type="text/javascript").
  if (window.location.href.indexOf('#_=_') > 0) {
      window.location = window.location.href.replace(/#.*/, '');
  }

That seems fine, but it's an unnecessary redirect. So the perfectionist in me would like to get rid of it. The docs seem to say that redirect_uri is needed here, but I have callbackURL and Passport Facebook lib seems to think they're the same. Still getting the redirection to the meaningless URL even when using callbackURL.

Specifically I want to know if it's possible to fix this via Passport instead of page-side javascript that fixes the url. The latter seems hacky.

Upvotes: 0

Views: 435

Answers (1)

SomeKittens
SomeKittens

Reputation: 39522

This is a bug on Facebook's side, not Passport's. You can't change the hash server-side, so adding this snippet at the top of your JS will do the trick (no need for a redirect):

if (window.location.hash === '_=_') {
  window.location.hash = '';
}

Per the author of Passport-Facebook:

Facebook's OAuth 2.0 implementation has a bug in which the fragment #_=_ is appended to the callback URL. This appears to affect Firefox and Chrome, but not Safari. This fragment can be removed via client-side JavaScript, and @niftylettuce provides a suggested workaround [there is a link]. Developers are encouraged to direct their complaints to Facebook in an effort to get them to implement a proper fix for this issue.

Upvotes: 1

Related Questions