Redirect URI - How to remove "#_=_" from Facebook Redirect?

[niftylettuce]

UPDATE: See this comment towards end of this issue comment thread for the latest version of the fix for this issue.

---

Not sure how to fix this, since there isn't an immediate answer as to how to set the redirect URI.

Found this on SO: http://stackoverflow.com/questions/7693663/remove-from-the-facebook-redirect-url.

Also this will help to provide context: https://developers.facebook.com/bugs/196125357123225.

[niftylettuce]

Here was my fix using Modernizr (with alternative in comments) ...

// Remove the ugly Facebook appended hash
// <https://github.com/jaredhanson/passport-facebook/issues/12>
if (window.location.hash && window.location.hash === "#_=_") {
  // If you are not using Modernizr, then the alternative is:
  //   `if (window.history && history.pushState) {`
  if (Modernizr.history) {
    window.history.pushState("", document.title, window.location.pathname);
  } else {
    // Prevent scrolling by storing the page's current scroll offset
    var scroll = {
      top: document.body.scrollTop,
      left: document.body.scrollLeft
    };
    window.location.hash = "";
    // Restore the scroll offset, should be flicker free
    document.body.scrollTop = scroll.top;
    document.body.scrollLeft = scroll.left;
  }
}

[niftylettuce]

I'll add this to the Readme since this is a common problem due to Facebook's current bug.

[niftylettuce]

Thanks!

[arxpoetica]

FYI: it's actually better to use window.history.replaceState('', document.title, window.location.pathname); if you don't want the #_=_ bug to remain in the history.

[niftylettuce]

@arxpoetica thanks, how does this look? /cc @jaredhanson (do we need to update docs?)

// Remove the ugly Facebook appended hash
// <https://github.com/jaredhanson/passport-facebook/issues/12>
if (window.location.hash && window.location.hash === "#_=_") {
  // If you are not using Modernizr, then the alternative is:
  //   `if (window.history && history.replaceState) {`
  if (Modernizr.history) {
    window.history.replaceState("", document.title, window.location.pathname);
  } else {
    // Prevent scrolling by storing the page's current scroll offset
    var scroll = {
      top: document.body.scrollTop,
      left: document.body.scrollLeft
    };
    window.location.hash = "";
    // Restore the scroll offset, should be flicker free
    document.body.scrollTop = scroll.top;
    document.body.scrollLeft = scroll.left;
  }
}

[arxpoetica]

Yup. That's what I did in my app.

[niftylettuce]

@jerone why'd you remove your comment? how about this /cc @arxpoetica

// Remove the ugly Facebook appended hash
// <https://github.com/jaredhanson/passport-facebook/issues/12>
(function removeFacebookAppendedHash() {
  if (!window.location.hash || window.location.hash !== '#_=_')
    return;
  if (window.history && window.history.replaceState)
    return window.history.replaceState('', document.title, window.location.pathname + window.location.search);
  // Prevent scrolling by storing the page's current scroll offset
  var scroll = {
    top: document.body.scrollTop,
    left: document.body.scrollLeft
  };
  window.location.hash = "";
  // Restore the scroll offset, should be flicker free
  document.body.scrollTop = scroll.top;
  document.body.scrollLeft = scroll.left;
}());

[arxpoetica]

Word.

[jerone]

@jerone why'd you remove your comment?

Because I posted exactly what the comment already noted, which I stupidly saw after posting.

// If you are not using Modernizr, then the alternative is:
//   `if (window.history && history.replaceState) {`

[pedramphp]

I can't believe that facebook hasn't fixed this issue, yet.
But thanks for the fix Guys.

[grabbou]

I am not sure if that's a Facebook issue @pedramphp.

https://developers.facebook.com/blog/post/552/

This week, we started adding a fragment #= to the redirect_uri when this field is left blank. Please ensure that your app can handle this behavior.