.net6基于swagger的轻量级,注入化的api-ui组件FytApi.MUI

最新推荐文章于 2026-01-14 14:23:50 发布

原创最新推荐文章于 2026-01-14 14:23:50 发布 · 1k 阅读

3 ·

本内容遵循CC 4.0 BY-SA版权协议

收录于

笔记

API

.NET CORE 6

本文介绍了一个基于.NET6的轻量级API-UI组件FytApi.MUI，该组件支持主题切换、权限认证等功能，并提供了详细的安装及配置步骤。

.net6基于swagger的轻量级,注入化的api-ui组件FytApi.MUI

在之前的API UI界面有用过AspNetCore.Knife4jUI的一个swagger ui库，今天偶然发现这个界面很美观就学习了一下，看着还不错

Knife4jUI

ASP.NET.Core 的Knife4jUI的swagger UI可以这里查看

fytapi.mui

简单介绍一下，它是基于swagger的轻量级，注入化的api-ui组件
支持.NetCore 3.1、5.0、6.0

特点

零浸入、轻量、简单、好看、好用

可配置权限认证以及Header，支持数组

支持主题切换 ** 暗黑/亮白**

返回值Json示例，表格可视化展示数据注释信息，支持层级嵌套

官方提供的实例演示

开源项目：FytSoa Admin

演示地址：FyApiUI

学习

1.创建ASP.NET.Core 的API项目（目标框架.NET6）
2.FytApi.MUI NuGet安装
在这里插入图片描述
3.launchSettings.json 配置launchUrl

{
  "$schema": "https://json.schemastore.org/launchsettings.json",
  "iisSettings": {
    "windowsAuthentication": false,
    "anonymousAuthentication": true,
    "iisExpress": {
      "applicationUrl": "http://localhost:13484",
      "sslPort": 0
    }
  },
  "profiles": {
    "Justin.ApolloNet": {
      "commandName": "Project",
      "dotnetRunMessages": true,
      "launchBrowser": true,
      "launchUrl": "fytapiui/index.html", //将swagger 修改为 fytapiui/index.html
      "applicationUrl": "http://localhost:5047",
      "environmentVariables": {
        "ASPNETCORE_ENVIRONMENT": "Development"
      }
    },
    "IIS Express": {
      "commandName": "IISExpress",
      "launchBrowser": true,
      "launchUrl": "fytapiui/index.html", //将swagger 修改为 fytapiui/index.html
      "environmentVariables": {
        "ASPNETCORE_ENVIRONMENT": "Development"
      }
    }
  }
}

4.Program里注册服务组件

var builder = WebApplication.CreateBuilder(args);
…………………………
builder.Services.AddSwaggerGen(options =>
{
    // 配置相关组
    options.SwaggerDoc("v1", new Microsoft.OpenApi.Models.OpenApiInfo { Title = "ApolloNet", Version = "v1" });
    options.SwaggerDoc("v2", new Microsoft.OpenApi.Models.OpenApiInfo { Title = "FytApi.MUI-Swagger", Version = "v1" });
    // 增加项目xml注释显示，如果有多个类库要显示，可以继续增加
    options.IncludeXmlComments(Path.Combine(AppContext.BaseDirectory, "Justin.ApolloNet.xml"), true);

builder.Host.ConfigureAppConfiguration…………

   
});

#region FytApi.MUI 基于 Swagger 的 API-UI 组件
app.UseFytApiUI(c =>
{
    c.SwaggerEndpoint("/swagger/v1/swagger.json", "ApolloNet", "v1");
    c.SwaggerEndpoint("/swagger/v2/swagger.json", "FytApi.MUI-Swagger", "v2");
});
app.UseStaticFiles();
#endregion

5.新建API接口

using Com.Ctrip.Framework.Apollo.Logging;
using Microsoft.AspNetCore.Identity;
using Microsoft.AspNetCore.Mvc;

namespace Justin.ApolloNet.Controllers
{
    [ApiController]
    [Route("[controller]")]
    public class WeatherForecastController : ControllerBase
    {
        private static readonly string[] Summaries = new[]
        {
        "Freezing", "Bracing", "Chilly", "Cool", "Mild", "Warm", "Balmy", "Hot", "Sweltering", "Scorching"
    };

        private readonly ILogger<WeatherForecastController> _logger;

 

        public WeatherForecastController(ILogger<WeatherForecastController> logger)
        {
            _logger = logger;
        }

        [HttpGet(Name = "GetWeatherForecast")]
        public IEnumerable<WeatherForecast> Get()
        {
            return Enumerable.Range(1, 5).Select(index => new WeatherForecast
            {
                Date = DateTime.Now.AddDays(index),
                TemperatureC = Random.Shared.Next(-20, 55),
                Summary = Summaries[Random.Shared.Next(Summaries.Length)]
            })
            .ToArray();
        }
        //这个是APOLLO配置中心api详细可以看这里内容
        //https://blog.csdn.net/Laity07/article/details/127937142
        [HttpGet]
        [Route("apollo")]
        public IActionResult ApolloTest([FromServices] IConfiguration configuration, string key)
        {
          
            return Content(configuration.GetValue<string>(key));
        }
    }
}