javascriptでapiキーを隠す方法

javascriptでapiキーを隠す方法

• 簡単なコードをgithubにpushする時api keyを.envやnodejsを使わずに隠す方法です
• githubで言われないくらいのレベルの安全性

1. apikey.js ファイルをプロジェクトフォルダのrootに作成
   • 例）project/apikey.js

apikey.js

const config = {  
 apikey : "APIkeyを記述"  
}

2. index.html内にコードを作成

index.html

<script type="text/javascript" src="apikey.js"></script>

3. apiキーを使いたいファイルで記述

weather.js

const WEATHER_API_KEY = config.apikey;
console.log(WEATHER_API_KEY) // ← ブラウザで確認できる。

プロジェクトフォルダのrootに.gitignoreファイルを生成し同じrootにあるapikey.jsをgitから除外すること。

• これでnode.jsや.envを使わずに簡単に隠すことができる。