0

我们为我们的应用程序设置了一个简单的内联网络商店安装程序。

该应用程序站点已通过验证。内联安装对我们公司内部的一半人来说确实可以正常工作，但对另一半人却不起作用。他们会得到“Uncaught TypeError: Cannot call method 'install' of undefined testsupport.html:15 Uncaught SyntaxError: Unexpected token )。就好像 chrome 或 chrome.web 变量没有初始化一样。

为什么内联安装只在某些机器上有效，而在其他机器上无效？所有这些机器都有相同的 chrome 浏览器版本。

TIA

4

3 回答 3

1

您的内联安装标记是：

<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>标签没有多大意义）

于 2012-06-10T03:58:41.367 回答
1

我以前没有见过这个问题，但我会尝试提供我用来管理我网站上多个 Chrome 扩展的内联安装的设置的细分。

在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执行该类时将没有安装链接，因此不会绑定任何事件处理程序等。

以下是我如何使用该系统的示例；

主页： http: //neocotic.com

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

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

于 2012-06-07T08:50:53.737 回答
0

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

javascript:void()我通过替换#in摆脱了错误href。

<a href="#" onclick="chrome.webstore.install()">CaptureToCloud Chrome Extension Installation</a>
于 2012-06-06T06:38:23.930 回答