Vue.js- und ASP.NET-Kernanwendungsauthentifizierung ⇐ C#

[Guest]

Ich habe ein System, das aus einer Vue.js-Clientanwendung und einem ASP.NET Core 9-Backend besteht. Dieses Backend verwendet app.MapFallbackToFile("/index.html").RequireAuthorization();, um die Clientanwendung nur autorisierten Benutzern bereitzustellen. Ich muss von einer dritten Anwendung mit LTI-Authentifizierung angerufen werden. Sie senden mir nur beim ersten Mal ein JWT-Token, mit dem ich mich authentifizieren kann:

Code: Select all

// In building I use
.AddJwtBearer(async opt =>
{
opt.TokenValidationParameters = new TokenValidationParameters
{
ValidateIssuer = true,
ValidIssuer = jwtSection.Issuer,
ValidateAudience = true,
ValidAudience = jwtSection.Audience,
ValidateLifetime = true,
IssuerSigningKeys = keys
};

opt.Events = new JwtBearerEvents
{
OnMessageReceived = context =>
{
if (context.Request.ContentType == "application/x-www-form-urlencoded")
{
if (context.Request.Form.Any(f => f.Key == jwtSection.TokenField))
{
var token = context.Request.Form[jwtSection.TokenField];

// Set jwt cookie
context.Response.Cookies.Append("jwt", token, new CookieOptions
{
HttpOnly = true,
Secure = true,
SameSite = SameSiteMode.None
});
context.Token = token;
}
}

if (context.Request.Cookies.TryGetValue("token", out var jwt))
{
context.Token = jwt;
}

return Task.CompletedTask;
}
};
});

// In startup I use this
app.UseCookiePolicy(new CookiePolicyOptions
{
HttpOnly = Microsoft.AspNetCore.CookiePolicy.HttpOnlyPolicy.Always,
Secure = CookieSecurePolicy.SameAsRequest,
MinimumSameSitePolicy = SameSiteMode.None,
});

app.MapGet("vue/api/me", (HttpContext context) =>
{
return new { name = context.User.Claims.FirstOrDefault(f => f.Type == "name") };
}).RequireAuthorization();

app.MapFallbackToFile("/index.html").RequireAuthorization();

Aber wenn ich versuche, das Cookie in der Antwort zu setzen, sehe ich es und jedes andere Cookie von meinem asp.net-Core-Backend in der Clientanwendung in einem Iframe unter https:// nicht. saltire.lti.app/platform:

Code: Select all

about:blank

Wenn ich meine Anwendung in einem neuen Tab statt in einem Iframe lade, sehe ich viele Cookies von meinem Backend, aber nicht mein JWT-Cookie.
Der /me-Aufruf ist ebenfalls nicht autorisiert.
Irgendeine Idee, wie ich das JWT-Token in meiner Client-App speichern und für zukünftige Authentifizierungen verwenden kann? Es ist nicht notwendig, ein Antwort-Cookie zu verwenden, ich muss meine Vue.js-Anwendung authentifizieren, was auch immer nötig ist...
Im LTI-Flow rufen sie mein Backend in dieser Aktion auf:< /p>

Code: Select all

[HttpPost("launch")]
[Authorize]
[Consumes("application/x-www-form-urlencoded")]
public async Task PostLaunch([FromForm] JwtPayload request)
{
await Task.CompletedTask;

if (HttpContext.User.Identity?.IsAuthenticated == true)
{
return this.RedirectPreserveMethod("/");
}
}

Das ist die letzte autorisierte Aktion (hier erhalte ich das JWT-Token von lti). Mit dieser Anweisung this.RedirectPreserveMethod("/"); kann ich zum Aufrufer der Vue.js-Anwendung zurückkehren.
Edit 1: Ich beginne meine Reise in saltire.lti. app-Domäne tunnele ich meinen lokalen Computer mit ngrok, daher lautet die öffentliche URL https://15e1-93-41-196-8.ngrok-free.app, ngrok leitet die weiter Datenverkehr zu meinem Dotnet-Backend, bereitgestellt unter https://localhost:7093, aber meine vue.js-Anwendung wird unter https://localhost:64928 bereitgestellt. In der Browserkonsole sehe ich drei verschiedene Domänen und die Konsole antwortet mir mit folgender Fehlermeldung: Cookie „jwt“ wurde für ungültige Domäne abgelehnt. Ich erhalte diesen Header: jwt=...; domain=https://15e1-93-41-196-8.ngrok-free.app; path=/; sicher; samesite=none; httponly.


Ich habe ein Cookie mit diesem Code erstellt:

Code: Select all

HttpContext.Response.Cookies.Append("jwt", written, new CookieOptions
{
HttpOnly = true,
Secure = true,
SameSite = SameSiteMode.None,
Domain = "https://15e1-93-41-196-8.ngrok-free.app"
});

Selbst die Verwendung von localhost als Domain funktioniert nicht, der Fehler in der Browserkonsole.