Facebook Callback将“＃_ = _”附加到返回URL

本文翻译自：Facebook Callback appends '#_=_' to Return URL

Facebook callback has started appending #_=_ hash underscore to the Return URL Facebook回调已开始将#_=_哈希下划线附加到返回URL

Does anyone know why? 有谁知道为什么？ What is the solution? 解决办法是什么？

---

#1楼

参考：https://stackoom.com/question/TvKn/Facebook-Callback将-附加到返回URL

---

#2楼

if you want to remove the remaining "#" from the url 如果你想从网址中删除剩余的“＃”

$(window).on('load', function(e){
  if (window.location.hash == '#_=_') {
    window.location.hash = ''; // for older browsers, leaves a # behind
    history.pushState('', document.title, window.location.pathname); // nice and clean
    e.preventDefault(); // no page reload
  }
})

---

#3楼

Adding this to my redirect page fixed the problem for me ... 将此添加到我的重定向页面为我解决了问题...

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

---

#4楼

You can also specify your own hash on the redirect_uri parameter for the Facebook callback, which might be helpful in certain circumstances eg /api/account/callback#home . 您还可以在redirect_uri参数上为Facebook回调指定自己的哈希值，这在某些情况下可能会有所帮助，例如/api/account/callback#home 。 When you are redirected back, it'll at least be a hash that corresponds to a known route if you are using backbone.js or similar (not sure about jquery mobile). 当你被重定向回来时，如果你使用的是backbone.js或类似的（不确定jquery mobile），它至少会是一个与已知路由相对应的哈希值。

---

#5楼

TL;DR TL; DR

if (window.location.hash === "#_=_"){
    history.replaceState 
        ? history.replaceState(null, null, window.location.href.split("#")[0])
        : window.location.hash = "";
}

Full version with step by step instructions 完整版与分步说明

// Test for the ugliness.
if (window.location.hash === "#_=_"){

    // Check if the browser supports history.replaceState.
    if (history.replaceState) {

        // Keep the exact URL up to the hash.
        var cleanHref = window.location.href.split("#")[0];

        // Replace the URL in the address bar without messing with the back button.
        history.replaceState(null, null, cleanHref);

    } else {

        // Well, you're on an old browser, we can get rid of the _=_ but not the #.
        window.location.hash = "";

    }

}

Step by step: 一步步：

1. We'll only get into the code block if the fragment is #_=_ . 如果fragment是#_=_我们只会进入代码块。
2. Check if the browser supports the HTML5 window.replaceState method. 检查浏览器是否支持HTML5 window.replaceState方法。
   1. Clean the URL by splitting on # and taking only the first part. 通过拆分#并仅采用第一部分来清理URL。
   2. Tell history to replace the current page state with the clean URL. 告诉history用干净的URL替换当前页面状态。 This modifies the current history entry instead of creating a new one. 这会修改当前历史记录条目，而不是创建新条目。 What this means is the back and forward buttons will work just the way you want. 这意味着后退和前进按钮将按照您想要的方式工作。 ;-) ;-)
3. If the browser does not support the awesome HTML 5 history methods then just clean up the URL as best you can by setting the hash to empty string. 如果浏览器不支持令人敬畏的HTML 5历史记录方法，那么只需将哈希设置为空字符串即可尽可能地清理URL。 This is a poor fallback because it still leaves a trailing hash (example.com/#) and also it adds a history entry, so the back button will take you back to #_-_ . 这是一个糟糕的后备，因为它仍然留下一个尾随哈希值（example.com/#）并且它还添加了一个历史记录条目，因此后退按钮会将您带回#_-_ 。

Learn more about history.replaceState . 了解有关history.replaceState更多信息。

Learn more about window.location . 了解有关window.location更多信息。

---

#6楼

This can become kind of a serious issue if you're using a JS framework with hashbang (/#!/) URLs, eg Angular. 如果你使用带有hashbang（/＃！/）URL的JS框架，例如Angular，这可能会成为一个严重的问题。 Indeed, Angular will consider URLs with a non-hashbang fragment as invalid and throw an error : 实际上，Angular会将带有非hashbang片段的URL视为无效并抛出错误：

Error: Invalid url "http://example.com/#_=_", missing hash prefix "#!".

If you're in such a case (and redirecting to your domain root), instead of doing : 如果您遇到这种情况（并重定向到您的域根目录），而不是：

window.location.hash = ''; // goes to /#, which is no better

Simply do : 简单地说：

window.location.hash = '!'; // goes to /#!, which allows Angular to take care of the rest