ASP.NET Core Blazor formlarının sorunlarını giderme

Bu makalede formlarla ilgili sorun giderme yönergeleri Blazor sağlanır.

Büyük form yükleri ve SignalR ileti boyutu sınırı

Bu bölüm yalnızca uygulayan SignalRs, Blazor Server uygulamalar ve barındırılan Blazor WebAssembly çözümler için Blazor Web Appgeçerlidir.

Bileşenin form yükü hub yöntemleri için izin verilen en yüksek gelen SignalR ileti boyutunu aştığı için form işleme başarısız olursa, form ileti boyutu sınırını artırmadan akış birlikte JS çalışabilir . Boyut sınırı ve atılan hata hakkında daha fazla bilgi için bkz . ASP.NET Çekirdek BlazorSignalR kılavuzu.

Aşağıdaki örnekte, 50.000 bayta kadar veriyi sunucuya taşımak için akış JS birlikte çalışmasıyla bir metin alanı (<textarea>) kullanılır.

Uygulamaya bir JavaScript (JS) getText işlevi ekleyin:

window.getText = (elem) => {
  const textValue = elem.value;
  const utf8Encoder = new TextEncoder();
  const encodedTextValue = utf8Encoder.encode(textValue);
  return encodedTextValue;
};

Bir Blazor uygulamanın nereye yerleştirileceği JS hakkında bilgi için bkz. ASP.NET Core Blazor uygulamalarında JavaScript konumu.

Güvenlikle ilgili dikkat edilmesi gerekenler nedeniyle, birlikte çalışma akışı için sıfır uzunlukta akışlara JS izin verilmez. Bu nedenle, aşağıdaki StreamFormData bileşen bir JSException yakalar ve form gönderildiğinde metin alanı boşsa boş bir dize döndürür.

StreamFormData.razor:

@page "/stream-form-data"
@inject IJSRuntime JS
@inject ILogger<StreamFormData> Logger

<h1>Stream form data with JS interop</h1>

<EditForm FormName="StreamFormData" Model="this" OnSubmit="Submit">
    <div>
        <label>
            &lt;textarea&gt; value streamed for assignment to
            <code>TextAreaValue (&lt;= 50,000 characters)</code>:
            <textarea @ref="largeTextArea" />
        </label>
    </div>
    <div>
        <button type="submit">Submit</button>
    </div>
</EditForm>

<div>
    Length: @TextAreaValue?.Length
</div>

@code {
    private ElementReference largeTextArea;

    public string? TextAreaValue { get; set; }

    protected override void OnInitialized() =>
        TextAreaValue ??= string.Empty;

    private async Task Submit()
    {
        TextAreaValue = await GetTextAsync();

        Logger.LogInformation("TextAreaValue length: {Length}",
            TextAreaValue.Length);
    }

    public async Task<string> GetTextAsync()
    {
        try
        {
            var streamRef =
                await JS.InvokeAsync<IJSStreamReference>("getText", largeTextArea);
            var stream = await streamRef.OpenReadStreamAsync(maxAllowedSize: 50_000);
            var streamReader = new StreamReader(stream);

            return await streamReader.ReadToEndAsync();
        }
        catch (JSException jsException)
        {
            if (jsException.InnerException is
                    ArgumentOutOfRangeException outOfRangeException &&
                outOfRangeException.ActualValue is not null &&
                outOfRangeException.ActualValue is long actualLength &&
                actualLength == 0)
            {
                return string.Empty;
            }

            throw;
        }
    }
}

EditForm parametresi hatası

InvalidOperationException: EditForm için Model parametresi veya EditContext parametresi gerekir, ancak ikisi birden gerekmez.

veya EditContextatadığını EditForm Model onaylayın. Her ikisini de aynı formda kullanmayın.

öğesine Modelatarken model türünün örneklendiğini onaylayın.

Bağlantı kesildi

Hata: Bağlantı 'Hata: Sunucu kapatma sırasında bir hata döndürdü: Bağlantı bir hatayla kapatıldı' hatasıyla kesildi.

System.IO.InvalidDataException: En fazla 32768B ileti boyutu aşıldı. İleti boyutu AddHubOptions'da yapılandırılabilir.

Daha fazla bilgi ve rehberlik için aşağıdaki kaynaklara bakın:

• Büyük form yükleri ve SignalR ileti boyutu sınırı
• ASP.NET Temel BlazorSignalR kılavuzu