3

有人问过类似的问题,但这些问题的解决方案似乎对我没有帮助。

我有一个在虚拟机上运行的本地开发站点:http: //lamp.site

index.php加载时,我已经运行了这个 javascript(使用正确的 appId):

/* facebook auth */ 
window.fbAsyncInit = function() {
    FB.init({
        appId: '01234567890',
        channelUrl: 'http://lamp.site/channel.html'
    });
};

// Load the SDK Asynchronously
(function(d){
    var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
    if (d.getElementById(id)) {return;}
    js = d.createElement('script'); js.id = id; js.async = true;
    js.src = "//connect.facebook.net/en_US/all.js";
    ref.parentNode.insertBefore(js, ref);
}(document));

然后当一个按钮被点击时,这个javascript函数被触发:

#HTML
<li><a class="btn" href="#" ng-click="connectToFacebook()">Connect with Facebook</a></li>

#Snippet in AngularJS Controller
$scope.connectToFacebook = function() {
    facebookConnect.authenticate(
    function(reason) { // fail
        console.log(reason);
    }, 
    function(user) { // success
        console.log('logged in',user);
        //Session.login();
    });

    return false;
}

#Factory in AngularJS module
.factory('facebookConnect', function() {
return {
    authenticate: function(fail, success) {
        FB.login(function(response) {
            console.log(response);
            if (response.authResponse) {
                FB.api('/me', success);
            } else {
                fail('User cancelled login or did not fully authorize.');
            }
        });
    }
}

如果我在 Firefox 中按下按钮,它就可以工作!可爱的,我从 Facebook 得到了所有正确的东西。

如果我在我的 PC 上使用 Chrome 或 Safari,或者在我的 iPhone 上使用 Safari Mobile,我会弹出 Facebook 登录窗口,并显示消息“发生错误。请稍后再试”。,以及以下控制台数据:

Unsafe JavaScript attempt to access frame with URL
https://www.facebook.com/dialog/permissions.request from frame with URL
http://lamp.site/index.php?page=login. Domains, protocols and ports must match.

Object
authResponse: null
status: "not_authorized"
__proto__: Object

User cancelled login or did not fully authorize. 

我已将本地测试 URL 添加到开发人员部分的 facebook 应用程序中,因为它使用 Firefox 登录,所以可以正常工作。这是我的频道文件,存储在http://lamp.site/channel.html

<script src="http://connect.facebook.net/en_US/all.js"></script>

我尝试过在src=标签中使用和不使用http:的频道文件。

facebook 应用程序具有以下设置:

所以它在Firefox中工作,我到底做错了什么。我不能只启用跨站点脚本,因为用户不会这样做,这将进入移动站点。

最近还有其他人设法解决这个问题吗?

所有其他类似的问题都没有得到解答……一定有人解决了这个问题!

编辑:我在我的网站上制作了一个简化版本,新的应用程序 ID。

http://dev.willshawmedia.com/fb/

这是来自 Facebook Dev 应用程序面板的应用程序 ID 的屏幕截图

Facebook 开发应用详细信息

您可以查看源代码,它是直接从这里复制的:

https://developers.facebook.com/docs/guides/web/

并且频道文件确实存在:

http://dev.willshawmedia.com/fb/channel.html

我不能让它变得更简单,我仍然收到“发生错误。请稍后再试”。消息,但现在它只是转发到 Facebook,而不是验证和关闭。

编辑:我错过了站点 URL,我已经添加了这些,简单的示例正在运行。

由于它在我的实时站点上运行,因此它必须与我的本地域有关。但我的/etc/hosts/文件中有这一行:

192.168.0.13 lamp.site

那是在我的笔记本电脑上运行的 VirtualBox Ubuntu 服务器的 IP 地址。我可以很好地浏览那个网站。

4

2 回答 2

6

必须禁用沙盒模式才能在 Chrome 中运行。就是这样,这就是一切。

我启用了该模式,因为我认为这会阻止它出现在搜索中,这是我不想要的。由于它在 Firefox 中有效,我看不出这是个问题。但是你去了,我关闭了沙盒模式,它立即开始工作。

沙盒模式

我不明白为什么这会阻止 Chrome。

于 2012-10-14T14:53:53.233 回答
1

你的工厂有一些奇怪的JavaScript:return new function()......除此之外我没有看到任何问题。我正在使用相同的基本技术,并且在 Chrome 中没有任何问题。

确保您的 Facebook 应用程序已设置为您的域(我们称其为“mydomain.com”)...然后,要在本地进行测试,您需要编辑主机文件以将 mydomain.com 指向 127.0.0.1 .. . 所以浏览器位置中的 URL 与 Facebook 的预期相符。

这可能是我正在做的事情和你正在做的事情之间的唯一区别。

...还要确保您的 App ID 是设置 Facebook 应用程序时的正确 App ID。仔细检查一下。BS“测试”应用 ID 也会给你错误信息。

-

-


编辑:在new function(){ }前面......我认为这不是你的问题......我想解释一下:

var x = new function() { this.foo = 'test'; };

是相同的

var x = { foo: 'test' };

因为new关键字是用来作为对象构造函数调用函数的,而你在一个不能再次使用的匿名函数上使用new,所以没有理由声明它。

所以你的片段可以(并且可能应该)是:

.factory('facebookConnect', function() {
    return {
        authenticate: function(fail, success) {
            FB.login(function(response) {
                console.log(response);
                if (response.authResponse) {
                    FB.api('/me', success);
                } else {
                    fail('User cancelled login or did not fully authorize.');
                }
            });
        }
    }
});
于 2012-10-12T13:17:53.093 回答