Blazor를 사용하여 소프트웨어 조사 구축 - 섹션 1 - 상태

나는 Blazor로 작은 조사 사이트를 쓰기로 결정했다.일부 원인은 Blazor를 배우기 위해서다.
Blazor에 대한 나의 이해에 따라 나는 블로그에 일련의 글을 발표할 것이다.
이 일련의 글은 Blazor에 대한 교육 과정이 아니라 제가 이 제품을 사용할 때의 사고 과정을 배우고 있습니다.

동기

이것은 이 시리즈의 첫 번째 부분이기 때문에, 나는 왜 시작했는지 생각한다.
왜 조사 사이트를 만들었는지, 왜 Blazor를 만들었는지.
나는 관리자가 맞춤형 소프트웨어 개발 (내부 개발이든 하청이든) 에 대한 태도를 조사하고 싶다.대다수 기업들이 현재 소프트웨어 개발이 실현하는 가치와 이를 어떻게 가장 잘 실현하는지 알고 있다고 믿고 싶다.현실은 크게 다르다.
많은 기업들이 여전히 소프트웨어 개발을 일종의'앉아서 성과를 누리는'역할로 여기는 것 같다.그들은 개발자와 모든 직원을 Theory X 사유로 대한다.
그래서 나는 이것이 정확한지 확인하기 위해 조사를 하고 싶다.
최초의 생각은 Survey Monkey 같은 서비스를 이용해서 이 점을 실현하는 것이었지만, 일회성 조사에 있어서 대부분의 서비스가 상당히 비싼 것 같다는 것을 알게 되었다.
이와 동시에 나는 브라조를 조사하기 시작했다.이것은 내가 최초의 시범부터 알고 있는 기술이지만, 나는 최근에야 비로소 그것을 연구하는 데 시간을 쓰기로 결정했다.
그래서 왜 이 두 가지 활동을 결합시키지 않고 조사를 Blazor 응용 프로그램 구축의 핑계로 삼지 않는가.
이것이 가장 좋은 투자 수익률입니까?
이 가능하다, ~할 수 있다,...
"요금 계산"시간은 Survey Monkey와 같은 서비스의 비용보다 훨씬 큽니다.그러나 그것은 나에게 새로운 기술을 배울 핑계를 제공했다. 내가 시간을 낭비하고 있다는 것을 감안하면 이 기술은 넷플릭스에서 다른 드라마를 보는 것보다 더 좋은 것 같다.

Blazor 준비됐어요?

내가 Blazor를 연구하기 시작했을 때, 이것은 절대로 나의 첫 번째 문제였다.
이 글을 쓸 때 나는 아마 아니라고 말할 것이다.
초기 버전인 것 같아요.
네가 바라는 개발 체험이 아직 나타나지 않았다.
Visual Studio에서 오류가 보고되지만 응용 프로그램이 제대로 생성되고 실행됩니다.
아무런 열도 다시 불러오지 않은 것 같다.
기능이 완비된 프레임워크로서, 이 프레임워크도 뚜렷한 기능이 부족한 것 같다. 그것은 해가 되어서야 검색엔진의 최적화를 지원하는 것 같다.예를 들어 Net 5입니다.
그러나 어떤 응용에 있어서, 그것은 충분합니까?
나는 신중하게 승낙할 것이다.
내가 조사 현장에서 일할 때, 나는 더욱 좋은 생각을 가질 것이다.나는 당연히 그것을 나의 메인 사이트에 사용하지 않을 것이다. (검색엔진 최적화가 부족함) 그러나 아마도 간단한 응용 프로그램에 사용할 것이다.
시간은 모든 것을 증명할 것이다.

Blazor 서버

네, 한 걸음 물러서세요...Blazor란 무엇입니까?

Blazor is a framework for building interactive client-side web UI with .NET:

• Create rich interactive UIs using C# instead of JavaScript
• Share server-side and client-side app logic written in .NET.
• Render the UI as HTML and CSS for wide browser support, including mobile browsers.
• Integrate with modern hosting platforms, such as Docker.
• Using .NET for client-side web development offers the following advantages:

Write code in C# instead of JavaScript.

• Leverage the existing .NET ecosystem of .NET libraries.
• Share app logic across server and client.
• Benefit from .NET's performance, reliability, and security
• Stay productive with Visual Studio on Windows, Linux, and macOS.
• Build on a common set of languages, frameworks, and tools that are stable, feature-rich, and easy to use.

요컨대 JavaScript 대신 C를 사용하여 웹 페이지를 구축합니다.
Blazor에는 두 가지 버전이 있습니다. - Web Assembly 및 Server.
웹 어셈블리에서 다운로드할 특수 버전입니다.NET가 실행될 때 로컬 컴퓨터에서처럼 브라우저에서 DLL을 실행할 수 있습니다.이 모든 것은 웹 어셈블리에서 제공되고 상당한 기능 수준을 제공하지만 그 대가는 대량으로 다운로드되는 것이다.
서버는 SignalR의 브라우저와 상호작용을 합니다. (웹 플러그인을 기반으로 한 Microsoft 추상적)서버에서 작업이 수행되고 DOM 변경 사항이 브라우저로 전송됩니다.이것은 상당히 작은 다운로드 크기를 제공하지만, 논리는 브라우저가 아닌 서버에서 실행되기 때문에 성능이 약간 떨어진다.
저에게 Blazor 서버 버전은 이 프로젝트에 적합한 방법인 것 같습니다.
기반Microsoft Page;대부분의 브라우저에서 Blazor 서버를 지원합니다.
Microsoft Page

