Question

google.com/webstore我添加了我的扩展程序
我已检查＆＃34;此项目使用内联安装。＆＃34;
网站：选择验证网站
google.com/webmasters我已添加网站并已验证。

当我把这段代码放在我的网站上时：

<link rel="chrome-webstore-item"href="https://chrome.google.com/webstore/detail/itemID">

<button onclick="chrome.webstore.install()" id="install-button">Add to Chrome</button>
<script>
if (document.getElementById('extension-is-installed')) {
  document.getElementById('install-button').style.display = 'none';
}
</script>

点击按钮＆＃34;添加到Chrome＆＃34;安装应用扩展程序，但当我刷新网站按钮＆＃34;添加到Chrome＆＃34;是显示。为什么？我无法理解

Answer 1

您显然正在遵循https://developer.chrome.com/webstore/inline_installation

指南

在这种情况下，你错过了一步......让我们看一下代码。

if (document.getElementById('extension-is-installed')) {
  document.getElementById('install-button').style.display = 'none';
}

此处的条件是页面上是否存在ID为extension-is-installed的元素。但是有什么补充呢？

退一步：

例如，您可以拥有一个以安装页面为目标的内容脚本：
var isInstalledNode = document.createElement('div');
isInstalledNode.id = 'extension-is-installed';
document.body.appendChild(isInstalledNode);

因此，您需要添加一个Content Script，将该元素添加到页面中。

然而，我怀疑该指南会起作用。默认情况下，内容脚本在加载DOM后执行（因此，隐藏脚本已执行）。您可以在document_start运行它们，但之后body尚不存在。

让我根据与扩展程序using "externally_connectable"的通信，制作一个替代隐藏脚本。假设您的网站为example.com，且您的扩展程序的ID为itemID

将example.com添加到您要发送消息的网站：

  "externally_connectable" : {
    "matches" : [
      "*://*.example.com/*"
    ]
  },

在您的背景页面中，准备来自网页的消息：

chrome.runtime.onMessageExternal.addListener(
  function(message, sender, sendResponse) {
    if(message.areYouThere) sendResponse(true);
  }
);

在example.com的页面中，添加一个按钮（默认隐藏）和代码以在适当时显示：

    <button onclick="chrome.webstore.install()"
      id="install-button" style="display:none;">
      Add to Chrome
    </button>
    <script>
      if (chrome) {
        // The browser is Chrome, so we may need to show the button
        if(chrome.runtime && chrome.runtime.sendMessage) {
          // Some extension is ready to receive messages from us
          // Test it:
          chrome.runtime.sendMessage(
            "itemID",
            {areYouThere: true},
            function(response) {
              if(response) {
                // Extension is already installed, keep hidden
              } else {
                // No positive answer - it wasn't our extension
                document.getElementById('install-button').style.display = 'block';
              }
            }
          );
        } else {
          // Extension is not installed, show button
          document.getElementById('install-button').style.display = 'block';
        }
      }
    </script>

请求在安装后添加页面重新加载。 chrome.webstore.install has a callback parameter专门用于此。

不使用onclick属性，而是指定一个函数：

document.getElementById('install-button').addEventListener("click", function(e) {
  chrome.webstore.install(function() {
    // Installation successful
    location.reload();
  });
});

谷歌扩展内联安装和验证无法正常工作

1 个答案: