问题标签 [react-aad-msal]

我创建了一个简单的 REACT 应用程序，它只能在连接到我们网络上的大屏幕的本地 PC 上运行。限内部使用！它就像一个广告牌或仪表板。用户交互为零。屏幕不是触摸屏，也没有连接键盘和鼠标。因此没有用户登录。

构建 REACT 应用程序，然后将其部署到 PC 上的文件夹中。全部自动化。初始部署包括所有当前数据。然后在 Windows 启动时执行类似这样的命令：“python -m http.server 3000”（只是示例......）

该应用程序具有随应用程序一起部署的初始数据，但是，我希望它也能够调用安全的 Azure WebAPI 服务以每隔几分钟获取更新的统计信息。非常小的数据。主要是整数值。我只想提供一些实时更新。

我的 REACT 应用程序可以正常工作（如果 WEBAPI 不安全）或者个别调用允许匿名。但是，我们的业务规则要求所有端点都是安全的。

此应用在本地运行，但 API 是 Azure 应用服务。

我已将 Azure AD 中的 REACT 应用程序设置为注册应用程序，并将其配置为有权调用 WEBAPI 服务。

我有许多控制台应用程序，它们的设置和工作方式与这个 REACT 应用程序基本相同。对于 C# 守护程序应用程序，有一个 MSAL 包可以轻松完成。

我正在尝试学习 REACT，而不是将其构建为另一个 WPF 或 UWP 应用程序，我想尝试使用 REACT。

所以，我知道我需要一个访问令牌。我正在考虑客户端 ID 和 Secret，就像我在用 C# 编写的 C# 守护程序客户端中所做的那样。

如果没有用户登录，我找不到任何 REACT 或 Angular 示例。请记住，PC 没有输入设备。仅显示。同样，我的应用没有用户。它调用安全 API 来获取数据。就是这样。

谢谢你的帮助。

使用 Joy Wang 的评论和文档中的此页面： 服务到服务访问令牌请求

这是我的新代码：

当我调用上面的函数时，我得到以下响应：

响应 {type: "cors", url: "https://login.microsoftonline.com/.../oauth2/token", 重定向: false, status: 400, ok: false, ...} body: (... ) bodyUsed: false headers: Headers {} ok: false redirected: false status: 400 statusText: "Bad Request" type: "cors" url: "https://login.microsoftonline.com/.../oauth2/token" 原型：响应

也许还有另一种方法可以启动 REACT 应用程序，以便不检查 CORS？有任何想法吗？

再次感谢。

我在用着：

• "@azure/msal-browser": "^2.11.2",
• “@azure/msal-react”：“^1.0.0-alpha.6”

我的配置：

应用程序：

重定向有效，我使用公司帐户登录，然后我将被重定向回本地主机。但是：在控制台中出现以下错误：

类型错误：获取失败

本地存储：

{"failedRequests":[865,"ac1b77cf-4d4f-4917-a0cf-6e9fdda4a8f3"],"errors":["TypeError: 无法获取"],"cacheHits":0}

并且 App 组件也不会呈现。ErrorComponent 被渲染。

与示例有同样的问题： https ://github.com/AzureAD/microsoft-authentication-library-for-js/tree/dev/samples/msal-react-samples/typescript-sample

我在网络中发现了 CORS 错误：请求 URL：https ://login.microsoftonline.com/******-aa2f-23**-****-******** ****/oauth2/v2.0/token 这很奇怪，因为相同的重定向 url 适用于 react-adal。

我想这个问题是由于错误的 Azure 应用程序配置而发生的：

显现：

oauth2AllowImplicitFlow 应该绝对是错误的。

请问有人有清单的工作示例吗？

我正在尝试使用单个帐户作为代理来管理多个 Outlook 日历，因此所有其他帐户与此“主”帐户共享他们的个人日历，并且在此帐户中我可以“为每个人”添加、编辑或删除事件。

问题是我无法让帐户将 Calendar.ReadWrite.Shared 授予应用程序，即使在我的应用程序中此权限已按照建议配置。

Azure 门户 - 应用权限：Azure 门户 中应用的权限

msalconfig： 使用的 msal 配置

“有趣”的事情是，首先用于创建应用程序的帐户一切正常，但任何其他帐户都没有。

我什至用预期的最终帐户创建了另一个应用程序，但什么也没有。这是，不完整的权限，resul： 实际结果

这是期望的结果：

期望的结果

我有一个 ReactJS 网站，我在其中尝试使用“@azure/msal-react”：“^1.0.0-beta.1”，但遇到了一些让我困惑的问题。

