Tutorial: Membuat dan menerapkan aplikasi dengan layanan front-end ASP.NET Core Web API dan layanan back-end yang canggih
Tutorial ini adalah bagian pertama dari sebuah seri. Anda akan mempelajari cara membuat aplikasi Azure Service Fabric dengan front-end ASP.NET Core Web API dan layanan back-end yang canggih untuk menyimpan data Anda. Setelah selesai, Anda memiliki aplikasi voting dengan front-end web ASP.NET Core yang menyimpan hasil voting dalam layanan back-end canggih di klaster. Seri tutorial ini memerlukan mesin pengembang Windows. Jika Anda tidak ingin membuat aplikasi voting secara manual, Anda dapat mengunduh kode sumber untuk aplikasi yang sudah selesai dan langsung ke Telusuri aplikasi contoh voting. Jika mau, Anda juga dapat menonton panduan video dari tutorial ini.
Di bagian pertama seri ini, Anda mempelajari cara:
- Buat layanan ASP.NET Core Web API sebagai layanan yang canggih dan andal
- Buat layanan ASP.NET Core Web Application sebagai layanan web yang canggih
- Gunakan proxy balik untuk berkomunikasi dengan layanan canggih
Dalam seri tutorial ini, Anda akan belajar cara:
Prasyarat
Sebelum Anda memulai tutorial ini:
- Jika Anda tidak memiliki langganan Azure, buatlah akun gratis
- Pasang Visual Studio 2019 versi 15.5 atau yang lebih baru dengan beban kerja pengembangan Azure dan pengembangan ASP.NET dan web.
- Pasang Service Fabric SDK
Buat layanan ASP.NET Web API sebagai layanan yang andal
Pertama, buat front-end web aplikasi voting menggunakan ASP.NET Core. ASP.NET Core adalah kerangka kerja pengembangan web lintas platform ringan yang dapat Anda gunakan untuk membuat UI web modern dan API web. Untuk mendapatkan pemahaman lengkap tentang bagaimana ASP.NET Core terintegrasi dengan Service Fabric, kami sangat menyarankan untuk membaca artikel ASP.NET Core di Service Fabric Reliable Services. Untuk saat ini, Anda dapat mengikuti tutorial ini untuk memulai dengan cepat. Untuk mempelajari selengkapnya tentang ASP.NET Core, lihat Dokumentasi ASP.NET Core.
Luncurkan Visual Studio sebagai administrator.
Buat proyek File->Baru->Proyek.
Dalam dialog Proyek Baru, pilih Cloud > Aplikasi Service Fabric.
Beri nama aplikasi Voting dan klik OK.
Pada halaman Layanan Service Fabric Baru, pilih Stateless ASP.NET Core, beri nama layanan Anda VotingWeb, lalu klik OK.
Halaman berikutnya menyediakan sekumpulan templat ASP.NET Core. Untuk tutorial ini, pilih Aplikasi Web (Model-View-Controller) , lalu klik OK.
Visual Studio membuat aplikasi dan proyek layanan lalu menampilkannya di Penjelajah Solusi.
Perbarui file site.js
Buka wwwroot/js/site.js. Ganti kontennya dengan JavaScript berikut yang digunakan oleh tampilan Home, lalu simpan perubahan Anda.
var app = angular.module('VotingApp', ['ui.bootstrap']);
app.run(function () { });
app.controller('VotingAppController', ['$rootScope', '$scope', '$http', '$timeout', function ($rootScope, $scope, $http, $timeout) {
$scope.refresh = function () {
$http.get('api/Votes?c=' + new Date().getTime())
.then(function (data, status) {
$scope.votes = data;
}, function (data, status) {
$scope.votes = undefined;
});
};
$scope.remove = function (item) {
$http.delete('api/Votes/' + item)
.then(function (data, status) {
$scope.refresh();
})
};
$scope.add = function (item) {
var fd = new FormData();
fd.append('item', item);
$http.put('api/Votes/' + item, fd, {
transformRequest: angular.identity,
headers: { 'Content-Type': undefined }
})
.then(function (data, status) {
$scope.refresh();
$scope.item = undefined;
})
};
}]);
Perbarui file Index.cshtml
Buka Views/Home/Index.cshtml, tampilan khusus untuk pengontrol Home. Ganti kontennya dengan yang berikut ini, lalu simpan perubahan Anda.
@{
ViewData["Title"] = "Service Fabric Voting Sample";
}
<div ng-controller="VotingAppController" ng-init="refresh()">
<div class="container-fluid">
<div class="row">
<div class="col-xs-8 col-xs-offset-2 text-center">
<h2>Service Fabric Voting Sample</h2>
</div>
</div>
<div class="row">
<div class="col-xs-8 col-xs-offset-2">
<form class="col-xs-12 center-block">
<div class="col-xs-6 form-group">
<input id="txtAdd" type="text" class="form-control" placeholder="Add voting option" ng-model="item"/>
</div>
<button id="btnAdd" class="btn btn-default" ng-click="add(item)">
<span class="glyphicon glyphicon-plus" aria-hidden="true"></span>
Add
</button>
</form>
</div>
</div>
<hr/>
<div class="row">
<div class="col-xs-8 col-xs-offset-2">
<div class="row">
<div class="col-xs-4">
Click to vote
</div>
</div>
<div class="row top-buffer" ng-repeat="vote in votes.data">
<div class="col-xs-8">
<button class="btn btn-success text-left btn-block" ng-click="add(vote.Key)">
<span class="pull-left">
{{vote.key}}
</span>
<span class="badge pull-right">
{{vote.value}} Votes
</span>
</button>
</div>
<div class="col-xs-4">
<button class="btn btn-danger pull-right btn-block" ng-click="remove(vote.Key)">
<span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
Remove
</button>
</div>
</div>
</div>
</div>
</div>
</div>
Perbarui file _Layout.cshtml
Buka Views/Shared/_Layout.cshtml, tata letak default untuk aplikasi ASP.NET. Ganti kontennya dengan yang berikut ini, lalu simpan perubahan Anda.
<!DOCTYPE html>
<html ng-app="VotingApp" xmlns:ng="https://angularjs.org">
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>@ViewData["Title"]</title>
<link href="~/lib/bootstrap/dist/css/bootstrap.css" rel="stylesheet"/>
<link href="~/css/site.css" rel="stylesheet"/>
</head>
<body>
<div class="container body-content">
@RenderBody()
</div>
<script src="~/lib/jquery/dist/jquery.js"></script>
<script src="~/lib/bootstrap/dist/js/bootstrap.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.2/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/2.5.0/ui-bootstrap-tpls.js"></script>
<script src="~/js/site.js"></script>
@RenderSection("Scripts", required: false)
</body>
</html>
Perbarui file VotingWeb.cs
Buka file VotingWeb.cs, yang membuat ASP.NET Core WebHost di dalam layanan stateless menggunakan server web WebListener.
Tambahkan direktif using System.Net.Http; ke bagian atas file.
Ganti fungsi CreateServiceInstanceListeners() dengan kode berikut, lalu simpan perubahan Anda.
protected override IEnumerable<ServiceInstanceListener> CreateServiceInstanceListeners()
{
return new ServiceInstanceListener[]
{
new ServiceInstanceListener(
serviceContext =>
new KestrelCommunicationListener(
serviceContext,
"ServiceEndpoint",
(url, listener) =>
{
ServiceEventSource.Current.ServiceMessage(serviceContext, $"Starting Kestrel on {url}");
return new WebHostBuilder()
.UseKestrel()
.ConfigureServices(
services => services
.AddSingleton<HttpClient>(new HttpClient())
.AddSingleton<FabricClient>(new FabricClient())
.AddSingleton<StatelessServiceContext>(serviceContext))
.UseContentRoot(Directory.GetCurrentDirectory())
.UseStartup<Startup>()
.UseServiceFabricIntegration(listener, ServiceFabricIntegrationOptions.None)
.UseUrls(url)
.Build();
}))
};
}
Tambahkan juga GetVotingDataServiceName metode berikut di bawah iniCreateServiceInstanceListeners(), lalu simpan perubahan Anda. GetVotingDataServiceName mengembalikan nama layanan saat disurvei.
internal static Uri GetVotingDataServiceName(ServiceContext context)
{
return new Uri($"{context.CodePackageActivationContext.ApplicationName}/VotingData");
}
Tambahkan file VotesController.cs
Tambahkan pengontrol, yang menentukan tindakan voting. Klik kanan pada folder Pengontrol, lalu pilih Tambah->Item baru->Visual C#->ASP.NET Core->Kelas. Beri nama file VotesController.cs, lalu klik Tambahkan.
Ganti konten file VotesController.cs dengan yang berikut ini, lalu simpan perubahan Anda. Kemudian, di Perbarui file VotesController.cs, file ini dimodifikasi untuk membaca dan menulis data voting dari layanan back-end. Untuk saat ini, pengontrol mengembalikan data string statis ke tampilan.
namespace VotingWeb.Controllers
{
using System;
using System.Collections.Generic;
using System.Fabric;
using System.Fabric.Query;
using System.Linq;
using System.Net.Http;
using System.Net.Http.Headers;
using System.Text;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;
using Newtonsoft.Json;
[Produces("application/json")]
[Route("api/Votes")]
public class VotesController : Controller
{
private readonly HttpClient httpClient;
public VotesController(HttpClient httpClient)
{
this.httpClient = httpClient;
}
// GET: api/Votes
[HttpGet]
public async Task<IActionResult> Get()
{
List<KeyValuePair<string, int>> votes= new List<KeyValuePair<string, int>>();
votes.Add(new KeyValuePair<string, int>("Pizza", 3));
votes.Add(new KeyValuePair<string, int>("Ice cream", 4));
return Json(votes);
}
}
}
Mengonfigurasi port mendengarkan
Saat layanan front-end VotingWeb dibuat, Visual Studio secara acak memilih port untuk didengarkan layanan. Layanan VotingWeb bertindak sebagai front-end untuk aplikasi ini dan menerima lalu lintas eksternal, jadi mari kita ikat layanan itu ke port tetap yang terkenal. Manifes layanan mendeklarasikan titik akhir layanan.
Di Penjelajah Solusi, buka VotingWeb/PackageRoot/ServiceManifest.xml. Temukan elemen Titik akhir di bagian Sumber Daya dan ubah nilai Port menjadi 8080. Untuk menyebarkan dan menjalankan aplikasi secara lokal, port mendengarkan aplikasi harus terbuka dan tersedia di komputer Anda.
<Resources>
<Endpoints>
<!-- This endpoint is used by the communication listener to obtain the port on which to
listen. Please note that if your service is partitioned, this port is shared with
replicas of different partitions that are placed in your code. -->
<Endpoint Protocol="http" Name="ServiceEndpoint" Type="Input" Port="8080" />
</Endpoints>
</Resources>
Perbarui juga nilai properti URL Aplikasi dalam proyek Voting sehingga browser web terbuka ke port yang benar saat Anda men-debug aplikasi Anda. Di Penjelajah Solusi, pilih proyek Voting dan perbarui properti URL Aplikasi ke 8080.
Terapkan dan jalankan aplikasi Voting secara lokal
Anda sekarang dapat melanjutkan dan menjalankan aplikasi Voting untuk di-debug. Di Visual Studio, tekan F5 untuk menerapkan aplikasi ke klaster Service Fabric lokal Anda dalam mode debug. Aplikasi akan gagal jika sebelumnya Anda tidak membuka Visual Studio sebagai admin.
Catatan
Pertama kali Anda menjalankan dan menyebarkan aplikasi secara lokal, Visual Studio membuat klaster Service Fabric lokal untuk di-debug. Pembuatan klaster mungkin memakan waktu. Status pembuatan klaster ditampilkan di jendela output Visual Studio.
Setelah aplikasi Voting disebarkan ke klaster Service Fabric lokal Anda, aplikasi web Anda akan terbuka di tab browser secara otomatis dan akan terlihat seperti ini:
Untuk berhenti men-debug aplikasi, kembali ke Visual Studio dan tekan Shift+F5.
Menambahkan layanan back-end yang dinyatakan ke aplikasi Anda
Sekarang setelah layanan ASP.NET Web API berjalan dalam aplikasi, lanjutkan dan tambahkan layanan andal yang canggih untuk menyimpan beberapa data dalam aplikasi.
Service Fabric memungkinkan Anda untuk menyimpan data secara konsisten dan andal tepat di dalam layanan Anda dengan menggunakan koleksi yang andal. Koleksi yang andal adalah sekumpulan kelas koleksi yang sangat tersedia dan dapat diandalkan yang akrab bagi siapa saja yang telah menggunakan koleksi C#.
Dalam tutorial ini, Anda membuat layanan yang menyimpan nilai penghitung dalam koleksi yang andal.
Di Penjelajah Solusi, klik kanan Layanan dalam proyek aplikasi Voting dan pilih Tambahkan -> Layanan Service Fabric Baru....
Dalam dialog Layanan Service Fabric Baru, pilih Stateful ASP.NET Core, beri nama layanan VotingData, lalu tekan OK.
Setelah proyek layanan Anda dibuat, Anda memiliki dua layanan di aplikasi Anda. Saat terus membangun aplikasi, Anda dapat menambahkan lebih banyak layanan dengan cara yang sama. Masing-masing dapat di versi independen dan ditingkatkan.
Halaman berikutnya menyediakan sekumpulan templat ASP.NET Core. Untuk tutorial ini, pilih API.
Visual Studio membuat proyek layanan VotingData dan menampilkannya di Penjelajah Solusi.
Tambahkan file VoteDataController.cs
Di proyek VotingData, klik kanan pada folder Pengontrol, lalu pilih Tambahkan->Item baru->Kelas. Beri nama file VoteDataController.cs dan klik Tambahkan. Ganti konten file dengan yang berikut ini, lalu simpan perubahan Anda.
namespace VotingData.Controllers
{
using System.Collections.Generic;
using System.Threading;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;
using Microsoft.ServiceFabric.Data;
using Microsoft.ServiceFabric.Data.Collections;
[Route("api/[controller]")]
public class VoteDataController : Controller
{
private readonly IReliableStateManager stateManager;
public VoteDataController(IReliableStateManager stateManager)
{
this.stateManager = stateManager;
}
// GET api/VoteData
[HttpGet]
public async Task<IActionResult> Get()
{
CancellationToken ct = new CancellationToken();
IReliableDictionary<string, int> votesDictionary = await this.stateManager.GetOrAddAsync<IReliableDictionary<string, int>>("counts");
using (ITransaction tx = this.stateManager.CreateTransaction())
{
Microsoft.ServiceFabric.Data.IAsyncEnumerable<KeyValuePair<string, int>> list = await votesDictionary.CreateEnumerableAsync(tx);
Microsoft.ServiceFabric.Data.IAsyncEnumerator<KeyValuePair<string, int>> enumerator = list.GetAsyncEnumerator();
List<KeyValuePair<string, int>> result = new List<KeyValuePair<string, int>>();
while (await enumerator.MoveNextAsync(ct))
{
result.Add(enumerator.Current);
}
return this.Json(result);
}
}
// PUT api/VoteData/name
[HttpPut("{name}")]
public async Task<IActionResult> Put(string name)
{
IReliableDictionary<string, int> votesDictionary = await this.stateManager.GetOrAddAsync<IReliableDictionary<string, int>>("counts");
using (ITransaction tx = this.stateManager.CreateTransaction())
{
await votesDictionary.AddOrUpdateAsync(tx, name, 1, (key, oldvalue) => oldvalue + 1);
await tx.CommitAsync();
}
return new OkResult();
}
// DELETE api/VoteData/name
[HttpDelete("{name}")]
public async Task<IActionResult> Delete(string name)
{
IReliableDictionary<string, int> votesDictionary = await this.stateManager.GetOrAddAsync<IReliableDictionary<string, int>>("counts");
using (ITransaction tx = this.stateManager.CreateTransaction())
{
if (await votesDictionary.ContainsKeyAsync(tx, name))
{
await votesDictionary.TryRemoveAsync(tx, name);
await tx.CommitAsync();
return new OkResult();
}
else
{
return new NotFoundResult();
}
}
}
}
}
Sambungkan layanan
Pada langkah berikutnya, hubungkan kedua layanan dan buat aplikasi Web front-end mendapatkan dan mengatur informasi voting dari layanan back-end.
Service Fabric memberikan fleksibilitas lengkap dalam cara Anda berkomunikasi dengan layanan yang andal. Dalam satu aplikasi, Anda mungkin memiliki layanan yang dapat diakses melalui TCP. Layanan lain yang mungkin dapat diakses melalui HTTP REST API dan layanan lain masih dapat diakses melalui soket web. Untuk latar belakang opsi yang tersedia dan pertukaran yang terlibat, lihat Berkomunikasi dengan layanan.
Tutorial ini menggunakan ASP.NET Core Web API dan proksi balik Service Fabric sehingga layanan web front-end VotingWeb dapat berkomunikasi dengan layanan VotingData back-end. Proksi terbalik dikonfigurasi secara default untuk menggunakan port 19081 dan seharusnya berfungsi untuk tutorial ini. Port proksi terbalik diatur dalam templat Azure Resource Manager yang digunakan untuk menyiapkan klaster. Untuk menemukan port mana yang digunakan, lihat di templat klaster di sumber daya Microsoft.ServiceFabric/clusters:
"nodeTypes": [
{
...
"httpGatewayEndpointPort": "[variables('nt0fabricHttpGatewayPort')]",
"isPrimary": true,
"vmInstanceCount": "[parameters('nt0InstanceCount')]",
"reverseProxyEndpointPort": "[parameters('SFReverseProxyPort')]"
}
],
Untuk menemukan port proksi terbalik yang digunakan dalam klaster pengembangan lokal, lihat elemen HttpApplicationGatewayEndpoint di manifes klaster Service Fabric lokal:
- Buka jendela browser dan navigasi ke http://localhost:19080 untuk membuka alat Service Fabric Explorer.
- Pilih Kluster -> Manifes.
- Catat port elemen HttpApplicationGatewayEndpoint. Secara default ini harus 19081. Jika bukan 19081, Anda perlu mengubah port dalam metode GetProxyAddress dari kode VotesController.cs berikut.
Perbarui file VotesController.cs
Dalam proyek VotingWeb, buka file Controllers/VotesController.cs. Ganti konten definisi kelas VotesController dengan yang berikut ini, lalu simpan perubahan Anda. Jika port proksi terbalik yang Anda temukan di langkah sebelumnya bukan 19081, ubah port yang digunakan dalam metode GetProxyAddress dari 19081 ke port yang Anda temukan.
public class VotesController : Controller
{
private readonly HttpClient httpClient;
private readonly FabricClient fabricClient;
private readonly StatelessServiceContext serviceContext;
public VotesController(HttpClient httpClient, StatelessServiceContext context, FabricClient fabricClient)
{
this.fabricClient = fabricClient;
this.httpClient = httpClient;
this.serviceContext = context;
}
// GET: api/Votes
[HttpGet("")]
public async Task<IActionResult> Get()
{
Uri serviceName = VotingWeb.GetVotingDataServiceName(this.serviceContext);
Uri proxyAddress = this.GetProxyAddress(serviceName);
ServicePartitionList partitions = await this.fabricClient.QueryManager.GetPartitionListAsync(serviceName);
List<KeyValuePair<string, int>> result = new List<KeyValuePair<string, int>>();
foreach (Partition partition in partitions)
{
string proxyUrl =
$"{proxyAddress}/api/VoteData?PartitionKey={((Int64RangePartitionInformation) partition.PartitionInformation).LowKey}&PartitionKind=Int64Range";
using (HttpResponseMessage response = await this.httpClient.GetAsync(proxyUrl))
{
if (response.StatusCode != System.Net.HttpStatusCode.OK)
{
continue;
}
result.AddRange(JsonConvert.DeserializeObject<List<KeyValuePair<string, int>>>(await response.Content.ReadAsStringAsync()));
}
}
return this.Json(result);
}
// PUT: api/Votes/name
[HttpPut("{name}")]
public async Task<IActionResult> Put(string name)
{
Uri serviceName = VotingWeb.GetVotingDataServiceName(this.serviceContext);
Uri proxyAddress = this.GetProxyAddress(serviceName);
long partitionKey = this.GetPartitionKey(name);
string proxyUrl = $"{proxyAddress}/api/VoteData/{name}?PartitionKey={partitionKey}&PartitionKind=Int64Range";
StringContent putContent = new StringContent($"{{ 'name' : '{name}' }}", Encoding.UTF8, "application/json");
putContent.Headers.ContentType = new MediaTypeHeaderValue("application/json");
using (HttpResponseMessage response = await this.httpClient.PutAsync(proxyUrl, putContent))
{
return new ContentResult()
{
StatusCode = (int) response.StatusCode,
Content = await response.Content.ReadAsStringAsync()
};
}
}
// DELETE: api/Votes/name
[HttpDelete("{name}")]
public async Task<IActionResult> Delete(string name)
{
Uri serviceName = VotingWeb.GetVotingDataServiceName(this.serviceContext);
Uri proxyAddress = this.GetProxyAddress(serviceName);
long partitionKey = this.GetPartitionKey(name);
string proxyUrl = $"{proxyAddress}/api/VoteData/{name}?PartitionKey={partitionKey}&PartitionKind=Int64Range";
using (HttpResponseMessage response = await this.httpClient.DeleteAsync(proxyUrl))
{
if (response.StatusCode != System.Net.HttpStatusCode.OK)
{
return this.StatusCode((int) response.StatusCode);
}
}
return new OkResult();
}
/// <summary>
/// Constructs a reverse proxy URL for a given service.
/// Example: http://localhost:19081/VotingApplication/VotingData/
/// </summary>
/// <param name="serviceName"></param>
/// <returns></returns>
private Uri GetProxyAddress(Uri serviceName)
{
return new Uri($"http://localhost:19081{serviceName.AbsolutePath}");
}
/// <summary>
/// Creates a partition key from the given name.
/// Uses the zero-based numeric position in the alphabet of the first letter of the name (0-25).
/// </summary>
/// <param name="name"></param>
/// <returns></returns>
private long GetPartitionKey(string name)
{
return Char.ToUpper(name.First()) - 'A';
}
}
Mempelajari aplikasi contoh voting
Aplikasi voting terdiri atas dua layanan:
- Layanan front-end web (VotingWeb)- Layanan front-end web ASP.NET Core, yang melayani halaman web dan memaparkan API web untuk berkomunikasi dengan layanan backend.
- Layanan back-end (VotingData)- Layanan web ASP.NET Core, yang memaparkan API untuk menyimpan hasil voting dalam kamus andal yang ada di disk.
Saat Anda melakukan voting dalam aplikasi, kejadian berikut terjadi:
JavaScript mengirimkan permintaan suara ke API web di layanan ujung depan web sebagai permintaan HTTP PUT.
Layanan front-end web menggunakan proksi untuk mencari dan meneruskan permintaan HTTP PUT ke layanan back-end.
Layanan back-end mengambil permintaan yang masuk, dan menyimpan hasil yang diperbarui dalam kamus andal, yang akan direplikasi ke beberapa node dalam klaster dan disimpan di disk. Semua data aplikasi disimpan dalam kluster sehingga tidak diperlukan database.
Debug di Visual Studio
Saat men-debug aplikasi di Visual Studio, Anda menggunakan klaster pengembangan Service Fabric lokal. Anda memiliki opsi untuk menyesuaikan pengalaman men-debug Anda dengan skenario Anda. Dalam aplikasi ini, simpan data dalam layanan back-end menggunakan kamus yang diandalkan. Visual Studio menghapus aplikasi secara default saat Anda menghentikan debugger. Menghapus aplikasi menyebabkan data di layanan ujung belakang juga dihapus. Untuk mempertahankan data di antara sesi debug, Anda dapat mengubah Mode Debug Aplikasi sebagai properti pada proyek Voting di Visual Studio.
Untuk melihat apa yang terjadi dalam kode, selesaikan langkah-langkah berikut:
Buka file VotingWeb\VotesController.cs dan tetapkan titik henti dalam metode Put API web (baris 72).
Buka file VotingData\VotesController.cs dan tetapkan titik henti dalam metode Put API web (baris 54).
Tekan F5 untuk memulai aplikasi dalam mode debug.
Kembali ke browser, lalu klik opsi pemungutan suara atau tambahkan opsi pemungutan suara baru. Anda mencapai titik henti pertama di pengontrol api front-end web.
Di sinilah, JavaScript di browser mengirim permintaan ke pengontrol API web di layanan front-end.
Pertama, buat URL ke ReverseProxy untuk layanan back-end (1) .
Kemudian, kirim Permintaan HTTP PUT ke ReverseProxy (2) .
Terakhir, kembalikan respons dari layanan back-end ke klien (3) .
Tekan F5 untuk melanjutkan.
Anda sekarang berada di titik henti di layanan back-end.
Di baris pertama dalam metode (1) gunakan
StateManageruntuk mendapatkan atau menambahkan kamus andal yang disebutcounts.Semua interaksi dengan nilai dalam kamus andal memerlukan transaksi; ini menggunakan pernyataan (2) membuat transaksi tersebut.
Dalam transaksi, perbarui nilai kunci yang relevan untuk opsi voting dan terapkan operasi (3) . Setelah metode penerapan kembali, data diperbarui dalam kamus dan direplikasi ke simpul lain di kluster. Kini, data tersimpan dengan aman di kluster, dan layanan ujung belakang dapat mengalihkan ke simpul lain, dengan masih memiliki data yang tersedia.
Tekan F5 untuk melanjutkan.
Untuk menghentikan sesi penelusuran kesalahan, tekan Shift+F5.
Langkah berikutnya
Dalam bagian tutorial ini, Anda mempelajari cara:
- Buat layanan ASP.NET Core Web API sebagai layanan yang canggih dan andal
- Buat layanan ASP.NET Core Web Application sebagai layanan web yang canggih
- Gunakan proxy balik untuk berkomunikasi dengan layanan canggih
Lanjutkan ke tutorial berikutnya: