underscore.js _.templateは、クロム拡張機能からエラーを引き起こします

StackOverflow https://stackoverflow.com/questions/8807437

質問

使用する場合 underscore.js's _。テンプレート（） Google Chrome拡張機能の内部から、コンソールで次のエラーが発生します。

猛攻撃エラー：このコンテキストで許可されていない文字列からのコード生成

このエラーを乗り越える方法はありますか？

役に立ちましたか？

解決

残念ながら、underscore.jsの_.template（）をChrome拡張機能内から使用できるとは思いません...少なくとも新しいmanifest.jsonバージョン2では、同じことが当てはまります。 jQueryテンプレートプラグイン.

Google Chrome拡張機能から コンテンツセキュリティポリシー ページ：

インラインJavaScriptの実行に対する制限を緩和するメカニズムはありません。特に、安全でないインラインを含むスクリプトポリシーを設定しても効果はありません。これは意図的です。

私は、うまくいけば、 新しい関数 物体。

他のヒント

それを作成するためにそれを指摘したChromiumリストの寄稿者に感謝します Function アンダースコアが行う方法のオブジェクトはそれを必要とします manifest.json のオプション content_security_policy 「危険な平均」を含める。

例として、あなた manifest.json になり得る

{
  "manifest_version": 2,
  ...
  "content_security_policy": "script-src 'self' 'unsafe-eval'",
  ...
}

そして、このポリシーがそれを許可するため、アンダースコアの動作は機能します。フォーマットの詳細については、このオプションのChromeドキュメントを参照してください ここ.

私が使う Underscore.js 欲しいから Backbone.js Chrome拡張機能のために、テンプレートエンジンをに変更しました Mustache 〜同じ理由がある場合は、backboneにunderscore.jsを使用することもできます。 _.template() 関数。

Googleは、この問題の解決策を議論する新しいドキュメントをリリースしたばかりですか？

http://code.google.com/chrome/extensions/trunk/sandboxingeval.html

上記のように、マニフェストV2の制限は、Content Security Policyで再生する場合でも、評価、新しい機能、およびインラインスクリプトを使用することを禁じています。 このセキュリティポリシーを緩和する方法はありません V2拡張機能。

ほとんどのテンプレートライブラリは、ある時点または別の時点で使用します。 1つの解決策は、すべてのロジックがJavaScriptに存在するように、拡張機能を書き換えることです。などのソリューション Google jStemPlate この場合、使用可能である必要があります。

ただし、評価と新しい機能を実行するオプションがあります サンドボックスiframe, 、たとえば、マニフェストに次の行があります。

"sandbox": {
    "pages": [
      "page1.html",
      "directory/page2.html"
    ]
},

サンドボックスページは、拡張機能またはアプリAPIにアクセスしたり、サンドボックス以外のページに直接アクセスしたりしません（PostMessage（）を介して通信する場合があります）。特定のCSPでサンドボックスの権利をさらに制限することができます

Google Chromeチームの完全な例があります iframeのgithub評価 サンドボックス化されたiframeと通信することにより、問題を回避する方法と 短い分析チュートリアル

このメカニズムを使用していくつかのライブラリが表示され、標準のテンプレートの使用と完全な互換性を提供することを願っていますが、パフォーマンス上の理由でテンプレートからできるだけ多くのロジックを削除することをお勧めします...

Googleのおかげで、ラインナップには多くの拡張書き換えがあります:(

jquery'sを使用して独自のテンプレートミニエンジンを書くことができます $('<element .../>') 工事。

きれいな方法：

function myElement(text) {
  var d = $('<div class="abc"/>');
  d.text(text);
  return d;
}

myElement('my text').appendTo(domParent);

汚い方法：

var yourTemplate = '<div>${somevar}</div>';

function instTemplate(tmpl, text) {
  return $(tmpl.replace(/\$\{somevar\}/g, text));
}

instTemplate(yourTemplate, 'your text').appendTo(domParent);

たとえば、置換データが有害でないことがわかっている場合、Dirty Methodを使用して簡単なjquery.tmplテンプレートを書き直すのはかなり簡単です。

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top