Blazor Web 程序集不返回控制器中捕获的数据库行答案

【问题标题】：Blazor Web Assembly Not Returning DB Rows Captured in ControllerBlazor Web 程序集不返回控制器中捕获的数据库行
【发布时间】：2020-03-13 22:48:59
【问题描述】：

我正在尝试从我的 Razor 代码向我的控制器发出请求，并返回我知道我在数据库中的一行。

独家新闻 - 我在 Razor 中进行 GET 调用 -> 它转到我的控制器中的 GET，我知道它会返回我的一个 DB 行。所以后端的一切看起来都很好。然后我将它返回到我的前端，但是从 GET 到我的控制器的数据不存在，它只包含我放入对象中的原始数据。

这是一个 Blazor Web Assembly 应用程序，所以我已经在浏览器中对前端的东西进行了所有调试，并对任何后端进行了 VS 调试，以查看发生了什么。但我无法弄清楚这里的交易是什么......

这是怎么回事？？？

/*Razror C#*/

private List<Items> items;

private int Id { get; set; } = 0;
private string Name { get; set; } = "";
private string Description { get; set; } = "";


protected override async Task OnInitializedAsync()
{

   items = await Http.GetJsonAsync<List<Items>>(APIServer);

   //value - 0
   int testID = items.ElementAt(0).Id;

   value - ""
   string testNAME = items.ElementAt(0).Name;

   value - ""
   string testDES = items.ElementAt(0).Description;

}
    
    
    
    
    ....
    
    
 /*Controller*/       
    
[HttpGet]
public async Task<IEnumerable<Item>> GetAsync()
{
   List<Item> currentIems= new List<Item>();
   currentItems = await _dbContext.Item.ToListAsync();


   //this DOES in fact return my 1 row I have in the DB
   return currentItems;
}

【问题讨论】：

标签： javascript c# html asp.net-core asp.net-mvc-4

【解决方案1】：

这是一个工作演示，您可以参考：

items.Razor

@page "/Items"
@inject HttpClient Http

<div>
@if (items == null)
{
    <div>Loading...</div>
}
else
{
    <table>
        <thead>
            <tr>
                <th>Id</th>
                <th>Name</th>
                <th>Description</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>@items.ElementAt(0).Id</td>
                <td>@items.ElementAt(0).Name</td>
                <td>@items.ElementAt(0).Description</td>
            </tr>
        </tbody>
    </table>
}
</div>

@code {
  private List<Item> items;

  private class Item
  {
    public int Id { get; set; } = 0;
    public string Name { get; set; } = "";
    public string Description { get; set; } = "";
  }


  protected override async Task OnInitializedAsync()
  {
    items = await Http.GetJsonAsync<List<Item>>("https://localhost:44370/api/test");
  }
}

WebAPI 控制器

[Route("api/[controller]")]
[ApiController]
public class TestController : ControllerBase
{
    public readonly WebAPIDbContext _dbContext;
    public TestController(WebAPIDbContext dbContext)
    {
        _dbContext = dbContext;
    }
    [HttpGet]
    public async Task<IEnumerable<Item>> GetAsync()
    {
        List<Item> currentItems = new List<Item>();
        currentItems = await _dbContext.Item.ToListAsync();


        //this DOES in fact return my 1 row I have in the DB
        return currentItems;
    }
}

将 CORS 中间件配置添加到 WebAPI 的 Startup.Configure

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
    {
        if (env.IsDevelopment())
        {
            app.UseDeveloperExceptionPage();
        }

        app.UseCors(policy =>
        {
            policy.WithOrigins("https://localhost:44356")
                  .AllowAnyMethod();
        });

        app.UseHttpsRedirection();

        app.UseRouting();

        app.UseAuthorization();

        app.UseEndpoints(endpoints =>
        {
            endpoints.MapControllers();
        });
    }

结果

【讨论】：