AngularJS - Facebook 分享者答案

【问题标题】：AngularJS - Facebook SharerAngularJS - Facebook 分享者
【发布时间】：2015-06-24 18:19:40
【问题描述】：

我正在尝试在 AngularJS 中使用 Facebook 分享。下面是我在用户点击 FB 图标时调用的函数。

    $scope.shareFB = function(){

        // Get configuration ID from service
        configuratorService.storeConfiguration($scope.modelCode, function(configID){
            // Use saved configuration id to create share link
            var base = $location.absUrl().replace($location.url(), '');
            var byoUrl = base + "/" + $scope.modelCode + "/resume/" + configID;
            console.log(byoUrl);
            var fbpopup = window.open("https://www.facebook.com/sharer/sharer.php?u=" + byoUrl, "pop", "width=600, height=400, scrollbars=no");
        });

    }

当我尝试分享“https://www.google.com/”之类的网址时，此功能可以正常工作

Facebook 弹出窗口的 URL = "https://www.facebook.com/sharer/sharer.php?u=https://www.google.com/"

当我使用上面的函数时：

byoUrl = "http://localhost:8000/#/15K6/resume/9295316837"

生成的 FB 弹出窗口的 URL = "https://www.facebook.com/15K6/resume/9295316837"

为什么“/sharer/sharer.php?=http://localhost:8000/#/”会被截断？

【问题讨论】：

研究关键词：网址编码。

标签： javascript angularjs facebook

【解决方案1】：

您甚至不应该尝试共享 localhost URL，因为 Facebook 永远无法抓取它。这很可能是您的 URL 被截断的原因。 Facebook 试图解决它并抓取它，但它永远不会找到它，因此它会尽最大努力在其内部进行重定向。示例：

https://www.facebook.com/sharer/sharer.php?u=http://localhost:8000/#/coke

【讨论】：

【解决方案2】：

尝试将您的共享逻辑放入控制器中。类似的东西。

  // Share posts
  $scope.fbShare = function(post){
    FB.ui(
    {
        method: 'feed',
        name: post.title,
        link: 'http://www.cengkuru.com/'+post.slug,
        picture: '',
        caption: '',
        description: $filter('limitTo')($scope.post.body, 150),
        message: ''
    });
  }

<div id="fb-root"></div>
<script>
    window.fbAsyncInit = function() {
        FB.init({appId: 'YOUR_APP_ID', status: true, cookie: true,
        xfbml: true});
    };
    (function() {
        var e = document.createElement('script'); e.async = true;
        e.src = document.location.protocol +
        '//connect.facebook.net/en_US/all.js';
        document.getElementById('fb-root').appendChild(e);
    }());
  </script>

【讨论】：