Chromeアプリは Content Security Policy（CSP）*1が厳しいので、通常のウェブページと同じような方法でJavaScriptを書いてTwitter APIを呼ぶことができません。
Twitter APIを呼ぶということは、アプリに外部からのリソースを取り込むということになります。これを通常のウェブページで実現するためには、<img>や<script>などのタグでお馴染みのsrc属性に、リソースのURLを指定してあげるだけでOKです。これと同等のことをChromeアプリで行うための方法をご紹介します。
ここからは、ウェブページとChromeアプリでのTwitter search APIの呼び出し方を比較してみたいと思います。この記事の最後に、Chromeアプリ用のソースコードのフルバージョンサンプルを添付しましたのでよろしければご利用ください（LICENSE: MIT）。
ウェブページver
Twitter APIのkeyやqueryなどを指定した後、JavaScriptで動的にscriptタグを生成します。続いてsrc属性にAPIのURLを与えます。最後に、このタグをHTML中に埋め込みます。
https://gist.github.com/69d362d0274297aa3269
Chromeアプリver
scriptタグを動的に生成しても外部のURLに対してsrc属性が使用できないので、この方法は諦めます。代わりにXMLHttpRequest()を用います。
https://gist.github.com/a2533103ff5c2c68aba7
これらをふまえて、、
ChromeアプリでTwitterを検索するためのサンプルコード
以下のサンプルプログラム内では、Twitter APIの認証処理を簡潔にしてくれるライブラリ「oauth.js」と「sha1.js」を使用させていただきました。
https://gist.github.com/daiz713/8e75094f9d5b8bf4d1c8
- 各種APIキーは、https://apps.twitter.com/で取得できます。
- Twitter search API の細かい仕様は、https://dev.twitter.com/rest/public/searchで確認できます。
- Twitter API のエンコーディングは UTF-8 なので、HTMLのheadタグに
<meta charset="UTF-8">を忘れずに記述してください。*2
以上です、ありがとうございました。
*1:こちらの記事（Chrome Dev Editor の 'Refactor for CSP' で何が行われているのかを調べた - daizの日記）でもCSPについて書いています。
