.Net CoreのSwaggerを私と一緒に学び、フロントエンドとバックエンドが煩わしくなく、インターフェイスをカスタマイズできるようにします

序文

フロントエンドとバックエンドの分離開発モデルの人気により、インターフェースのドッキングと共同デバッグが一般的になりました。フロントエンドの同僚はよく尋ねます:どのインターフェースを調整する必要がありますか?このインターフェースのデータ形式は何ですか?条件は何ですか?一部の緊急インターフェースでは、通信とドッキングが採用され、ドキュメントが補足され、他のユーザーは返信します。ドキュメントを見てください。開発中にドキュメントを書く必要がありますか?初期の頃はそうだったのですが、バックエンドの同僚にとっては非常に不快でした。コードが一生懸命働いていたので、突然ドキュメントを書かなければなりませんでした(そうしないと、フロントエンドの同僚は常にコミュニケーションを促したり来たりしていました)。そして、Swaggerは問題を快適に解決できます(もちろん、他の方法もありますが、より人気のあるものを選択してください)。Swaggerを使用すると、おそらく次の利点があります。

  • 優れたビジュアルインターフェイス。オンラインで表示できます(カスタマイズ可能)。

  • フロントエンドとバックエンドのドッキングは、コードの作成中にドキュメントを作成しないようにするのに便利です。

  • API操作を直接実行して、セルフテストの効率を向上させることができます。

  • ドキュメントの生成は便利で、サードパーティのAPIインターフェイス管理プラットフォーム(YApiなど)と組み合わせてドキュメントを簡単に生成できます(ソフトウェアファイルのファイリングには大量のドキュメントが必要です)。ドキュメントがなく、コーディングに時間がかかります~~~

テキスト

ケースのデモンストレーション、古いルール、またはおなじみのWebApiプロジェクトに直接移動します。

デモを実行します。

コンポーネントの登録時に設定された名前が、ミドルウェアの登録時に設定されたjsonアドレスの名前と異なる場合、次のエラーが報告されます。

Swaggerの統合を完了するための3つの簡単なステップ:インストールパッケージ->登録済みコンポーネント->登録済みミドルウェア。

ただし、実行時にUrlアドレスを手動で入力する必要があるため、あまり使い勝手がよくありません。実行時に直接Swaggerページになることを願っています。コードは次のように最適化されています。

それは終わりましたか?もちろんそうではないので、フロントエンドの同僚は常にあなたに尋ねなければなりません:どのインターフェースを使いたいですか?インターフェイスパラメータのフィールドはどういう意味ですか?インターフェイスリストが表示されますが、インターフェイス機能がわかりませんが、着信条件パラメータフィールドはどういう意味ですか。

さあ、問題を解決するためにコメントを追加してください:

新しく追加されたユーザーインターフェイスは自動的に一覧表示されますが、コードに注釈が付けられていますが、Swaggerインターフェイスは表示されません。これは、Swaggerの注釈のソースが指定されていないためです。ここで問題に注意してください。アクションが指定されたHttpMethod(HttpGet、HttpPostなど)を表示しない場合、Swaggerは次のようにエラーを報告します。

さあ、コメントはまだ表示されていません、見下ろしてください↓↓↓

  1. まず、APIプロジェクトとモデルプロジェクトの構成に対応するxmlファイルを生成します。

  2. コードを追加し、コメントを解析する構成ファイルを指定してから、デモを実行します。

これで、Swaggerオンラインドキュメントへのテキスト説明の追加が完了し、フロントエンドとバックエンドのドッキングの問題が解決されます。ただし、コンパイルして実行すると、多くの警告が表示され、コメントは表示されません(CS1591)。

これは、xmlファイルを生成するためにコメントが必要なためです。プログラマーのクリーンさとして、これはもちろん許可されていません。小さな赤いボックスは、コードが1591であることを示します。このコードをプロジェクトの右クリック->プロパティ->生成インターフェイスに追加します。はい、次のとおりです。

