Bagaimana saya bisa mengubah teks "Tidak bisa terhubung kembali ke server" di Blazor?

Saya menggunakan sisi server Blazor.

Ketika Aplikasi Blazor terputus ke server jauh, itu akan menunjukkan ini:

Saya ingin mengubah teks ('Tidak dapat menyambung kembali ke server ...' dan seterusnya) dari gambar di atas.

Saya ingin mengubahnya ke bahasa negara kita.

Saya menemukan file proyek tetapi tidak menemukan apa pun tentang ini.

Bagaimana saya bisa mengubahnya? Terima kasih.

Aplikasi Blazor akan memeriksa apakah ada elemen html dengan id ={dialogId} di halaman:

1. Jika elemen seperti itu tidak ada, itu akan menggunakan penangan default untuk menampilkan pesan.
2. Jika elemen ini ada, elemen ini classadalah:
   • atur seperti components-reconnect-showketika mencoba menyambung kembali ke server,
   • atur components-reconnect-failedketika gagal terhubung ke server.
   • atur seolah- components-reconnect-refusedolah browser mencapai server sementara server menolak koneksi secara aktif

Secara default, dialogIdis components-reconnect-modal. Jadi, Anda dapat membuat elemen di halaman dan menggunakan CSS untuk mengontrol konten dan gaya yang Anda inginkan.

Demo:

Misalnya, saya membuat tiga bagian konten untuk ditampilkan dalam Pages/_Host.cshtml:

<div id="components-reconnect-modal" class="my-reconnect-modal components-reconnect-hide">
    <div class="show">
        <p>
            This is the message when attempting to connect to server
        </p>
    </div>
    <div class="failed">
        <p>
            This is the custom message when failing 
        </p>
    </div>
    <div class="refused">
        <p>
            This is the custom message when refused
        </p>
    </div>
</div>

<app>
    @(await Html.RenderComponentAsync<App>(RenderMode.ServerPrerendered))
</app>

<script src="_framework/blazor.server.js"></script>

Dan kemudian mari kita tambahkan beberapa CSS untuk mengontrol gaya:

<style>
    .my-reconnect-modal > div{
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1000;
        overflow: hidden;
        background-color: #fff;
        opacity: 0.8;
        text-align: center;
        font-weight: bold;
    }
    .components-reconnect-hide > div
    {
        display: none;
    }

    .components-reconnect-show > div
    {
        display: none;
    }
    .components-reconnect-show > .show
    {
        display: block;
    }

    .components-reconnect-failed > div
    {
        display: none;
    }
    .components-reconnect-failed > .failed
    {
        display: block;
    }

    .components-reconnect-refused >div
    {
        display: none;
    }
    .components-reconnect-refused > .refused
    {
        display: block;
    }
</style>

Akhirnya, kami akan menerima pesan berikut ketika mencoba menghubungkan atau gagal menghubungkan:

Untuk sisi javascript hal Blazor memperlihatkan API kecil melalui window.Blazorobjek.

Salah satu bagian dari API ini adalah defaultReconnectionHandleryang memungkinkan Anda untuk menyesuaikan pengalaman koneksi ulang termasuk pengaturan opsi yang berbeda untuk jumlah retrys dll.

Namun, juga memungkinkan untuk hanya menukar logika untuk menampilkan ReconnectionDisplay

Penerapan sederhana terlihat seperti ini dan memungkinkan Anda untuk mendapatkan kontrol atas proses:

function createOwnDisplay() {
    return {
        show: () => { alert("put code that shows a toast , ui, or whaterver here"); },
        hide: () => { console.log('foo'); },
        failed: () => { console.log('foo'); },
        rejected: () => { console.log('foo'); }
    };
}

Blazor.defaultReconnectionHandler._reconnectionDisplay = createOwnDisplay();