GithubHelp home page GithubHelp logo

jdtcn / hybridblazor Goto Github PK

View Code? Open in Web Editor NEW
95.0 5.0 25.0 180 KB

Simultaneous Blazor Hosting Models and switching at runtime

License: MIT License

HTML 25.62% C# 66.54% JavaScript 6.07% CSS 0.63% Dockerfile 1.15%
blazor blazor-server blazor-webassembly

hybridblazor's People

Contributors

jdtcn avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar

hybridblazor's Issues

.NET 6 Preview - Issues Installing

I was not able to get your code running. Not sure what the issues were and I started with installing .NET Preview 6 tried to make it work from there. Not sure if there was some version mismatch or something.

Is the project dependent on the .NET 6 Preview? Or is there a way rollback the project files to work on .NET 5?

AZ authentication

Hi, this is really exciting. How would I use it with AZ authentication? Would I use only one registration (like a server app) or two registrations (like a WASM app)?

Navigation BACK Button not working in Hybrid Mode

I love the idea here having the HybridOnNavigation option. I found an issue that when I am navigating from one page to another in the Hybrid mode, if I hit the BACK button which is very typical of users, the page didn't redraw. In Server mode or WebAssembly mode, the back buttons worked as expected.

With .Net 6, I did have issues with the HeadOutlet for HybridManual, or HybridOnReady. For WebAssembly or HybridOnNavigation, I created a workaround. As you can see, I had to comment out the HybridManual.

HybridTypeEnum? hybridType = null;
try
{
    hybridType = await httpClient.GetFromJsonAsync<HybridTypeEnum>("/api/hybridtype");
}
catch { }

hybridType ??= HybridTypeEnum.WebAssembly;

switch (hybridType)
{
    case HybridTypeEnum.WebAssembly:
    case HybridTypeEnum.WebAssemblyPreRendered:
        builder.RootComponents.Add<App>("#app");
        builder.RootComponents.Add<HeadOutlet>("head::after");
        break;
    case HybridTypeEnum.HybridOnNavigation:
        builder.RootComponents.Add<HeadOutlet>("head::after");
        break;
    case HybridTypeEnum.HybridManual:
        //builder.RootComponents.Add<HeadOutlet>("head::after");
        break;
    default:

        break;
}

FYI... I recreated the IdentityServer pages as razor components, working with Server, WebAssembly, WebAssemblyPreRendered, and HybridOnNavigation, and it works with Login Providers such as Facebook, Twitter, and Google. It works very well with very little configuration. The only time you leave your environment is when you authenticate with a remote provider. I haven't quite figured out the backend workings of Microsoft.Identity.Web, so I don't think it is quite ready to release as a NuGet, but I might put it on GitHub.

HttpContext with user is null

Hey and thanks for the effort and the illustration.
But the whole thing works a bit limited.
When the application is initially loaded, the server-side httpContext with the user is empty, so an exception is thrown.

public Task<CurrentUser> CurrentUserInfo() { **var user = httpContextAccessor.HttpContext.User;** return Task.FromResult(new CurrentUser { IsAuthenticated = user.Identity.IsAuthenticated, UserName = user.Identity.Name, Claims = user.Claims .ToDictionary(c => c.Type, c => c.Value) }); }

Template

Hi,
Your project solved my problem, It will be useful for others if this project is a template, Could you make your project be template when Creating a new Project?

Thank you.

Frontend dies when server shuts down

When using HybridOnNavigation, it shifts just fine to wasm on navigation.

But even though I'm using the wasm frontend, it dies when the server shuts down.
I had expected to be able to navigate and use the counter even though the server shut down, and then when the server started again, it would start communicating again?

Browser history navigation broken

hi,
thank you for your work - the solution is very interesting.

However, I have the issue when navigating between pages and then using the browser back button to navigate to the previous page.
The URL is updated, but the page itself is not updated.

Would you have a solution or suggestion to fix this issue?

Many thanks in advance,
Christian

Environment:

  • Tested with the last repo-version
  • HybridType: HybridOnNavigation & HybridOnReady
  • Used Browser
    • Google Chrome
    • Firefox 97.0.1 (64-Bit)

Test

  • Debugging started (IIS Express)
  • Navigated to Counter
  • Navigated to Fetch
  • Navigated to Home
  • Browser history back button clicked
    • Result: URL changed to /fetchdata > the content remains unchanged

Очень круто получилось

Я бы рекомендовал написать целую библиотеку что бы ускорить сайты на blazor в момент первой загрузки.

OIDC auth

Hi, the hybrid blazor is a great idea. I've tried to adapt the code to our solution, but as with most projects we start running into issues as the app gets built out into a larger enterprise app. I'm struggling with a few things and I'm not sure if you've tried expanding this hybrid blazor app out further and ran into the same issues.

We are trying to setup the app for OIDC authentication against and external IdentityServer4 deployment. Most code snippets I've seen they use the Microsoft.AspNetCore.Components.WebAssembly.Authentication library's AddOidcAuthentication IServiceCollection extension on the client app to tie the OIDC middleware to the AuthenticationStateProvider and an AddAuthentication().AddCookie().AddOpenIdConnect() chain on the server startup. These seem to work independently ok, but I don't know if it works as well as your solution to share the client/server authentication. I've also run into issues when running WASM runtime (hybrid or webassembly as the mode). The WASM app will continuously generate OIDC checksession iframe's non-stop. Which might be these server/client middlewares both spinning up in the same deployment. The recommended way I'm seeing to do Blazor WASM authentication is OIDC w/ code+pkce flow (no secret, since wasm blazor can't be secure).

I can try to provide code or modify your solution if you have ideas on how to integrate OIDC. It would be nice to have a clean seamless app that shares blazor server/blazor wasm authentication and still allow for runtime switching between the two.

NET 6 Wasm Prerendered with persist state component vs HybridBlazor

Hi, I like to know does you have plan to change solution to use new was prerender which is available in NET 6 and persist state component?

NET 6 Wasm prerendered has one disadvantage against your solution. Page is static until WASM is loaded, user can't interact.
Did you analized it is possible use new NET 6 solution and have interaction when WASM is not loaded yet?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.