1. 我的大部分页面都向公众开放。有些需要登录。如果我添加 MSALAuthenticationTemplate 如下（但使用interactionType=Redirect），一旦我启动站点，它就会要求我登录。我认为只有当我点击 AuthenticationTemplate 中的路由时才会这样做。

2. 使用 InteractionType Popup 会导致 SPA 在启动时抛出异常 Error: Objects are not valid as a React child (found: object with keys {login, result, error})。如果您打算渲染一组子项，请改用数组。在 p 中（在 App.tsx:44）

3. 出于某种原因，我的所有路由都返回主页，而不是加载相关组件，以及 AuthenticationTemplate 注释掉的事件。

我使用直接的 Javascript 进行了很多工作，但是在发布时遇到了 ESLint 问题，所以我认为 Typescript 可以帮助我解决这些问题。但现在它只是坏了。

在 React 中通过 fetch() 调用 API 但出现 CORS 错误。 https://login.microsoftonline.com/tenant_id /oauth2/v2.0/authorize?client_id=xxxxxxxxxxxxxxxxxxxxx&response_type=code&redirect_uri=http://localhost:3050&scope=user.Read.All&response_mode=query

上面的 URL 是由 Postman 制作的，如果直接粘贴在浏览器上可以正常工作。

2.有没有办法安全地获取代码，即在正文中而不是在查询中获取响应代码？

尝试将 Allow-access-origin 的获取中的标头传递给 *.

我添加了一个 axios 拦截器，在其中调用 authProvider.getAccessToken() 来获取令牌并添加到每个请求的标头中。

这是我的 axiosInterceptor.js

这是我的 authProvider.js

authProvider 在 App.js 中使用

axiosInterceptor 也包含在 App.js 中。

请就可能导致组件无限重新加载的原因提供建议。我已删除 authProvider.getAccessToken() 并验证，它工作正常。所以重载是由于这个原因引起的。

我们在我们的应用程序（使用 Adob​​e AEM + Reactjs 构建）中使用 ReactJs。这不是 SPA 项目，我们在某些页面中使用 reactjs 组件，我们使用 ReactDOM.render 使用 DOM 元素进行渲染。

我们希望对特定页面组件进行 SSO，而不是对整个站点进行 SSO。我们有正确的 Azure 租户和客户端 ID。

1. 我们使用react-aad-msal npm 来实现这一点。但是网址像https://login.microsoftonline.com/common//discovery/instance？而不是https://login.microsoftonline.com/ /oauth2/v2.0/authorize。我不知道我们在这里犯了什么错误。

2）我们是否有更好的方法或 npm 来在组件级别实现这一点，而不是我的第一种方法。

提前致谢。

@azure/msal-node 我有一个使用库进行用户登录的 nodejs/expressjs 应用程序。为此，我遵循了官方的 Microsoft 文档。

用户登录就像一个魅力。

但现在我必须访问用户的个人资料，最重要的是用户名。我尝试了很多解决方案，但没有任何效果。

例如，在 中，我按照这里 的建议进行了server.js尝试。但这不起作用，在我在这里链接的线程中，有人说它只适用于版本“^0.2.4”。试过这个，但 npm 找不到这个版本。this.app.getUser();this.app.getAccount();

正如这个答案中所建议的，我还在 Azure AD 中为我的应用程序设置了family_name和general_name，但我不知道如何从令牌中获取信息。因为在 Chrome 开发者工具中，没有发送包含这些信息的 Token。

这是我到目前为止所拥有的：

由于我使用express.jsReact 作为前端：我应该更好地使用msal-react吗？我想避免这种情况，因为这不是微软官方支持的。

AM 试图获取 MSAL 的访问令牌以传递给我们的后端 API（最终调用 APP Search）。由于访问令牌来自 msal 承诺，我无法在全局某处初始化令牌并在其他函数中访问。有没有办法等到承诺完成？

这是一些代码：

使用此代码，出现以下错误：

Events.js:16 Uncaught 未提供 onSearch 处理程序，也未提供连接器。您必须配置其中一个。

任何想法，关于如何将访问令牌传递给 App 连接器？

我有一个 AAD 注册应用程序，在 API 权限刀片下有 2 个范围（Graph.API：User.Read 和自定义 API：user_impersonation）。

这两个范围都已标记为“无需管理员同意”，并且状态显示为“已授予”。

现在尽管如此，当我尝试获取范围的静默访问令牌时看到“invalid_grant：AADSTS65001”：[“User.Read”，“user_impersonation”]。

请注意，我能够获得 ["User.Read"] 的访问令牌就好了。另外，请注意：因为我的 API 权限范围已被授予并且不需要管理员同意，所以我的源代码不会发出任何授权请求。

请告知这里可能是什么问题。