I have been struggling to integrate React with ASP.NET 6
Finally I am using the following configuration at Program.cs
app.UseSpa(spa =>
{
spa.Options.SourcePath = "FrontEnd";
if (builder.Environment.IsDevelopment())
{
spa.UseReactDevelopmentServer(npmScript: "start");
}
});
and had WDS_SOCKET_PORT=7207 in the .env.development file of the frontend to refresh the page with every code update
Now my problem is that all APIs respond with 404 (it worked previously very well as WebAPI app without React)
I don't think that I am pointing to a wrong port, knowing that I am using the port the is in "applicationUrl": "https://localhost:7207"
I think the routing configuration needs to be adjusted
Can't solve it
====
AS requested here is the Program.js
using EBankingSystem.Data;
using EBankingSystem.Models;
using Microsoft.AspNetCore.Identity;
using Microsoft.AspNetCore.Identity.UI.Services;
using Microsoft.AspNetCore.SpaServices.ReactDevelopmentServer;
using Microsoft.EntityFrameworkCore;
var builder = WebApplication.CreateBuilder(args);
var services = builder.Services;
var configuration = builder.Configuration;
// Add services to the container.
// DB
services.AddDbContext<ApplicationDbContext>(options =>
options.UseNpgsql(configuration.GetConnectionString("Development")));
services.AddDatabaseDeveloperPageExceptionFilter();
// View
In production, the React files will be served from this directory
services.AddSpaStaticFiles(configuration =>
{
configuration.RootPath = "FrontEnd/build";
});
// Controllers
services.AddControllers();
// Identity
services.AddIdentity<User, IdentityRole>()
.AddEntityFrameworkStores<ApplicationDbContext>();
var app = builder.Build();
// Configure the HTTP request pipeline.
if (app.Environment.IsDevelopment())
{
app.UseMigrationsEndPoint();
}
else
{
app.UseExceptionHandler("/Error");
// The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
app.UseHsts();
}
app.UseDefaultFiles();
app.UseStaticFiles();
app.UseHttpsRedirection();
app.UseRouting();
app.UseSpa(spa =>
{
spa.Options.SourcePath = "FrontEnd";
if (builder.Environment.IsDevelopment())
{
spa.UseReactDevelopmentServer(npmScript: "start");
}
});
app.UseAuthentication();
app.UseAuthorization();
app.MapControllers();
app.Run();