JavaScript で Google などの有料APIを使う実装をしている場合、ユーザ認証手段となるAPI キーはブラウザに渡されるスクリプトファイル内に書かれているので、厳密な意味では隠す事ができません。このため、例えばGoogle APIではむやみに APIキーが他人に利用されないように API キーを使用できるリファラーのドメインを指定する機能が提供されていますが、リファラーを書き換えることはさして難しい話でもないので、完全な防御にはならないのでは無いかと思います。

ということで、Apache の mod_rewrite を使って、API キーを隠す方法です。GET で API にアクセスしている場合に使えます。

API キーを隠す方法の概要

Apache の mod_rewrite の Pフラグ（プロキシ）を利用して、ローカルのパスを APIのURL に書き換えますが、その際、QSAフラグ（クエリ文字列をアペンド）も使って、隠したいパラメータを書き換え先のURL に含めておきます。

Apache の設定ファイルに隠したいパラメータを含め、動的に変更したいパラメータはスクリプトから送るようにします。

隠す API キーを含めた Apache の mod_rewrite 設定

Apache の設定ファイルには以下のように設定します。これは httpd.conf に記載する場合の例です。.htaccess に記載する場合は RewriteBase の設定などを適宜追加して下さい。SSLProxyEngine の設定は、API のURL が https の場合に必要です。

SSLProxyEngine on
RewriteRule ^/any/path$ https://www.apihost.com/api/path?key=xxx&another_param=xxx [P,L,QSA]

ブラウザ（JavaScript）からAPIにアクセスする時のURL

スクリプトからアクセスするURLは、自ホスト内のパスに、動的に変更したパラメータだけを追加してリクエストします。

http://www.myhost.com/any/path?additional_param=xxx

最終的にリクエストしているURL

mod_rewrite の書き換えにより、下記のURLにアクセスした結果を受け取る事ができます。このURLは、アクセスしているユーザ側には見えません。

https://www.apihost.com/api/path?key=xxx&another_param=xxx&additional_param=xxx

API に GET リクエストを送る JavaScript の例

JavaScript 側のコード例は下記のようになります。（jQuery を利用している場合。）

var vals = [
    {name: "additional_param", value: $("#some_field").val()}
];

$.get("/any/path", $.param(vals))
.done(
    function(response_data){
        // リクエストが成功した時の処理
})
.fail(
    function(response_data) {
        // リクエストが失敗した時の処理
})
;