要在本地同时运行React和C#应用程序,您可以使用反向代理或代理服务器来将两个应用程序运行在相同的域名下。以下是一种解决方法的示例:
安装并配置反向代理服务器:
在React应用程序的根目录下,使用命令 npm install http-proxy-middleware
安装反向代理中间件。
在React应用程序的根目录下创建一个名为 setupProxy.js
的文件,并添加以下代码:
const proxy = require('http-proxy-middleware');
module.exports = function(app) {
app.use(
'/api',
proxy({
target: 'http://localhost:5000', // 将请求转发到C#应用程序的端口
changeOrigin: true,
})
);
};
在React应用程序的 package.json
文件中添加以下代码:
"proxy": "http://localhost:3000",
这将确保React应用程序中的所有请求都会被代理到指定的端口。
在C#应用程序中配置CORS(跨域资源共享):
在C#应用程序的 Startup.cs
文件中的 ConfigureServices
方法中添加以下代码,以允许来自React应用程序的跨域请求:
services.AddCors(options =>
{
options.AddPolicy("ReactPolicy",
builder =>
{
builder.WithOrigins("http://localhost:3000")
.AllowAnyHeader()
.AllowAnyMethod();
});
});
在 Configure
方法中添加以下代码,以使用CORS策略:
app.UseCors("ReactPolicy");
启动应用程序:
npm start
启动React服务器。现在,您的React和C#应用程序将都在 http://localhost:3000
上运行,并且React应用程序的所有请求都将被代理到C#应用程序的端口。