Question

我正在努力解决这个问题。

您会认为文档会提供简单直接的示例。

我想要的是获取共享按钮以共享自定义网址，而不是当前页面。

此处的文档... https://developers.google.com/+/web/share/

然后这就是我在下面尝试过的并且都失败了......

＃1

<div id="g-plus-footer" class="g-plus" data-action="share" data-annotation="bubble"></div>

<script>
    (function() {
      var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
      po.src = 'https://apis.google.com/js/plusone.js';
      var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
      gapi.plus.render('g-plus-footer', {'href':'http://mysite.co.uk'});
    })();
<script>

＃2

<div id="g-plus-footer" class="g-plus" data-action="share" data-annotation="bubble"></div>

<script>    
    (function() {
      var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
      po.src = 'https://apis.google.com/js/plusone.js';
      var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
    })();

    gapi.plus.render('g-plus-footer', {'href':'http://mysite.co.uk'});
</script>

＃3

<div onClick="gapi.plus.render('g-plus-footer', {'href':'http://mysite.co.uk'});" id="g-plus-footer" class="g-plus" data-action="share" data-annotation="bubble" ></div>

<script>   
    (function() {
      var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
      po.src = 'https://apis.google.com/js/plusone.js';
      var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
    })();
</script>

我似乎得到的所有错误（除了数字3）都是......

Uncaught ReferenceError: gapi is not defined

任何人都可以帮助了解我哪里出错了。

由于约什

Answer 1

你有两个概念在这里有点混淆，但你走在正确的轨道上。

异步加载gapi库，这就是你正在做的事情，将导致在完成加载时呈现“g-plus”类的所有内容。所以你不需要明确地调用任何东西。

但是，您确实需要在div上设置“data-href”属性。所以你应该使用类似

的标签

<div id="g-plus-footer" class="g-plus" data-href="http://example.com/" data-action="share" data-annotation="bubble"></div>

并在示例3中指定的结束正文标记之前加载库：

<script>   
(function() {
  var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
  po.src = 'https://apis.google.com/js/plusone.js';
  var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>

Answer 2

在引用gapi？

之前，您是否确保包含Google API库？

<script src="https://apis.google.com/js/plusone.js"></script>

<script type="text/javascript">
 // gapi should now be defined
</script>

您当前正在异步加载此文件，这意味着在检索脚本之前将不会定义gapi。同步这样做，你应该好好去。

Answer 3

您必须添加data-href：

<div id="g-plus-footer" data-href="http://mysite.co.uk" class="g-plus" data-action="share" data-annotation="bubble"></div>

<script>   
    (function() {
      var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
      po.src = 'https://apis.google.com/js/plusone.js';
      var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
    })();
</script>

Google分享按钮 - 自定义href网址

3 个答案: