首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >如何使Blazor HTTP获得JSON请求?

如何使Blazor HTTP获得JSON请求?
EN

Stack Overflow用户
提问于 2019-10-13 11:16:48
回答 5查看 16.2K关注 0票数 6

我试图在示例应用程序中实现一个小crud。

我在应用程序中使用blazor,但是在服务器调用方面发现了一些问题。

我创建了一个带有Employee名称的简单API控制器,并创建了带有HTTP谓词的方法。

代码语言:javascript
运行
复制
 [ApiController]
    [Route("[controller]")]
    public class EmployeeController : ControllerBase
    {
        EmployeeRepository objemployee = new EmployeeRepository();   
        [HttpGet]
        [Route("api/Employee/Index")]
        public IEnumerable<Employee> Index()
        {
            return objemployee.GetAllEmployees();
        }
   }  

这个

代码语言:javascript
运行
复制
empList = await Http.GetJsonAsync<Employee[]>("/api/Employee/Index"); 

连队报告了一个问题,我对此一无所知,因为我是个新手。在我的代码中我应该做什么?

用asp构建的应用程序。Net核心3.0","blazor预览9“。

输出:我试图遵循指南并查找示例实现,但无法解决问题。

我得到了以下例外:

代码语言:javascript
运行
复制
  WASM: Unhandled exception rendering component:
d.printErr @ blazor.webassembly.js:1
blazor.webassembly.js:1 WASM: 
    System.Text.Json.JsonException: 
    '<' is an invalid start of a value. Path: $ | LineNumber: 0 | BytePositionInLine: 0. ---> 
    System.Text.Json.JsonReaderException: '<' is an invalid start of a value. LineNumber: 0 | BytePositionInLine: 0.
