Question

我们为我们的应用设置了一个简单的内联webstore installe r。

该应用网站已经过验证。对于我们公司内部的一半人来说，内联安装确实可以正常工作，但是对于另一半，它不起作用。他们会得到“Uncaught TypeError：无法调用undefined testsupport.html的方法'install'：15 未捕获的SyntaxError：意外的令牌）。就好像chrome或chrome.web变量没有初始化一样。

为什么内联安装仅适用于某些机器而不适用于其他机器？所有这些机器都具有相同的Chrome浏览器版本。

TIA

Answer 1

我之前没有看到此问题，但我会尝试提供用于管理inline installations上多个Chrome扩展程序my website的设置细分。

在每个页面的head节点内（可选地，只包含可能包含一个或多个安装链接的网页）我将所需的链接添加到Chrome网上应用店中的每个扩展程序/应用页面。这使我可以轻松地在页面的任何位置添加安装链接，用于各种扩展/应用程序。一旦DOM加载完成，JavaScript就会将事件处理程序绑定到每个安装链接。此事件处理程序的唯一目的是安装单击时链接到的扩展程序/应用程序，然后更改其状态以防止进一步的安装尝试。

<!DOCTYPE html>
<html>
  <head>
    ...
    <!-- Link for each extension/app page -->
    <link rel="chrome-webstore-item" href="https://chrome.google.com/webstore/detail/dcjnfaoifoefmnbhhlbppaebgnccfddf">
    <script>
      // Ensure that the DOM has fully loaded
      document.addEventListener('DOMContentLoaded', function() {
        // Support other browsers
        var chrome = window.chrome || {};
        if (chrome.app && chrome.webstore) {
          // Fetch all install links
          var links = document.querySelectorAll('.js-chrome-install');
          // Create "click" event listener
          var onClick = function(e) {
            var that = this;
            // Attempt to install the extension/app
            chrome.webstore.install(that.href, function() {
              // Change the state of the button
              that.innerHTML = 'Installed';
              that.classList.remove('js-chrome-install');
              // Prevent any further clicks from attempting an install
              that.removeEventListener('click', onClick);
            });
            // Prevent the opening of the Web Store page
            e.preventDefault();
          };
          // Bind "click" event listener to links
          for (var i = 0; i < links.length; i++) {
            links[i].addEventListener('click', onClick);
          }
        }
      });
    </script>
    ...
  </head>
  <body>
    ...
    <!-- Allow inline installation links to be easily identified -->
    <a href="https://chrome.google.com/webstore/detail/dcjnfaoifoefmnbhhlbppaebgnccfddf" class="js-chrome-install">Install</a>
    ...
  </body>
</html>

为了使此系统完全正常运行，您还需要支持用户在安装扩展程序/应用程序后返回到您网站的方案。虽然官方文档建议使用chrome.app.isInstalled，但是当从单个页面安装多个扩展/应用程序时，这不起作用。要解决此问题，您只需将内容脚本添加到您的扩展程序/应用程序，如下面的install.js文件;

// Fetch all install links for this extension/app running
var links = document.querySelectorAll('.js-chrome-install[href$=dcjnfaoifoefmnbhhlbppaebgnccfddf]');
// Change the state of all links
for (var i = 0; i < links.length; i++) {
  links[i].innerHTML = 'Installed';
  // Website script will no longer bind "click" event listener as this will be executed first
  links[i].classList.remove('js-chrome-install');
}

然后您只需修改manifest.json文件以确保在您的域上执行此内容脚本。

{
  ...
  "content_scripts": [
    {
      "js": ["install.js"],
      "matches": ["*://*.yourdomain.com/*"],
      "run_at": "document_end"
    }
  ]
  ...
}

这将导致内容脚本在您的网站上的JavaScript之前运行，因此在执行时将没有js-chrome-install类的安装链接，因此不会绑定事件处理程序等。< / p>

以下是我如何使用此系统的示例;

主页： http://neocotic.com

项目主页： http://neocotic.com/template

项目源代码： https://github.com/neocotic/template

Answer 2

您的内联安装标记为：

<a href="#" onclick="chrome.webstore.install()">
  CaptureToCloud Chrome Extension Installation
</a>

（根据其中一条评论，它之前使用的是javascript:void(0)，在这种情况下相当于#。

您的<a>标记既导航页面又有onclick处理程序。在某些情况下，导航发生在onclick处理程序完成运行之前，这会干扰支持内联安装的代码。

如果您切换到使用普通<span>（如果您愿意，可以看起来像样子一样），那么您应该不再有这个问题：

<span onclick="chrome.webstore.install()" style="text-decoration: underline; color:blue">
  CaptureToCloud Chrome Extension Installation
</span>

或者，您可以return false处理onclick来阻止导航：

<a href="#" onclick="chrome.webstore.install(); return false;">
  CaptureToCloud Chrome Extension Installation
</a>

（虽然因为你实际上没有在任何地方进行链接，所以使用<a>标签没有多大意义）

Answer 3

我收到您提到的错误以及允许我安装扩展程序的弹出窗口。所以可能每个人都会得到错误，但对某些人来说这是在阻止安装。

我在javascript:void()中将#替换为href，从而消除了错误。

<a href="#" onclick="chrome.webstore.install()">CaptureToCloud Chrome Extension Installation</a>

Chrome内联安装仅在一半的时间内正常运行

3 个答案: