title: Adding Server-Side Blazor to an existing MVC Core app
body: <p>I have a fully operative Blazor server-side project and a .NET Core 3 MVC project, both in the same solution.  I'm now trying to use the components from the Blazor project in my MVC project.  </p>
  
  <p>I've managed to get the components to render on an MVC page, but button clicks on the Blazor component don't trigger the onclick events for the components, instead I just get navigated to <a href="https://localhost:44341/" rel="noreferrer">https://localhost:44341/</a>?</p>
  
  <p>I'm unclear as to exactly what changes I need to make in the MVC solution to get this working?  The official documentation <a href="https://docs.microsoft.com/en-us/aspnet/core/blazor/components?view=aspnetcore-3.0#integrate-components-into-razor-pages-and-mvc-apps" rel="noreferrer">talks about using components in and MVC project</a> and it's mentioned in this <a href="https://youtu.be/ap60h3eQE5Y?t=3581" rel="noreferrer">video chat with Dan Roth</a>, but neither go into the detail of how to achieve it.</p>
  
  <p>Could anyone walk me though the full steps on how to retrofit server-side Blazor into an MVC project (or point me at an example)?</p>
  
  <h3>What I've tried</h3>
  
  <p>My Blazor project still has the standard template's Counter component, so I've tried to add that to my MVC solution by referencing the Blazor project and then adding this to my index.cshtml file:</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;div id="Counter"&gt;
    @(await Html.RenderComponentAsync&lt;Counter&gt;())
  &lt;/div&gt;
  </code></pre>
  
  <p>That renders correctly but the button clicks don't work.</p>
  
  <p>I've added the JS file to MVC apps _Layout page:</p>
  
  <pre class="lang-cs prettyprint-override"><code>&lt;script src="_framework/blazor.server.js"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>Turned on Server Side Blazor in the MVC project's Startup.cs file:</p>
  
  <pre class="lang-cs prettyprint-override"><code>services.AddServerSideBlazor();
  </code></pre>
  
  <p>I've also added Pages and Shared directories to the MVC project and copied over the _Imports and MainLayout files - not sure if that's needed.</p>
  
  <p>When that didn't do it, I tried spinning up new projects from all the Blazor templates (client, client-hosted and server-side) to look for clues, but all of those examples are set up as complete SPAs with a single Blazor entry point (the <code>App</code> file) hosted in a .html file, whereas I want to render Blazor components on lots of different existing MVC pages.</p>
  
  <p>I then experimented with adding parts of those projects (and parts of my working Blazor project) into the MVC project, but can't get it to work fully. </p>
  
  <p>I tried following <a href="https://stackoverflow.com/a/55911119/1879019">the answer here</a> too, but that's working with adding the Blazor component files into the MVC project, whereas my Blazor files are currently (mostly) in a different project.</p>
  
  <h3>Random questions from my experiments to date</h3>
  
  <ul>
  <li>I've added <code>services.AddServerSideBlazor();</code> in the MVC app's Startup.cs. is anything else needed there?</li>
  <li>My MVC app is still on traditional <code>AspNetCore.Routing</code>, do I still need to switch to Core 3's endpoint routing if I'm only placing the components on existing MVC pages (I.e. I won't have Blazor pages, just Blazor components).  </li>
  <li>Does the server-side part of Blazor that the blazor javascript file running in the browser talks to (via SignalR) need endpoint routing?  I'm getting a 404 in the browser from the js file.</li>
  <li>Do I still need the `App' (App.razor) class/page as an entry point if I'm just hosting components?  </li>
  <li>If so, do I need to put the <code>&lt;app&gt;@(await Html.RenderComponentAsync&lt;App&gt;())&lt;/app&gt;</code> line from _Host.cshtml somewhere in my MVC project?</li>
  <li>Do I need to reproduce the Pages and Shared folders from the Blazor project in my MVC project, and also the two _Imports.razor files and the MainLayout.razor file?</li>
  <li>I think Blazor is now part of the Microsoft.NETCore.Platforms file (referenced under the SDK node in the MVC project), so am I right to think I don't need to add separate NuGet packages for Blazor to the MVC project?</li>
  </ul>