r/Blazor 18h ago

What is the equivalent of ViewChild in Angular?

1 Upvotes

I want to access to a child component of my parent component...

Thank you for the help :)


r/Blazor 1d ago

EF Class Models in Shared?

2 Upvotes

Doing a full stack solution in blazor with sql and ef. Do we put the model classes in the Shared project? Will that break the repository pattern?

Sorry if noobish question.


r/Blazor 1d ago

Alternative to httpClient.GetFromJsonAsync() that provides response details?(Blazor Wasm)

0 Upvotes

I am learning Blazor Wasm.

I make a api call to an api that doesn't exist, something like var resultObj = await httpClient.GetFromJsonAsync<MyObj>(url)

I already know that the server api endpoint was not yet defined, but I am concerned by the lack of debuggability. What I get as a result is a thrown JsonException with message ''<' is an invalid start of a value. Path: $ | LineNumber: 0 | BytePositionInLine: 0.'

I don't see how to view the actual response recieved by the server, or the status code.

How can I obtain this information?


r/Blazor 2d ago

Possible: Change background color for a specific cell on mouse hover in a RadzenDataGrid?

3 Upvotes

I am pretty new to Blazor (front-end in general to be honest) and I am stuck at something, hopefully the solution to this is known to one of you.

I have a RadzenDataGrid that consists of two RadzenDataGridColumn .

The second RadzenDataGridColumn has a Template, an EditTemplate and a FooterTemplate.

Everytime I select a specific row via a mouse hover, the entire row is highlighted.

I was wondering if its possible to also highlight the specific cell my mouse cursor is in at the moment, for example changing the specific cell background color for as long as my mouse cursor is present in that particular cell. I suspect i need to work with some kind of event. But I cant seem to figure about how to use a cell specific event instead of the broader row event.

I have tried using a DataGridCellRenderEventArgs<T> args but this both only allows setting a column in general and it doesnt allow any sort of css, only html (via args.attributes.add("") ))

Any of you fine people might know if this is at all possible what I am trying to do ?


r/Blazor 3d ago

You should benchmark your .NET apps!

Thumbnail
youtu.be
0 Upvotes

r/Blazor 3d ago

Meta Switching pages too fast causes 404 in service-worker.js

6 Upvotes

i have a blazor server app that im working on..

if i have two pages, with one in a folder like this:

/pageA

/folder/pageB

if i let pageA load fully then switch to pageB its all ok.

If i quickly switch i get 404 errors in service-worker.js

Also if i go direct to /folder/pageB i get the same 404 in service-worker.js

any ideas? its baffling me!


r/Blazor 3d ago

Uncaught ReferenceError ReferenceError: Blazor is not defined

1 Upvotes

Hi

We have a Blazor WebAssembly project with a manual startup in index.html. We use this to test browser capabilities and redirect to a catch-all page if the user's browser is unsupported.

This has previously worked absolutely fine. We have:

autostart="false" on the <script src="_framework/blazor.webassembly.js" autostart="false"></script> tag. Then a chunk of basic browser detection script ending in:

// Modern browsers e.g. Microsoft Edge

if (webassemblySupported && !isIE) {

Blazor.start({});

}

// Older browsers e.g. IE11

else {

window.location = window.location + "unsupported.html";

}

It's Blazor.start({}); that's throwing the exception. This is in Chrome and Edge and has only just started occurring app has been running in the wild for a good 12 months, I've just happened to come back into it to make a couple of changes.

Any ideas?


r/Blazor 3d ago

[HELP] Hosting blazor standalone WASM on NGINX

2 Upvotes

I'm having some issues hosting blazor WASM standalone (without an asp.net core project as host) behind nginx as a reverse proxy.

Here is my Nginx default config file:

server {

listen 80;

listen [::]:80;

server_name localhost;

location / {

root /var/www/web/BlazorApp/wwwroot;

try_files $uri $uri/ index.html =404;

include /etc/nginx/mime.types;

types {

application/wasm wasm;

}

default_type application/octet-stream;

}

location /service1/ {

proxy_pass http://localhost:5001/;

proxy_http_version 1.1;

proxy_set_header Upgrade $http_upgrade;

proxy_set_header Connection keep-alive;

proxy_set_header Host $host;

proxy_cache_bypass $http_upgrade;

proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;

proxy_set_header X-Forwarded-Proto $scheme;

}

location /service2/ {

proxy_pass http://localhost:5002/;

proxy_http_version 1.1;

proxy_set_header Upgrade $http_upgrade;

proxy_set_header Connection keep-alive;

proxy_set_header Host $host;

proxy_cache_bypass $http_upgrade;

proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;

proxy_set_header X-Forwarded-Proto $scheme;

}

location /service3/ {

proxy_pass http://localhost:5003/;

proxy_http_version 1.1;

proxy_set_header Upgrade $http_upgrade;

proxy_set_header Connection keep-alive;

proxy_set_header Host $host;

proxy_cache_bypass $http_upgrade;

proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;

proxy_set_header X-Forwarded-Proto $scheme;

}

}

This Configuration works in the sense that I can access my blazor app using

http://{server-ip-address}

and my other services using

http://{server-ip-address}/serviceX

where X would refer to service 1,2 and 3 respectively

**First issue**: when I navigate in my blazor app for example to `http://{server-ip-address}/My-Blazor-Page` and I refresh the page I get a 404 not found error.

for it to work back again I need to go back to the base address `http://{server-ip-address}` and navigate back to `My-Blazor-Page`.

I cannot refresh a page and go back to the same page.

**Second issue**: I would like my blazor app to have a different location. I would like to use `http://{server-ip-address}/Blazor` rather than `http://{server-ip-address}/`.

I tried everything to get it right but this is the only config that semi-works

Thanks for your help!


r/Blazor 4d ago

MAUI Blazor still alpha?

2 Upvotes

I was pretty excited to try out MAUI Blazor today. Did a multi timer with funny alarms in just a couple of hours. Worked like a charm, until I tried to use it on my Android Phone. As soon as the screen locks, the timers stop. Only thing I could find as a solution was to set DeviceDisplay.Current.KeepScreenOn = true (in MainLayout OnAfterRender). Now the app won't even start. Shows the splash screen for half a second and quits. No exception, nothing. Removed the line, tried as apk, uninstalled it, reinstalled it: Now it doesn't even show the splash screen, same thing debugging in the emulator. Still works on Windows though.Also, I had the idea that you could record your own alarm sounds. But there's just no way to record audio from the microphone... Srsly? A multiplatform framework that can't record audio? This is not even a beta.

I mean, I'm happy to assist in testing. But kinda need to know that I'm doing it.


r/Blazor 4d ago

Mud Blazor Full Row Select is it possible

3 Upvotes

I am used to grids where the customer can click on the row to become selected then you double click to go to another screen or some edit button.

Does mudblazor have a full row select option I could not see any in its data grid.


r/Blazor 6d ago

Blazor.Text.Editor Nuget Package v5.1.0 is available on NuGet. Links to the source code and the demo shown in the gif are in the comments.

32 Upvotes

r/Blazor 5d ago

TCP server with GUI for data entry

0 Upvotes

I want to have a TCP server with multiple 2D arrays which are sent to a client. The array values need to be updated from a GUI. The arrays are grouped under different sub units and I want a template page which shall be duplicated based on a drop down to change the values sent to a TCP client. Can Blazor be used? Can I have a TCP server running in a different thread send the values of the 2D array while the data is edited by user in a browser?


r/Blazor 6d ago

Can someone please help? I know this is like the most noobish thing but I am trying to do a tutorial for blazor. I opened up a new project but I cannot see my nav bar on the right side. this is just the default blazor app I opened. I have updated VS2022. I don't know why this is happening.

Post image
0 Upvotes

r/Blazor 7d ago

Quick and easy UI library for someone coming from Angular?

12 Upvotes

We are running Blazor .NET 3 application in production, it's working great but users (internal employees) started complaining about missing features as the company grew so we need to modernize it. I have used Blazor for a short time, the current implementation is just using Bootstrap, with no form validations, nothing. I'm an Angular developer and need to either rewrite the application in Angular/React or remove bootstrap and replace it with a nicer one.

Most of our developers are .NET guys, so it's my decision how to write it. I think leaving it as Blazor is a good idea since it would be easier to transition junior developers to work on it as well.

Would you recommend anything similar to Angular Material for Blazor? It should be open source and free to use or a single license (not per developer).

  • MudBlazor - seems great, it's my choice for now
  • MatBlazor - seems to no longer be maintained
  • Blazored - seems nice but only for some things
  • NET MAUI + Tailwind - seems like this could be used for some custom components but might take too long to build

r/Blazor 7d ago

Blazor School - Error handling in Blazor Server .NET 6

7 Upvotes

Error handling refers to the response and recovery procedures from error conditions present in website development. In other words, it is the process comprised of anticipation, detection, and resolution of application errors, programming errors or communication errors. Error handling helps in maintaining the normal flow of program execution. In fact, many websites face numerous design challenges when considering error-handling techniques. In this tutorial, we will walk you through this crucial technique with the following content:

  • What is error handling?
  • Why do you need to handle errors?
  • What to do to handle an error?
  • The main categories of errors.
  • Catching an error.
  • Error handler pipeline.
  • Take actions against an error.
  • What is an error handler?
  • Why do you need a custom error handler?
  • Build a custom error handler.
  • Using custom error handler.
  • Tracking error.
  • Common mistakes.
  • Best practice.

Check it out https://blazorschool.com/tutorial/blazor-server/dotnet6/error-handling-611597

Support and earn rewards: https://opencollective.com/blazor-school-docs
Buy books (4 books in collection): https://blazorschool.com/books
Schedule a support meeting: https://blazorschool.com/direct-support
Join the community https://discord.com/invite/HsTu2Emqsd

Learn Blazor at https://blazorschool.com


r/Blazor 7d ago

Binded Textarea truncates value in Blazor WASM if it contains HTML code? Help needed

1 Upvotes

I'm using .NET 6 and Blazor WASM. When I paste to textarea normal text, no matter how long or short, it works fine and shows up in variable. However if I paste HTML source code from website (for example this site, or any other), it seems to truncate it from middle if it's longer than thousands of characters. It takes X amount of characters from beginning and end, in the middle it has "…". The truncated string is usually around 1000-1200 characters.

I tried extracting the value from textarea-element with vanilla js and it worked completely fine.

NOTE! This did work ~2-3 months ago, I just suddenly noticed it stopped working. I have deployed code similar to this, but on different file. I have not manually updated anything in framework or editor (Visual Studio 2022)

So I have simple code that is something like this:

<form>
    <label for="pasteHtml">Paste HTML code here</label>
    <textarea @bind="pastedHtml" id="pasteHtml" rows="3"> 
</textarea>
</form>
<button @onclick="ParseHtml"> Parse HTML</button>

and also:

