在 Blazor WebAssembly 中获取第三方登录的用户数据

Posted 2023-04-13

【中文标题】在 Blazor WebAssembly 中获取第三方登录的用户数据

【英文标题】：Get third party loggedin user data in Blazor WebAssembly

【发布时间】：2021-03-03 10:46:28

【问题描述】：

我正在开发一个应用程序并成功使用 Google 登录。问题是我至少不知道如何获取用户电子邮件。

我之前做过的事情： 首先，我尝试了可以​​在项目创建时选择的默认用户登录“框架”，然后我添加了第三方登录。问题是使用该方法创建了太多表，而我只需要一个表来存储用户数据。我也想由我来决定用户表中将有哪些列。此外，使用该登录方法，我被重定向到剃刀页面以进行登录，然后我再次被重定向回 Blazor 应用程序。这不是很漂亮，因为我只想用谷歌登录。

现在的情况： 我正在复制此 repo 的登录信息，因此不会被重定向到剃须刀页面进行登录： https://github.com/dotnet-presentations/blazor-workshop

我更改了启动以将 Google 添加到选项中：

services
                .AddAuthentication(options =>
                
                    options.DefaultScheme = CookieAuthenticationDefaults.AuthenticationScheme;
                )
                .AddCookie()
                .AddTwitter(twitterOptions =>
                
                    twitterOptions.ConsumerKey = Configuration["Authentication:Twitter:ConsumerKey"];
                    twitterOptions.ConsumerSecret = Configuration["Authentication:Twitter:ConsumerSecret"];
                    twitterOptions.Events.OnRemoteFailure = (context) =>
                    
                        context.HandleResponse();
                        return context.Response.WriteAsync("<script>window.close();</script>");
                    ;
                )
            .AddGoogle(googleOptions =>
             
                 googleOptions.ClientId = Configuration["Authentication:Google:ClientId"];
                 googleOptions.ClientSecret = Configuration["Authentication:Google:ClientSecret"];
                 googleOptions.Events.OnRemoteFailure = (context) =>
                 
                     context.HandleResponse();
                     return context.Response.WriteAsync("<script>window.close();</script>");
                 ;
             );

在 blazor 应用程序中，我有登录链接：

<a class="sign-in" href="user/signin">Sign in</a>

在我拥有的服务器中：

[HttpGet("user/signin")]
        public async Task SignIn(string redirectUri)
        
            if (string.IsNullOrEmpty(redirectUri) || !Url.IsLocalUrl(redirectUri))
            
                redirectUri = "/";
            

            await HttpContext.ChallengeAsync(
                Microsoft.AspNetCore.Authentication.Google
                .GoogleDefaults.AuthenticationScheme,
                new AuthenticationProperties  RedirectUri = redirectUri );
            
        

那么，我如何从服务器中的这一点获取用户数据？

【参考方案1】：

知道了。

当访问服务器上受保护的资源时，通常是从 API 获取数据，我们将通过定义 @using Microsoft.AspnetCore.Authorization 在“用户”变量下获得经过验证的用户数据。 以下是底部捕获的电子邮件示例：

[Route("orders")]
    [ApiController]
    [Authorize]
    // [Authorize]
    public class OrdersController : Controller
    
        private readonly PizzaStoreContext _db;

        public OrdersController(PizzaStoreContext db)
        
            _db = db;
        

        [HttpGet]
        public async Task<ActionResult<List<OrderWithStatus>>> GetOrders()
        
            string g = User.Identity.Name;
            string email = User.FindFirstValue(ClaimTypes.Email);

有了它，我可以在 users 表上获取用户 ID，并从数据库中获取我想要的任何类型。 我也想从谷歌获取个人资料图片... ################################ 编辑： 为此，只需在 google 服务内的启动文件中添加此选项

googleOptions.ClaimActions.MapJsonKey("profilepic", "picture");

然后我们可以像这样在服务器的受保护资源中获取电子邮件

string pic = User.FindFirstValue("profilepic");

现在我想知道如何在客户端抓取头像....