shuhelohelo’s blog

Xamarin.Forms多めです.

Mobile Computing C# オンラインクラス 5 メモ

www.youtube.com

デバッグとWebAPIの利用について

デバッグTips

条件付きデバッグ

f:id:shuhelohelo:20191107004914p:plain

f:id:shuhelohelo:20191107004948p:plain

実行時の変数の値の編集

On the flyな変更ができる. ブレークポイントで止まった状態で,変数にマウスオーバーして,表示された変数の値をクリックすると編集できる.

いちいちデバッグをやり直す必要がない.

f:id:shuhelohelo:20191107005104p:plain

編集した結果↓

f:id:shuhelohelo:20191107005311p:plain

停止中に実行中のラインを移動させる

ブレークポイントで止めると,黄色いで次に実行される行が示されている.この⇒をドラッグ&ドロップで戻したり進めたりできる.

↓戻した.

f:id:shuhelohelo:20191107005850p:plain

コールスタック(同期)

現在いるメソッドがどういう順番で呼び出されたのかが,コールスタックとして表示される↓

f:id:shuhelohelo:20191107010125p:plain

下から上へ順にメソッドが呼び出されたことがわかる.

コールスタック(非同期)

非同期メソッドの呼び出しの場合,非同期部分のコールスタックが追加で表示される.

f:id:shuhelohelo:20191107010727p:plain

文字列の閲覧

文字列型の変数はもちろん中身を編集するだけでなく,中身を専用のビューワで表示できる.

Text, XML, HTML, Jsonの各文字列データをフォーマットして見やすく表示してくれる.

f:id:shuhelohelo:20191107011101p:plain

オブジェクトにマークをつける

コレクションからランダムでオブジェクトを取得したとき,そのオブジェクトがコレクション内のどのオブジェクトなのかを確認するために,オブジェクトにIdをつけてデバッグ時に追いかけることができる.

変数名をマウスオーバーして値がホバー表示されたら,そこで右クリックしてコンテキストメニューを表示させる.

f:id:shuhelohelo:20191107011754p:plain

メニューの中で「Make Object ID」という項目を選択する.

これでそのオブジェクト$数字というIDが付与される.この値は実行には関係ないただの目印.

ここでは例としてそのオブジェクトが格納されているコレクションの中身をマウスオーバーで表示させてみると,以下のように要素に$数字というIDがついているので,それを目印にできる.

f:id:shuhelohelo:20191107012309p:plain

ステップイン,ステップアウト

  • F10でステップイン
  • F11でステップアウト

ステップインはステップ実行のときに呼び出したメソッドの中に入っていく.

ステップアウトは呼び出したメソッドの中には入っていかない.

WebAPIの利用について

HttpClient

IHttpClientactoryを使ってインスタンスを生成する.

WebAPIから他のAPI(PokeAPI https://pokeapi.co/)にアクセスする.

    public class Pokemon
    {
        [JsonPropertyName("name")]
        public string Name { get; set; }
    }

    public class Pokemons
    {
        [JsonPropertyName("results")]
        public List<Pokemon> Results { get; set; }
    }

JsonPropertyName属性でプロパティとjsonの項目を結びつける.

やってはいけないこと.アクションメソッド内でHttpClientインスタンス化しないこと.

        [HttpGet]
        public IEnumerable<string> Get()
        {
            var httpClient = new HttpClient();
        }

以下のように

        private readonly HttpClient create;

        public PokemonController(IHttpClientFactory factory)
        {
            create = factory.CreateClient();
        }

Startup.csに以下を追加する.

            services.AddHttpClient();//

これで全てのページでHttpClientを使用できる.

HttpClientはログを吐き出してくれる.デフォルトで.

利用するAPIサーバーが決まっているのであれば,AddHttpClientでBaseAddressを指定することができる.

            services.AddHttpClient("pokeapi",c=> {
                c.BaseAddress = new Uri("https://pokeapi.co/api/v2/");
            });

上記のように名前付き(ここではpokeapi)で指定する.

Controller側ではCreateClientメソッドで以下のように先程の名前を使ってベースアドレスの指定を省略することができる.

        public PokemonController(IHttpClientFactory factory)
        {
            client = factory.CreateClient("pokeapi");
        }

Polly projectってなんだ? www.thepollyproject.org

WebAPIのドキュメントをどうやって作成するか?

WebAPIのドキュメントはSwaggerで記述する.

でもツライ.

https://htl-mobile-computing-5.azurewebsites.net/#/6/5

C#コードからSwaggerを生成するツールがある.

  • NSwag
  • Swashbuckle

今回はNSwagを使う.

まずはNugetからNSwag.AspNetCoreをインストールする.

次に,以下の公式GuideLineに従ってStartup.csにコードをいくつか追加する.

github.com

まずはConfigureServiceに以下を追加

            services.AddOpenApiDocument(); // add OpenAPI v3 document

次にConfigureに以下を追加.

            app.UseOpenApi(); // serve OpenAPI/Swagger documents
            app.UseSwaggerUi3(); // serve Swagger UI

これで準備はOk.

アプリケーションを実行する.

ルートURLにswaggerをつけたURLにアクセスする.

https://localhost:5001/swagger

すると,以下のようにアプリケーション内のWebAPIが表示される.

f:id:shuhelohelo:20191107123604p:plain

すごい!

Swaggerファイルは以下のリンク先で見ることができる.

f:id:shuhelohelo:20191107124015p:plain

これをeditor.swagger.ioに貼り付けると,同じ情報をみることができる.

このeditor.swagger.ioから各言語のクライアントのコードを生成できるが,おすすめしない.と言っていた.

f:id:shuhelohelo:20191107124635p:plain

C#のクライアントを生成するならNSwagStudioがいい.

どちらにせよ,Swaggerからクライアントコードを生成して,その中からModelクラスを探して使えば良い.

サーバー側でAPIの変更があった場合に,手作業で修正しなくてすむ.すむけれど...

今回のソースコード

https://github.com/shuheydev/CsCource/tree/master/Class5_CallingbackgroundSample