How can I add blazor server-sdie into an exists asp.net core project? [Answered]RSS

• • Reply
  mywatermelon

  Member

  49 Points

  225 Posts

  How can I add blazor server-sdie into an exists asp.net core project?

  Mar 26, 2020 09:10 AM|mywatermelon|LINK

  I have made a website by asp.net core 3.1 before.

  Now I wanna add a feature of 'contact us'.

  After the users input their name/phone and click the submit button, the blazor server-side will send an e-mail of the user information above to my mailbox.

  In spite, I can achieve this by Ajax, but now I want to do this by Blazor server-side.

  I don't want to migrate the whole project to Blazor server-side for this feature only available on some page but not all the pages.

  In my opinion, I will add blazor server-side into the asp.net core project which is existed.

  I tried this by myself by adding the services.AddServerSideBlazor(); in ConfigureServices and adding the MapBlazorHub to UseEndpoints in Configure.

  I only add a h3 element to the component of Blazor server-side and add the it to an existing page like this:

  <component type="typeof(Project.Pages.Contact)" render-mode="ServerPrerendered" />

  After I ran the project, it reports these errors in Chrome DevTools:

  [2020-03-26T09:01:16.249Z] Error: Failed to complete negotiation with the server: Error
  [2020-03-26T09:01:16.249Z] Error: Failed to start the connection: Error
  [2020-03-26T09:01:16.250Z] Error: Error
  Uncaught (in promise) Error: Cannot send data if the connection is not in the 'Connected' State.
  at e.send (blazor.server.js:1)
  at e.sendMessage (blazor.server.js:1)
  at e.sendWithProtocol (blazor.server.js:1)
  at blazor.server.js:1
  at new Promise (<anonymous>)
  at e.invoke (blazor.server.js:1)
  at e.<anonymous> (blazor.server.js:15)
  at blazor.server.js:15
  at Object.next (blazor.server.js:15)
  at blazor.server.js:15

  I googled and found it seems the SignalR of the project did not start correctly.

  How can I solve this? Is there any tutorial about this? Thank you.

• • Reply
  Rena Ni

  Participant

  1910 Points

  642 Posts

  Re: How can I add blazor server-sdie into an exists asp.net core project?

  Mar 27, 2020 08:00 AM|Rena Ni|LINK

  Hi mywatermelon,

  For add blazor server into existed asp.net core project,refer to:

  https://docs.microsoft.com/en-us/aspnet/core/blazor/integrate-components?view=aspnetcore-3.1

  https://devblogs.microsoft.com/premier-developer/integrating-blazor-components-into-existing-asp-net-core-mvc-apps/

  Best Regards,

  Rena

  MSDN Community Support
  Please remember to click "Mark as Answer" the responses that resolved your issue.
  If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.
• • Reply
  mywatermelon

  Member

  49 Points

  225 Posts

  Re: How can I add blazor server-sdie into an exists asp.net core project?

  Mar 27, 2020 08:02 AM|mywatermelon|LINK

  Well, it works after I insert the code:

  <base href="~/" />

  in head tag.

  Thank you.