我在Azure门户中创建了两个应用程序：一个是客户端应用程序，另一个是web api。我在SPA中获取accessToken，然后使用此令牌向web api发出请求。我为web api应用程序创建了角色，然后将其中一个角色分配给了自己。
在web api中，我可以使用decorator[Authorize(Roles = "Reader, Editor, Admin")]验证每个端点的用户角色，但我也需要在客户端应用程序中访问这些角色。我使用jwt.ms检查了这个accessToken，解析后它有"roles": ["Admin"]。但是如何使用JS在客户端应用程序中获得这些角色呢？
如果您只想从accessToken负载中提取Claims，只需尝试以下代码：
<html>
<body>
<div id="payload"></div>
</body>
<script src="https://cdn.jsdelivr.net/npm/js-base64@3.2.4/base64.min.js" ></script>
<script>
var token= "eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiIsImtpZCI6IkRJakFBSUpjNmZnMlkzd0dObkpRSEpXWjhXX1FGOG5Zd2lfVTFfOVhMejgifQ.eyJleHAiOjE1OTU1MTczNjMsIm5iZiI6MTU5NTUxMzc2MywidmVyIjoiMS4wIiwiaXNzIjoiaHR0cHM6Ly9zdGFudGVzdGIzYy5iMmNsb2dpbi5jb20vN2QzZDE4MjQtYTkyOC00ZWQ5LThlZDUtYjA0OTI5NTM4NTljL3YyLjAvIiwic3ViIjoiOGJiZDY3NDYtMDJjNy00MWE2LTk3Y2EtYzc0NWM4ZDI3YTIzIiwiYXVkIjoiNGVjZDM2MTYtM2IwNy00NjFiLTgzYjUtYmZhM2ZhZjAxYmY0IiwiYWNyIjoiYjJjXzFhX3NpZ251cF9zaWduaW4iLCJub25jZSI6ImRlZmF1bHROb25jZSIsImlhdCI6MTU5NTUxMzc2MywiYXV0aF90aW1lIjoxNTk1NTEzNzYzLCJvaWQiOiI4YmJkNjc0Ni0wMmM3LTQxYTYtOTdjYS1jNzQ1YzhkMjdhMjMiLCJuYW1lIjoic3RhbmxleSIsImdpdmVuX25hbWUiOiJnIiwiZmFtaWx5X25hbWUiOiJzdGFuIiwiZXh0ZW5zaW9uX3RuY2FjY2VwdGVkZGF0ZXRpbWUiOjE1ODk1NDk4NTUsImFjY291bnRFbmFibGVkIjp0cnVlLCJ0aWQiOiI3ZDNkMTgyNC1hOTI4LTRlZDktOGVkNS1iMDQ5Mjk1Mzg1OWMifQ.Fa5EX4b3Px5Xan_qs1a8I6DC8lLxu78AhyQu9-yqE68TCSrNt7QrAWbUPvFPC8TFErDb84FUPDvtLkVS7Q4mEM9dbAGRtxXoSkZa85TPLj6PxYmE61pONwwf971UZiFjLKjkhqVsbpC1Zbgvx5Z_vfFBlrlbxohzZHQuvBI6rqhLeZebvr9bitsIHgFvHJIh-6QgstII8ExQbXqLHzOB0E9e1nT4O7SaW4hnxEr-nKsnpsEbYZ-6LsIcR4svVyEsTp9_YoslU2hAHN0tLuJL-AR74wqUFjO79pUa3fCjiur207cEcvkthbahzeqVY-gqJGIGndZmxo3a3Rf0QEbWlg"
var token_parts = token.split(".")
var token_payload = JSON.parse(Base64.decode(token_parts[1]));
document.getElementById("payload").innerHTML = Base64.decode(token_parts[1]) + "</br> </br> name claim:" + token_payload.name;
</script>
</html>基本上，一个令牌由3个部分组成，用"分隔&"，有效载荷存储在第二部分中，您只需Base64解码即可获得其内容
atob()已弃用，您将不得不使用window.atob()或使用Buffer工具进行后端渲染