🧝‍♀️

Flutterでdotenvを使ってみる

2021/04/24に公開

概要

dotenvは、Node.jsやRuby、PHPなどなどでライブラリが用意されている、環境毎の設定を管理する仕組みです。Flutterでもdotenvのライブラリが用意されていますので、ちょっと試してみました。今回はその内容を紹介したいと思います。

前提

  • Flutterのバージョンは2.0で動作確認しています。(1系のバージョンでも変わらないとは思うけど)
  • FltterWebで動作確認しています。(ネイティブアプリでも変わらないとは思うけど)

試してみた内容

基本はドキュメントに書いてある通りに進めていけば良いです。ただ、ちょっと詰まった部分もあったので、あらためて自分なりに対応した内容をまとめてみました。

1. インストール

flutter pub add flutter_dotenvを実行してください。

2. dependenciesの設定

pubspec.yamlsのdependencieにflutter_dotenv: ^3.1.0のような形で設定してください。バージョンは適宜変えて設定してください。

3. .envファイルの用意

環境毎の.envファイルを用意します。用意したら下記のような形式でpubspec.yamlsに設定を追加します。assets配下を例としていますが、パスは好きなもので良いと思います。あと、ファイルを読み込むロジックは後述しますが、用意するファイル数やファイル名も自分の環境に合わせて作成してください。

pubspec.yamls
assets:
  - .env.development
  - .env.production

4. envファイルの読み込み

環境毎に起動用のdartファイルを用意します。例えば開発用だったらmain_development.dart、本番用だったらmain_production.dartのような感じになります、そのファイルの中で読み込むenvファイルを指定します。

main_production.dart
import 'package:flutter/material.dart';
import 'package:flutter_dotenv/flutter_dotenv.dart' as DotEnv;
import 'widget/sample_app.dart';

Future main() async {
  await DotEnv.load(fileName: ".env.development");
  runApp(SampleApp());
}

5. 起動設定

起動時に読み込むdartファイルを指定します。Flutterで環境ごとにビルド設定を切り替える — iOS編の記事にある通り、flavorを使っても良いですし、--targetオプションで直接ファイルを指定しても良いです。なお、VSCodeでtargetを指定する方法をFlutterでFlavorによる環境分けを行ったらVS Codeのlaunch.jsonを編集しようにて紹介されてるので、こちらも参考になります。

6. .env設定の利用

ここまできたら.envファイルが読み込めているので、設定内容を参照できます。以下のような感じでenvから設定した変数名を取得できます。

sample_app.dar
import 'package:flutter_dotenv/flutter_dotenv.dart';
import 'package:http/http.dart' as http;
・
・
・
var url = Uri.parse(env['API_DOMMIN'] + "/getSample");
var resp = await http.get(url);

Discussion