コンパイルして再度実行します。警告はありません。クリーンは快適です~~~~~

ここに小さな詳細があります。コメントを読み取るようにxmlを構成するときに2番目のパラメーターを使用しない場合、デフォルトのコントローラーコメントは役に立たず、デモはここでは実行されません。コードの説明は次のとおりです。

Swaggerの統合はほぼ完了しており、将来の認証中に拡張される予定です。

Swaggerページの場合、開発は確実に満たすことができますが、常にいくつかの厳格な美学またはいくつかのページのカスタマイズ要件があるため、カスタムページは避けられません。友人はSwaggerのみがプロジェクトにインストールされていることに気付くでしょう。パッケージには対応する静的ファイルがありませんが、どのようにアクセスしますか?Swagger、インスピレーションが点滅しました。私の友人は、以前にファイルシステムで言及された埋め込みファイル(アセンブリにコンパイルされたファイル)について考えたことがあるはずです。デフォルトでは、Swagger関連ファイルはすべて埋め込みファイルであるため、プロジェクトで表示できません。に。ページをカスタマイズする方法は3つあります。

  • Swaggerのページはフロントエンドとバックエンドから分離されており、直接ダウンロードして拡張できます。

  • ホームページを直接作成し、関連するJSを挿入し、最後に埋め込みファイルに変更して、指定した読み込みページを表示します。

  • Swaggerがデフォルトで提供するAPIを介して、ページのカスタマイズに関連するJsファイルを挿入します。

比較的言えば、最初のコードは比較的明確で、コードはバックエンドコードとは関係がないため、ここでは最初のコードをデモンストレーションの例として取り上げ、他の2つは友人が探索して探索できるようにします。

おおよその手順:

  1. まず、Swaggerフロントエンドおよびバックエンドプロジェクトファイルをダウンロードします(ダウンロードアドレス:https://github.com/swagger-api/swagger-ui/)。

  2. ダウンロードしたファイルをdistでWebApiのwwwrootディレクトリにコピーします。

  3. WebApiは、静的ファイル処理機能、つまり静的ファイルミドルウェアの登録を可能にします。

  4. 静的ファイルを変更します(ファイルはローカルであり、必要に応じて実行します)。

  5. 実行して効果を確認します。

これは単にアイデアを提供するためのものであり、スタイルは良くありません、私に言わないでください(あなたはそれを言わないでしょう)、美化は時間の問題です、カスタムインターフェースはとてもシンプルです。

2つのヒントを追加します。

  • 通常、一部のインターフェイスは古くなっていますが、すぐに破棄できない場合は、リマインダーを送信できます。[廃止]機能を追加すると、それらは廃止されますが、引き続き使用でき、交換の移行期間があります。

  • 一部のインターフェイスをSwaggerドキュメントに表示したくない場合は、[ApiExplorerSettings(IgnoreApi = true)]を追加できます。

総括する

この記事を見ると、なぜこのような単純な統合について多くのことを話さなければならないのか不思議に思うかもしれません。実際、私は以前の調査の観点から立っており、それぞれの使用法を明確に表現したいと考えています。これを使用する理由はわかっているので、フォローアップ記事は段階的になり、Dockerの展開にジャンプしません。ゲートウェイはそれを使用します。 Dockerを習得していない場合は、ドキュメントを見ると混乱します。ケースに従えば、多くの結果は得られません。心配しないでください。言うべきことはすべて1つずつ表示されます。同時に、学習を続け、共有しようと思います。より技術的な知識。次のセクションでは、Jwt認証統合の使用について説明します。

プログラムに醜い、「コードバラエティショー」に注目し、私を認識してフォローしてくれるハンサムな男~~~

テキストを書くのは簡単ではありません。3回続けて見つめるだけではありません~~~~

おすすめ

転載: blog.csdn.net/sD7O95O/article/details/108891537