Blazor ir ietvars interaktīvu klientu tīmekļa lietotāja interfeisu veidošanai, izmantojot .NET:
- Izmantojiet C#, nevis JavaScript, lai izveidotu bagātīgu, interaktīvu lietotāja interfeisu.
- Koplietojiet servera puses un klienta puses programmu loģiku, kas rakstīta .NET.
- Renderējiet lietotāja interfeisu kā HTML un CSS, lai atbalstītu daudzas pārlūkprogrammas, tostarp mobilās pārlūkprogrammas.
Blazor ir tīmekļa sistēma, kas paredzēta, lai palaistu klienta pusē pārlūkprogrammā uz WebAssembly balstīta .NET izpildlaika (Blazor WebAssembly) vai servera puses ASP.NET Core (Blazor serveris). Jebkuram pārvaldītajam modelim programmas un komponentu modeļi ir vienādi.
Blazor serveri
Izmantojiet Blazor servera mitināšanas modeli, lai izpildītu lietotnes serverī no ASP.NET Core lietotnēm.Lietotāja interfeisa atjauninājumi, notikumu apstrāde un JavaScript izsaukumi tiek veikti, izmantojotSignāls RSavienojumi ar procesu。
Blazor servera hostinga modelis piedāvā šādas priekšrocības:
- Lejupielādes lielums ir ievērojami mazāks nekā Blazor WebAssembly lietotnei, un lietotne ielādējas daudz ātrāk.
- Programmas var pilnībā izmantot servera iespējas, tostarp izmantot jebkuru ar .NET Core saderīgu API.
- .NET Core serverī tiek izmantots, lai palaistu programmu, tāpēc esošie .NET rīki, piemēram, atkļūdošana, darbojas, kā paredzēts.
- Tiek atbalstīti plānie klienti. Piemēram, Blazor servera lietotne ir piemērota pārlūkprogrammām, kas neatbalsta WebAssembly, un ierīcēm ar ierobežotiem resursiem.
- Lietotnes .NET/C# kodu bāze, kas ietver programmas komponenta kodu, nedarbojas klientā.
Blazor servera hostingam ir šādi trūkumi:
Latentums parasti ir lielāks. Katra lietotāja mijiedarbība ietver tīkla lēcienu.
Darbs bezsaistē netiek atbalstīts. Ja klienta savienojums neizdodas, programma pārstāj darboties.
Ja jums ir vairāki lietotāji, pastāv problēmas ar lietotnes mērogojamību. Serverim ir jāpārvalda vairāki klienta savienojumi un jāapstrādā klienta stāvoklis.
ASP.NET Core serveri ir nepieciešami, lai apkalpotu lietojumprogrammu. Bezservera izvietošanas scenāriji nav iespējami (piemēram, lietojumprogrammu apkalpošana, izmantojot CDN).
Apmācības sākums:
1. Vispirms izveidojiet jaunu Blazor App projektu, izmantojot vs2019, kā parādīts tālāk:
2. Izveidojiet jaunu Razor komponentu ar šādu kodu:
Mums ir nepieciešama SkiaSharp pakotne, lai ģenerētu base64 captcha un instalētu to, izmantojot nuget:
3. Sāciet projektu, apmeklējiet:Hipersaites pieteikšanās ir redzama.
Ģenerētais html kods izskatās šādi:
<!DOCTYPE html>
<html lang="lv">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>BlazorApp1</title>
<bāze href="/" />
<link rel="stylesheet" href="css/bootstrap/bootstrap.min.css" />
<link href="css/site.css" rel="stila lapa" />
</head>
<body>
<app>
<!--Blazor:{"sequence":0,"type":"server","prerenderId":"19210eabb9054fe79ea7cc3e6f501df5","descriptor": "CfDJ8G8mpuBWCflCst2FMatPfBxQE\u002Br1dzwAAKPTr0QFhEikdvN38F\u002BP7DcVOKo\u002BPF9p1ZAgdir\u002BYdhFqRpzbwsqEap4xG3gpcMVtLX2yGCGhOnh596O6KcFICrjAZGk82Q2lVu\ u002B94jRo6qJ9JgxrjzuAOxLvrXBlFoGwTssxsHOI2qoQHGwlv\u002BA\u002BGsyaTjfxZ8DAgqAuiwaHynCg0J18d/VUh8brr9FrMe91kKCVw0OLUVRjCXK0FXGvXPYKjEIuE9FY5w3EvO17tJJ/ 9LpOKmqEeYpk6FlOPeuviBB1LhHBrzycchpZAb8eNGY51tN5Gjcqf/uNOMHZYLXoxjj6bmug/62JJvaQ62OrFNqIJw6S730"}-->
<div class="sidebar">
<div class="augšējā rinda pl-4 navbar navbar-dark">
<a class="navbar-brand" href>BlazorApp1</a>
<button class="navbar-toggler">
<span class="navbar-toggler-icon"></span>
</button>
</div>
<div class="collapse">
<ul class="nav flex-column">
<li class="nav-item px-3">
<a href="" class="nav-link">
<span class="oi oi-home" aria-hidden="true"></span> Home
</a>
</li>
<li class="nav-item px-3">
<a href="counter" class="nav-link">
<span class="oi oi-plus" aria-hidden="true"></span> skaitītājs
</a>
</li>
<li class="nav-item px-3">
<a href="fetchdata" class="nav-link">
<span class="oi oi-list-rich" aria-hidden="true"></span> Iegūt datus
</a>
</li>
</ul>
</div>
</div>
<div class="main">
<div class="augšējā rinda px-4">
<a href="https://docs.microsoft.com/aspnet/" target="_blank">Par</a>
</div>
<div class="saturs px-4">
<h3>Pārbaude</h3>
<p>
(Blazors) Piemērs, kā parādīt verifikācijas kodu un pārbaudīt to.
</p>
<img style="border:solid 1px #ccc" src="data:image/jpeg;base64,...." />
<button>Atjaunot</button>
<hr>
<div>Ierakstiet skaitli attēlā</div>
<form>
<input type="text" style="padding:5px" />
<button>Pārbaudiet</button>
</form>
<hr>
<button>Testa klikšķis</button>
</div>
</div>
<!--Blazor:{"prerenderId":"19210eabb9054fe79ea7cc3e6f501df5"}-->
</app>
<div id="blazor-error-ui">
Ir noticis neapstrādāts izņēmums. Detalizētu informāciju skatiet pārlūkprogrammas izstrādātāju rīkos.
<a href="" class="pārlādēt">pārlādēt</a>
</div>
<script src="_framework/blazor.server.js"></script>
</body>
</html>
Mēģiniet noklikšķināt uz pogas, pogas notikuma izraisītājs tiek paziņots, izmantojot SignalR, kas balstās uz tīmekļa ligzdu, aptauju utt., Kā parādīts zemāk redzamajā attēlā:
Atsauces saites:
Hipersaites pieteikšanās ir redzama.
|
Publicēts 07.04.2020 11:15:36
|
|
|
|
Saimnieks|
Publicēts 07.04.2020 11:45:47
|
Publicēts 15.11.2022 10:51:42
|
