0

アプリ用のシンプルなインラインウェブストア インストーラーをセットアップしました。

アプリのサイトは確認済みです。インライン インストールは、社内の半分には正しく機能しますが、残りの半分には機能しません。「Uncaught TypeError: Cannot call method 'install' of undefined testsupport.html:15 Uncaught SyntaxError: Unexpected token 」というメッセージが表示されます。まるで chrome または chrome.web 変数が初期化されていないかのようです。

インライン インストールが一部のマシンでのみ機能し、他のマシンでは機能しないのはなぜですか? これらのマシンはすべて、同じ Chrome ブラウザ バージョンを使用しています。

ティア

4

3 に答える 3

1

インライン インストール マークアップは次のとおりです。

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

(コメントの1つによると、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すべてのページ (オプションで、1 つ以上のインストール リンクを含むページのみ)のノード内に、Chrome Web ストアの各拡張機能/アプリ ページに必要なリンクを追加します。これにより、さまざまな拡張機能/アプリのインストール リンクをページのどこにでも簡単に追加できます。JavaScript は、DOM の読み込みが完了すると、イベント ハンドラーを各インストール リンクにバインドするだけです。このイベント ハンドラーの唯一の目的は、クリック時にリンク先の拡張機能/アプリをインストールし、その状態を変更してそれ以上のインストール試行を防ぐことです。

<!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>

このシステムが完全に機能するためには、ユーザーが拡張機能/アプリをインストールした後に Web サイトに戻った場合のシナリオもサポートする必要があります。公式ドキュメントでは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"
    }
  ]
  ...
}

これにより、Web サイトの 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()で置き換えること#でエラーを取り除きましたhref

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