5

私の Chrome 拡張機能のオプション ページでは、Angular.js を使用したいと思います (拡張機能のバックグラウンド JS またはコンテンツ スクリプトではなく、オプション ページのためだけに) が、それを私のページに含めて、次のようなことを行います。

<!doctype html>
<html ng-app>
<head>
  <title>Shortkeys Options</title>
  <script src="../js/jquery.min.js" type="text/javascript"></script>
  <script src="../js/angular.min.js" type="text/javascript"></script>
  <script src="../js/options.js" type="text/javascript"></script>
  <link rel="stylesheet" href="../css/options.css" />
</head>

<body>
  <div ng-controller="OptionsCtrl">
    <div ng-repeat="key in keys"></table>
  </div>
</body>
</html>

...開発ツールコンソールでこのエラーをスローし、何も実行されません:

Error: Code generation from strings disallowed for this context

Angular がページにタグを書き込もうとしている、またはインライン イベント ハンドラーまたはインライン JS を実行する何かを割り当てようとしていると思われますが、これは Chrome 拡張機能では許可されていません。これを回避する方法はありますか? たとえば、インライン JS を使用しないように Angular に指示できますか?

4

1 に答える 1

15

manifest_version: 2そのangular runをCSP準拠モードで指定することで利用できます。パネル ページng-cspの に属性を追加するだけです。<html>

したがって、HTML は次のようになります。

<!doctype html>
<html ng-csp ng-app>
<head>
  <title>Shortkeys Options</title>
  <script src="../js/jquery.min.js" type="text/javascript"></script>
  <script src="../js/angular.min.js" type="text/javascript"></script>
  <script src="../js/options.js" type="text/javascript"></script>
  <link rel="stylesheet" href="../css/options.css" />
</head>

<body>
  <div ng-controller="OptionsCtrl">
    <div ng-repeat="key in keys"></table>
  </div>
</body>
</html>
于 2012-06-20T17:03:12.857 に答える