d.printErr @ blazor.webassembly.js:1
    blazor.webassembly.js:1 WASM:   at.    System.Text.Json.ThrowHelper.ThrowJsonReaderException (System.Text.Json.Utf8JsonReader& json, System.Text.Json.ExceptionResource resource, System.Byte nextByte, System.ReadOnlySpan`1[T] bytes) <0x2398fc8 + 0x00020> in <81e9245ca982431695a55cc67ffb3b86>:0 
d.printErr @ blazor.webassembly.js:1
blazor.webassembly.js:1 WASM:   at System.Text.Json.Utf8JsonReader.ConsumeValue (System.Byte marker) <0x1fa7718 + 0x0028e> in <81e9245ca982431695a55cc67ffb3b86>:0 
d.printErr @ blazor.webassembly.js:1
blazor.webassembly.js:1 WASM:   at System.Text.Json.Utf8JsonReader.ReadFirstToken (System.Byte first) <0x1fa6d60 + 0x001ec> in <81e9245ca982431695a55cc67ffb3b86>:0 
d.printErr @ blazor.webassembly.js:1
blazor.webassembly.js:1 WASM:   at System.Text.Json.Utf8JsonReader.ReadSingleSegment () <0x1fa6618 + 0x00234> in <81e9245ca982431695a55cc67ffb3b86>:0 
d.printErr @ blazor.webassembly.js:1
blazor.webassembly.js:1 WASM:   at System.Text.Json.Utf8JsonReader.Read () <0x1fa61d0 + 0x00012> in <81e9245ca982431695a55cc67ffb3b86>:0 
d.printErr @ blazor.webassembly.js:1
blazor.webassembly.js:1 WASM:   at System.Text.Json.JsonSerializer.ReadCore (System.Text.Json.JsonSerializerOptions options, System.Text.Json.Utf8JsonReader& reader, System.Text.Json.ReadStack& readStack) <0x1fa5b40 + 0x00062> in <81e9245ca982431695a55cc67ffb3b86>:0 
d.printErr @ blazor.webassembly.js:1
blazor.webassembly.js:1 WASM:    --- End of inner exception stack trace ---
d.printErr @ blazor.webassembly.js:1
blazor.webassembly.js:1 WASM:   at System.Text.Json.ThrowHelper.ReThrowWithPath (System.Text.Json.ReadStack& readStack, System.Text.Json.JsonReaderException ex) <0x23e6bc8 + 0x00116> in <81e9245ca982431695a55cc67ffb3b86>:0 
d.printErr @ blazor.webassembly.js:1
blazor.webassembly.js:1 WASM:   at System.Text.Json.JsonSerializer.ReadCore (System.Text.Json.JsonSerializerOptions options, System.Text.Json.Utf8JsonReader& reader, System.Text.Json.ReadStack& readStack) <0x1fa5b40 + 0x002a8> in <81e9245ca982431695a55cc67ffb3b86>:0 
d.printErr @ blazor.webassembly.js:1
blazor.webassembly.js:1 WASM:   at System.Text.Json.JsonSerializer.ReadCore (System.Type returnType, System.Text.Json.JsonSerializerOptions options, System.Text.Json.Utf8JsonReader& reader) <0x1fa4e70 + 0x0003e> in <81e9245ca982431695a55cc67ffb3b86>:0 
d.printErr @ blazor.webassembly.js:1
blazor.webassembly.js:1 WASM:   at System.Text.Json.JsonSerializer.ParseCore (System.String json, System.Type returnType, System.Text.Json.JsonSerializerOptions options) <0x1fa1698 + 0x00086> in <81e9245ca982431695a55cc67ffb3b86>:0 
d.printErr @ blazor.webassembly.js:1
blazor.webassembly.js:1 WASM:   at System.Text.Json.JsonSerializer.Deserialize[TValue] (System.String json, System.Text.Json.JsonSerializerOptions options) <0x2398808 + 0x00022> in <81e9245ca982431695a55cc67ffb3b86>:0 
d.printErr @ blazor.webassembly.js:1
blazor.webassembly.js:1 WASM:   at Microsoft.AspNetCore.Components.HttpClientJsonExtensions.GetJsonAsync[T] (System.Net.Http.HttpClient httpClient, System.String requestUri) <0x2270e18 + 0x000fa> in <900d091618e14952821fd2fc9b26598c>:0 
d.printErr @ blazor.webassembly.js:1
blazor.webassembly.js:1 WASM:   at EMS.Client.Pages.FetchEmployee.OnInitializedAsync () [0x0002a] in C:\ES\Client\Pages\FetchEmployee.razor:51 
d.printErr @ blazor.webassembly.js:1
blazor.webassembly.js:1 WASM:   at Microsoft.AspNetCore.Components.ComponentBase.RunInitAndSetParametersAsync () <0x1f4ed10 + 0x00176> in <cc81133ac6304aada69282c517e2b811>:0 
d.printErr @ blazor.webassembly.js:1
blazor.webassembly.js:1 WASM:   at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask (System.Threading.Tasks.Task taskToHandle) <0x224b4e8 + 0x000f4> in <cc81133ac6304aada69282c517e2b811>:0 
 `
EN

回答 5

Stack Overflow用户

回答已采纳

发布于 2019-10-13 16:18:53

我不认为这是Blazor问题,我想您使用的是Blazor WebAssembly托管模板吧?

如果您尝试通过在浏览器中导航到API端点来加载它,您会看到什么?我猜是404没有找到还是500个错误?

我认为问题在于如何在API控制器上定义路由。尝试以下设置。

代码语言:javascript
运行
复制
[ApiController]
[Route("[controller]")]
public class EmployeeController : ControllerBase
{
    EmployeeRepository objemployee = new EmployeeRepository();  

    [HttpGet]
    public IEnumerable<Employee> Index()
    {
        return objemployee.GetAllEmployees().ToArray();
    }

}

然后打个电话给employees = await Http.GetJsonAsync<Employee[]>("Employee");,如果一切顺利的话,你应该把你的员工名单拿回来。

票数 6
EN

Stack Overflow用户

发布于 2019-10-13 12:39:34

我想问题与Web有关,它返回Html而不是JSON。GetJsonAsync方法运行良好,JSON解析器也运行良好。也许员工模式有问题..。

试着使用这个:

代码语言:javascript
运行
复制
[ApiController]
public class EmployeeController: ControllerBase
{
   EmployeeRepository objemployee = new EmployeeRepository();   
        [HttpGet("/")]
        public IEnumerable<Employee> Index()
        {
            return objemployee.GetAllEmployees();
        }

}

像这样给网络Api打电话:

代码语言:javascript
运行
复制
empList = await Http.GetJsonAsync<Employee[]>("api/Employee"); 

注意删除url中的前导"/“。这可能是问题的根源。

在代码中使用异步编程可能是个好主意--注入总是比在应用程序中创建对象好,比如EmployeeRepository

票数 4
EN

Stack Overflow用户

发布于 2019-10-13 12:40:13

看起来您请求的是错误的API点。只需检查您的终点是返回json,而不是html:打开导航器并转到http://localhost:5000/api/Employee/Index

看看你的代码,我建议你改变:

代码语言:javascript
运行
复制
Route("[controller]"...

出自:

代码语言:javascript
运行
复制
Route("/api/[controller]"...
票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/58363023

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档