このチャプターの目次
FlutterでHTTP通信をやってみる
こんちには、皆さんZennの記事を書いているJboyです。
今日は、最近のWebの勉強のOUTPUTを兼ねてReactでやっていた自作したAPIからデータを取得するのをFlutterでやってみたいと思います。
Firebaseばかり使っていて、REST APIを使ったことなかったので、自作したAPIを表示できるのか自信がなかったものでやってみました!
といってもやることは単純で、自分のパソコンにモックサーバーを作って、そこからデータをインターネットに送信して、FlutterでHTTPリクエストを送ってデータを取得するだけです。
以前やってみたときは全然うまくいかなかった???
開発環境
- MacOS Monterey
- Flutter 3.3.1
- Dart 2.18.0
- flutter_riverpod: ^1.0.4
- http: ^0.13.5
- Node.js: v16.17.1
こちらが完成したプロジェクト
Flutterとmock-serverのサンプルコードを公開しております。
今回は、HTTPのGETメソッドを使って、ローカル環境に構築したmock-serverからデータを習得するのですが、HTTPのGETがわからないという方はこちらを参考にしてください。
とてもわかりやすいです。
それでは、次のページから学習を進めていきましょう。