angularjs - 如何为社交分享设置angularjs单页应用程序

Question

我正在尝试使用 Express.js 和 AngularJS 设置与 SPA 的社交共享。问题是，我想分享动态内容，所以我使用 angular-facebook-factory获取 facebook 按钮。按钮有效，参数已设置，只是我传递的图像、标题和描述参数永远不会进入 facebook 共享弹出屏幕。

$scope.shareEvent = function (event) {
        console.log('verify values: ', event.image); // works fine!
        FacebookService.share({
            href: 'http://www.example.com/event/'+event_id+'/', // this value is passed
            title: event.title, // Not shown
            description: event.desc, // Not shown
            image: event.image // Not shown
        }, function (response) {
            $scope.me = response;
            $scope.status = true;
        })
    }

FB 共享从 http://www.example.com/ 加载默认值(如 和 )并使用 set href param ( http://www.example.com/event )。我也尝试使用 method: 'feed'，但没有成功。我应该在页面上有几个不同的共享按钮，所以我猜 meta og 标签不会这样做......

这是具有 ui-view 数量的 SPA，使用 html5 的 ui-router 工作正常，一切正常。

Answer 1

这是因为 Facebook 爬虫无法呈现 javaScript!

在 SEO 集成方面，Angular JS 不太友好。

检查你的代码:

$scope.shareEvent = function (event) {
        console.log('verify values: ', event.image); // works fine!
        FacebookService.share({
            href: 'http://www.example.com/event/'+event_id+'/', // this value is passed
            title: event.title, // Not shown
            description: event.desc, // Not shown
            image: event.image // Not shown
        }, function (response) {
            $scope.me = response;
            $scope.status = true;
        })
    }

you said console.log(event.image);  / Works fine 

The reason is same, your browser is able to render the JavaScript. But Facebook crawler is unable to process that javaScript.