本地运行的API和网页应用:请求的资源中缺少“Access-Control-Allow-Origin”头
我已经看到一些关于这个错误的帖子,但到目前为止还没有一个能帮到我的。可能是因为我把所有东西都在本地运行。
我有一个MAUI应用,通过一个本地API(ASP.NET Core,因此是C#)将数据发送到本地的SQL Server,当然也是本地运行。我用我的私有IP地址来进行这个操作:
var response = await http_client.PostAsync(
"http://192.168.X.X:5000/api/response",
content
这工作得很好。
现在我还有一个网页应用,我也想用同样的方式把数据发送到API,但遇到了一个问题。
我有这段用于按钮点击的代码:
document.getElementById("test-btn").addEventListener("click", async () => {
const res = await fetch("http://192.168.X.X:5000/api/response", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({
alertIDLong: crypto.randomUUID(),
alertIDShort: crypto.randomUUID().slice(0, 8),
information: document.getElementById("message-input").value,
eventDateTime: new Date().toISOString()
})
});
当我使用它时,我得到以下错误:
通过CORS策略,从源 'https://localhost:7000' 对 'http://192.168.X.X:5000/api/response' 的fetch请求已被阻止:对预检请求的响应未通过访问控制检查:请求的资源上不存在 'Access-Control-Allow-Origin' 头。
在网上搜索这个错误时,似乎这是许多人遇到的问题,有些人已经解决了。但是,在我的情况(所有内容都在本地运行)中找不到解决方案。我确实尝试过调整 Program.cs 来处理这个问题:
using AzureNotificationDemo.Hubs;
using AzureNotificationDemo.Services;
var builder = WebApplication.CreateBuilder(args);
builder.Services.AddSignalR();
builder.Services.AddHttpClient<DatabaseService>();
builder.Services.AddSingleton<NotificationService>();
builder.Services.AddControllers();
builder.Services.AddCors(options =>
{
options.AddPolicy("AllowSpecificOrigin", policy =>
{
policy
.WithOrigins("http://192.168.1.169")
.AllowAnyHeader()
.AllowAnyMethod()
.AllowCredentials();
});
});
var app = builder.Build();
app.UseStaticFiles();
app.UseRouting();
app.UseCors("AllowLocalFrontend");
app.UseAuthorization();
app.MapControllers().RequireCors("AllowLocalFrontend");
app.MapHub<DatabaseHub>("/databaseHub");
var dbService = app.Services.GetRequiredService<DatabaseService>();
_ = Task.Run(() => dbService.PollForUpdates());
app.Run();
但这没有奏效。
有没有人有办法解决这个问题的想法?也许因为我本地运行一切,这会更加具有挑战性。代码库是用C#编写的。
解决方案
我用另一种方式解决了。我只是创建了一个后端函数来发送数据,然后让按钮去调用这个函数。这样就解决了整件事。
站内所有文章版权归属LeftHeroAI导航站,无授权禁止任何主体转载、抄袭、复制内容,亦不得私自架设镜像站点。一经侵权,本站将通过法律途径追责。