@code {
    // This is where I have the problem, pastedHtml value is truncated if it contains HTML code..
    private string pastedHtml= "";

    private void ParseHtml()
    {
        // Code... etc

r/Blazor 7d ago

Mudblazor but with stock Blazor look

0 Upvotes

Hello, so I have literally zero CSS skills or abilities. I have utilized MudBlazor exclusively for ONE component... the multiselect. Now that I habe MudBlazor, it looks aweful compared to the bone stock Blazor with Bootstrap.

Is there a way I can get back that look/style while still utilizing MudBlazor? I would image it's as simple as changing some CSS file to the stock blazor one? Any help is greatly appreciated!


r/Blazor 8d ago

How Should I Host my Blazor App?

13 Upvotes

Howdy all!

I have been looking around trying to figure out how I should host a Blazor site I'm working on. I am super new to hosting and things like that, so I am having trouble figuring out how to best approach this. I should note that I'm not partial to Blazor server or WASM. I'll just do whichever is cheapest.

For context, in case it helps, the app will utilize the Riot Games API to fetch some data and then display it for the user.

My biggest bottleneck is price. I was looking at Azure AppService or SignalR, but they are both quite expensive (there are some cheap options, but they don't allow you to use a custom domain which I would like to do). Then, I saw something about WASM on AWS Amplify, but from what I can tell I would not be able to run API endpoints on there for the WASM app to request data from.

I couldn't find any good options on my search that weren't too expensive, but maybe I'm missing something. Any input or recommendations would be appreciated.


r/Blazor 8d ago

A WebKitGtkSharp WebView for running Blazor Hybrid applications on Linux without the need to compile a native library.

Thumbnail
github.com
2 Upvotes

r/Blazor 7d ago

loading failed for the script with source

0 Upvotes

Hey, i tried to publish the Blazor WebAssembly app im making with "Project->Publish" then "create folder".
However when opening the html file from explorer i get the following errors in the browser:
loading failed for the script with source blazor "file:///_framework/blazor.webassembly.js"
loading failed for the script with source blazor "file:///_content/Radzen.Blazor/Radzen.Blazor.js"

these are auto generated lines of code. I did not put them there. Why does it not load correctly? How do i load correctly? I intend to upload the app on a WiX created website.

The code for loading the files are in index.html:

<script src="_framework/blazor.webassembly.js"></script> 
<script src="_content/Radzen.Blazor/Radzen.Blazor.js"></script>

r/Blazor 8d ago

.Net 7 Hosted WASM Issues

4 Upvotes

I'm trying to get a .Net 7 Hosted WASM app running, starting with the default Visual Studio template, but haven't been successful so far. The same app works just fine running in .Net 6. In 7, the app starts and launches the browser (tried with Edge, Chrome, Firefox), but only displays the about:blank page with no loading indicators or activity of any kind in the Devloper Tools. After a minute or so, VS shows an error about failing to launch the debug adapter. I've cleaned/rebuilt the solution, deleted the .vs folder, enabled/disabled script debugging options, etc. No dice.

There's no additional information in the Output window, though I am seeing a pretty vague error in the verbose logs: "Could not open wss://localhost:7032/_framework/debug/ws-proxy?browser=ws%3A%2F%2F127.0.0.1%3A60072%2Fdevtools%2Fbrowser%2Fe75aeaf1-27db-4511-a31a-9d4eafe6bbe2".

Has anyone else encountered this issue, or have any ideas for a fix? Many thanks in advance!


r/Blazor 9d ago

Full-stack vs Blazor

5 Upvotes

hello, I'm noobie here. a simple question -- if I learn Blazor , both on the client side and on the server side,, could i confidently call myself a full-stack dev? What are the Blazor ie Microsoft technologies I'd have to learn to call myself full-stack dev? or are there technologies that Microsoft / DotNET don't offer that are necessary for full-stack?


r/Blazor 9d ago

File upload to S3 without opening read stream?

1 Upvotes

Hey There,

So I've been trying to upload a File to S3 using an HTTP PUT request via a presigned URL. When I test it on Postman it works if I attach the file as binary type in the request body.

I've been trying to replicate this on Blazor but I'm running into the "Supplied file with size 188947146 bytes exceeds the maximum of 512000 bytes.". I know this occurs because the file I'm trying to read from is too big for Blazor's file upload limit.

So my question is how would I get around this when trying to upload large files?

Here's the code:

@code{


    Video video = new Video();

    private IBrowserFile file;

    Uri? baseURL;

    MemoryStream ms = new MemoryStream();

    protected override Task OnInitializedAsync()
    {
        Console.WriteLine(Http.BaseAddress);
        baseURL = Http.BaseAddress;
        return base.OnInitializedAsync();
    }

    private async Task  AddVideo()
    {
        video.Tags = new List<string>();
        var videoResponse = await Http.PostAsJsonAsync($"{baseURL}videos", video); // add the video and get the presignedURL from our server

        if (videoResponse.IsSuccessStatusCode)
        {
            Video? newVideo = await videoResponse.Content.ReadFromJsonAsync<Video>();

            if (newVideo != null)
            {
                Console.WriteLine(newVideo.ToString());

                InitiateVideoUpload(newVideo); // if the request is successful that means we have a valid presignedURL so upload the video from the client
            }
        }
    }

    private async Task onFileChanged(InputFileChangeEventArgs eventArgs)
    {
        if (!String.IsNullOrEmpty(eventArgs.File.Name))
        {
            video.VideoFilename = eventArgs.File.Name;
            video.VideoURL = "";
            file = eventArgs.File;

            using var stream = eventArgs.File.OpenReadStream(); // FAILS HERE
            await stream.CopyToAsync(ms);

        }
    }
    async Task InitiateVideoUpload(Video vidInformation)
    {
        Console.WriteLine(vidInformation.VideoURL); // debugging to see the presignedURL

        Console.WriteLine("Sending video to AWS S3...");
        var contentData = new StreamContent(ms, ms.Capacity);
        var uploadResponse = Http.PutAsync(vidInformation.VideoURL,contentData);
        if (uploadResponse.IsCompletedSuccessfully)
        {
            Console.WriteLine("Video successfully uploaded");
        }
        else
        {
            Console.WriteLine(uploadResponse.Result.StatusCode);
            Console.WriteLine(uploadResponse.Result.Content.ReadAsStringAsync());
        }

    }

}

r/Blazor 10d ago

Why are there no or very few Blazor jobs?

22 Upvotes

I did a search on dice.com for Blazor jobs, filtered by remote only and full time. I got 0 results! (Without filters, 10 jobs in the whole US.)

I did a similar search for Angular or React and got over 600 jobs for each. I know Blazor is newer but it was released in 2018. So after 4 years, I am surprised that there are very few jobs for it. I am pretty sure 4 years after Angular or React were released, there were many jobs.

I am not sure if companies that seek .NET developers and plan to use Blazor do not advertise they also need Blazor skills. It's not comforting to see that the demand for Blazor is not picking up as I thought it would after 4 years. Are companies waiting for it to mature even more or what's going on?


r/Blazor 9d ago

Scheduler help

1 Upvotes

Hello everyone!

I hope you are having a great day!

I'm trying to make some kind of scheduler.. that looks like this

https://preview.redd.it/g6gv9p56eh1a1.png?width=693&format=png&auto=webp&s=8a2a7aacfc9d6003160797f5a319207993963e54

And I'm looking some kind of basic css/html/javascript example so I could re-work it as Blazor component. Maybe there is one and I dont know about it? Maybe someone tried to achieve something similar and could tell me how I should name such scheduler in search engine to find examples as like mentioned in css/html/javascript?

Any help would be appreciated!