상태

조사는 4-5페이지 문제의 간단한 구조를 따라 영구 저장에 저장될 것이다.
응답자가 조사 기간에 한 대답을 검증하거나 견지할 필요가 없다.
그러나 나는 확실히 추적 조사에서 지금까지의 답이 필요하다.
ASP에서Net MVC에서 Blazor 서버까지는 약간의 다른 생각이 필요합니다.주 정부가 그 중의 하나다.
ASP로 제공됩니다.Net MVC는 세션 상태를 사용할 수 있습니다. Blazor 서버는 브라우저의 저장, 서버의 지속적인 저장 (데이터베이스,blob 저장 등) 또는 역할 영역 서비스를 사용할 수 있습니다.
범위 서비스는 나의 선택이다.
역할 영역 서비스가 사용 중입니다.NET 핵심 의존 항목 주입, 사용자 연결에 동일한 클래스 실례 제공.
Blazor 서버의 경우 사용자 연결을 회로라고 하는데 기본적으로 신호 연결이다.만약 그것이 파괴된다면, 새로운 회로를 만들 것입니다. (이 경우, 클래스를 잃어버릴 것입니다.)
설명:

Blazor Server hosting model supports the Scoped lifetime. In Blazor Server apps, a scoped service registration is scoped to the connection. For this reason, using scoped services is preferred for services that should be scoped to the current user

icrosoft 페이지 내 주 서비스

이 점을 고려하여 저는 간단한 서비스를 만들었습니다.

using SoftwareSurvey.Models;
using System.Collections.Generic;
using System.Linq;

namespace SoftwareSurvey.Services
{
    public class StateService : IStateService
    {
        private readonly List<IStateObject> _stateObjects = new List<IStateObject>();

        public T GetOrNew<T>() where T : IStateObject, new()
        {
            var state = Get<T>();

            return state ?? new T();
        }

        public void Save<T>(T state) where T : IStateObject
        {
            var existingState = Get<T>();

            if (existingState != null)
            {
                _stateObjects.Remove(existingState);
            }

            _stateObjects.Add(state);
        }

        private T Get<T>() where T : IStateObject
        {
            return _stateObjects.OfType<T>().FirstOrDefault();
        }
    }
}

이것은 등록 대상의 간단한 목록입니다.조사의 모든 페이지는 IStateObject를 실현하는 state 대상이 있습니다.예:

using System.ComponentModel;
using System.ComponentModel.DataAnnotations;

namespace SoftwareSurvey.Models
{
    public class Demographic: IStateObject
    {
        [Required(ErrorMessage = "Please provide company size")]
        [DisplayName("Company Size")]
        public string CompanySize { get; set; }

        [Required(ErrorMessage = "Please provide your job seniority")]
        [DisplayName("Job Seniority")]
        public string JobSeniority { get; set; }

        [DisplayName("Job Title (optional)")]
        public string JobTitle { get; set; }
    }
}

주입 설정 의존

DI 설정은 모든 설정과 기본적으로 같습니다.NET 핵심 어플리케이션역할 클래스를 시작에 추가합니다.반테러 정예:

public void ConfigureServices(IServiceCollection services)
{
  ...

  services.AddScoped<IStateService, StateService>();
}

활용단어참조

그런 다음 관련 Blazor 구성 요소에서 StateService를 주입하고 상태 객체를 가져오고 저장합니다.

@code {
    protected Models.Demographic Model;

    [Inject]
    protected SoftwareSurvey.Services.IStateService _stateService { get; set; }

    [Inject]
    protected NavigationManager NavigationManager { get; set; }

    protected override void OnInitialized()
    {
        base.OnInitialized();
        Model = _stateService.GetOrNew<Models.Demographic>();
    }

    protected void HandleValidSubmit()
    {
        _stateService.Save(Model);
        NavigationManager.NavigateTo("/ThankYou");
    }
}

최종 결과

이것은 나로 하여금 사용자와 조사가 상호작용하는 생명 주기 내에 페이지 상태 대상을 서비스 (단순 클래스) 에 저장할 수 있게 한다.
일부 응용 프로그램의 경우 다음과 같은 단점이 있습니다.

서버의 메모리에 있는 상태 - 빠른 조사에 좋음

접속 유실, 서버 다운타임 또는 브라우저 오류가 발생하면 "지금까지"상태가 손실됩니다.마찬가지로, 나는 이 용례를 받아들일 수 있다고 생각한다.

서버는 사이트의 모든 활성 사용자에게 비용을 제공합니다.이 용례에 대해 말하자면, 이것은 문제가 될 수 없다. 왜냐하면 나는 대량의 응답자를 동시에 얻을 수 없기 때문이다.

마지막 부분에서 사용 을 하면 이 문제를 해결할 수 있다.이것은 아마도 내가 프로젝트 후반에 본 것일 것이다. 만약 다른 것이 없다면, 그것은 바로 이 서비스를 시도하는 것이다.
Azure SignalR Service에서 프로젝트 단계의 전체 코드를 볼 수 있습니다