Blazor Server是一种用于构建交互式Web应用程序的.NET框架，而Web Api是一种面向Web的API技术。将它们结合起来，可以创建一个Blazor Server应用程序，该应用程序与Web Api进行通信，获取和更新数据。

首先，我们需要在Blazor Server应用程序中创建一个Web Api服务。这可以通过在项目中添加一个控制器来实现。以下是一个简单的Web Api控制器示例：

using System.Collections.Generic;
using Microsoft.AspNetCore.Mvc;

namespace MyProject.Controllers
{
    [ApiController]
    [Route("[controller]")]
    public class MyApiController : ControllerBase
    {
        private static readonly List _values = new List
        {
            "value1", "value2", "value3"
        };

        [HttpGet]
        public IEnumerable Get()
        {
            return _values;
        }

        [HttpPost]
        public void Post([FromBody] string value)
        {
            _values.Add(value);
        }
    }
}

此控制器定义了两个API端点：Get和Post。Get方法返回一个字符串列表，Post方法获取一个字符串参数并将其添加到列表中。

现在我们需要在Blazor Server应用程序中使用这个Web Api服务。可以使用HttpClient实现。以下是一个简单的Blazor组件，它从Web Api获取数据并在页面中显示它：

@page "/my-page"

@inject HttpClient HttpClient

My Page


    @foreach (var value in values)
    {
        
@value
    }


Add Value

@code {
    private List values;

    protected override async Task OnInitializedAsync()
    {
        values = await HttpClient.GetFromJsonAsync>("/MyApi");
    }

    private async void AddValue()
    {
        var value = "new value";
        await HttpClient.PostAsJsonAsync("/MyApi", value);
        values.Add(value);
    }
}

在这个组件中，我们首先注入了HttpClient服务。在OnInitializedAsync方法中，我们使用HttpClient从Web Api获取数据。在AddValue方法中，我们使用HttpClient将新值添加到Web Api服务中。

通过上述步骤，我们成功构建了使用Blazor Server和Web Api的应用程序。