使用带有office js helpers身份验证程序的msgraph sdk javascript时出现令牌错误

使用带有office js helpers身份验证程序的msgraph sdk javascript时出现令牌错误,javascript,microsoft-graph-api,office-js,office-js-helpers,Javascript,Microsoft Graph Api,Office Js,Office Js Helpers,我有一个使用React+TypeScript的Outlook加载项,使用Node.js进行本地调试。我正在使用office js helpers库进行身份验证,并使用msgraph sdk javascript图形客户端库。作为一名POC,我只是想通过id检索当前电子邮件的详细信息来验证我是否可以成功调用Graph。我可以成功使用office js helpers Authenticator对应用程序进行授权,并成功检索令牌 但是,当我使用图形客户端调用v1/me/messages/{ID}时,

我有一个使用React+TypeScript的Outlook加载项,使用Node.js进行本地调试。我正在使用office js helpers库进行身份验证,并使用msgraph sdk javascript图形客户端库。作为一名POC,我只是想通过id检索当前电子邮件的详细信息来验证我是否可以成功调用Graph。我可以成功使用office js helpers Authenticator对应用程序进行授权,并成功检索令牌

但是,当我使用图形客户端调用
v1/me/messages/{ID}
时,我得到:

“401 InvalidAuthenticationToken:访问令牌验证失败”

我不确定这是我使用验证器的方式有问题,还是我的外接程序或应用程序清单有问题。我的外接程序正在将这些用于
AppDomains

<AppDomains>
  <AppDomain>https://localhost:3000</AppDomain>
  <AppDomain>https://login.microsoftonline.com</AppDomain>
</AppDomains>

嗨,Eric,您是否能够验证用于调用graph的代码是否在没有外接程序部分的情况下自行正确构建?换句话说,你能把一些条目id硬编码到你试图检索邮件的部分,把它连接到一个简单的页面上,看看是否有效吗?另外,请记住,您必须使用Office.JS中的convertToRestId函数将从JSAPI获得的条目ID转换为Rest ID。我能够实现这一点。我不记得细节了,因为我在这个项目的地图上到处都是,不断地遇到新的问题,所以很难保持它们的直线。
import * as React from "react";
import { Button, ButtonType, TextField } from "office-ui-fabric-react";
import { Authenticator, Utilities, DefaultEndpoints } from "@microsoft/office-js-helpers";
import * as Graph from "@microsoft/microsoft-graph-client";

export default class GetItemOJSHelpers extends React.Component<any, any> {
  constructor(props) {
    super(props);
    this.getEmail = this.getEmail.bind(this);
    this.callGraph = this.callGraph.bind(this);
    this.getItemRestId = this.getItemRestId.bind(this);

    this.state = { graphResponse: "", accessToken: "" };
    console.log("====GetItemOJSHelpers loaded");
  }

  getEmail() {
    console.log("====getEmail(): Entered ");

    //debugger;
    // Get the access token and create a Microsoft Graph client
    let authenticator = new Authenticator();

    // register Microsoft (Azure AD 2.0 Converged auth) endpoint
    authenticator.endpoints.registerMicrosoftAuth("xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx", {
      redirectUrl: "https://localhost:3000/index.html",
      scope: "Mail.ReadWrite User.Read User.ReadBasic.All"
    });

    console.log("====getEmail(): Getting token");

    let authObject = authenticator.tokens.get("Microsoft");
    let accessToken = authObject.access_token;

    if (accessToken !== null) {
      console.log(`====getEmail(): Current cached token: ${accessToken}`);
      this.callGraph(accessToken);
      return;
    } else {
      // for the default Microsoft endpoint
      //If the user, rejects the grant to the application then you will receive an error in the catch function.
      authenticator
        .authenticate(DefaultEndpoints.Microsoft)
        .then(function(token) {
          /* Microsoft Token */
          console.log(`====getEmail(): Authenticated; auth token: ${token.access_token}`);
          accessToken = token.access_token;
        })
        .catch(function(error) {
          //debugger;
          console.log("====getEmail(): authenticate error");
          Utilities.log(error);
          throw new Error("Failed to login using your Office 365 Account");
        });
    }

    console.log(`====getEmail(): Current token: ${accessToken}`);
    this.callGraph(accessToken);
  }

  callGraph(token) {
    // Get the item's REST ID
    let itemId = this.getItemRestId();
    console.log(`====callGraph(): itemId ${itemId}`);

    const client = Graph.Client.init({
      authProvider: done => {
        done(null, token); //first parameter takes an error if you can't get an access token
      },
      debugLogging: true
    });

    client
      .api("me/messages/" + itemId)
      .version("v1.0")
      .get()
      .then(function(item) {
        //debugger;
        console.log("Email " + item.Subject + " retrieved!!!");
      })
      .then(function() {
        console.log("====callGraph(): complete");
        //debugger;
      })
      .catch(err => {
        //debugger;
        //403 Forbidden! code: "ErrorAccessDenied", message: "Access is denied. Check credentials and try again."
        //Also 401 InvalidAuthenticationToken: Access token validation failure.
        console.log(`====callGraph(): error! ${err.statusCode}:'${err.code}': ${err.message}`);
      });
  }

  getItemRestId() {
    if (Office.context.mailbox.diagnostics.hostName === "OutlookIOS") {
      // itemId is already REST-formatted
      return Office.context.mailbox.item.itemId;
    } else {
      // Convert to an item ID for API v2.0
      return Office.context.mailbox.convertToRestId(
        Office.context.mailbox.item.itemId,
        Office.MailboxEnums.RestVersion.v2_0
      );
    }
  }
  render() {
    return (
      <div>
        <Button
          id="getEmailButton"
          className="ms-welcome__action ms-bgColor-red"
          buttonType={ButtonType.primary}
          onClick={this.getEmail}
        >
          Call Graph
        </Button>
        <div>
          <h3> Access Token </h3>
          <TextField id="accessToken" />
        </div>
        <div>
          <h3>Graph API Call Response</h3>
          <TextField id="graphResponse" />
        </div>
      </div>
    );
  }
}