Harvest Oauth2 Authentication Flow failing for Custom UI

Forge Forge UI Kit and Custom UI
,
1

I’m new to Forge application development and react and i’m trying to create a custom ui for jira that connects to Harvest Authentication – Harvest API V2 Documentation

Below is my code but it isn’t working as expected and is returning the html of a harvest webpage rather than token information. i’m completely stuck.

Any help would be much appreciated

Manifest

modules:
  jira:issueGlance:
    - key: harvest-custom-ui-hello-world-glance
      resource: main
      resolver:
        function: resolver
      viewportSize: medium
      title: harvest-custom-ui
      label: Custom UI
  function:
    - key: resolver
      handler: index.handler
      providers:
        auth:
          - harvest
resources:
  - key: main
    path: static/hello-world/build
app:
  id: ari:cloud:ecosystem::app/13636d29-3bf4-47bd-9f13-3046c009e783
permissions:
  scopes:
    - read:jira-work
    - write:jira-work
    - write:issue:jira
    - write:issue-worklog:jira
    - write:issue-worklog.property:jira
    - read:application-role:jira
    - read:group:jira
    - manage:jira-project
    - manage:jira-configuration
  external:
    fetch:
      client:
        - api.harvestapp.com
        - id.getharvest.com
      backend:
        - api.harvestapp.com
        - id.getharvest.com
        - https://id.getharvest.com
        - https://api.harvestapp.com
providers:
  auth:
    - key: harvest
      name: Harvest
      scopes:
        - 'harvest:all'
        - 'https://id.getharvest.com/api/v2/accounts'
      type: oauth2
      clientId: YWJ5SmJTHnzG6rAGum9aDzKa
      remotes:
        - harvest-auth
      bearerMethod: authorization-header
      actions:
        authorization:
          remote: harvest-auth
          path: /oauth2/authorize
        exchange:
          remote: harvest-api
          path: /api/v2/oauth2/token
          resolvers:
            accessTokenExpires: expires_in
        retrieveProfile:
          remote: harvest-api
          path: /api/v2/accounts
          resolvers:
            id: user.id
            displayName: user.email
remotes:
  - key: harvest-auth
    baseUrl: https://id.getharvest.com
  - key: harvest-api
    baseUrl: https://api.harvestapp.com

index.js resolver

resolver.define('accessHarvest', async (req) => {
  console.log("access start");

  const harvest = await api.asUser().withProvider('harvest', 'harvest-auth');
  if (!await harvest.hasCredentials()) {
      console.log("request");
        await harvest.requestCredentials()
  }
  if (await harvest.hasCredentials()) {

    const creds = harvest.listCredentials();
    console.log(creds);
    console.log("start auth fetch");
    const response = await harvest.fetch('/oauth2/authorize?client_id=YWJ5SmJTHnzG6rAGum9aDzKa&response_type=code');

    const data = await response;

    console.log(data);
    console.log("harvest:",harvest);
    console.log("break");
    console.log("json:", JSON.stringify(data, null, 2));
    console.log("headers:", JSON.stringify(data.headers, null, 2));
     return {
       status: response.status,
       statusText: response.statusText,
       text: await response.text(),
     }
   }
 }
);
2

Which part is returning the HTML?

If you made these calls from your local computer (something like Postman) do they work as expected?

If you still see the HTML even locally then this might be a better question for Harvest to answer.

3

The problem is you’re fetching the OAuth authorize page with this request.

const response = await harvest.fetch('/oauth2/authorize?client_id=YWJ5SmJTHnzG6rAGum9aDzKa&response_type=code');

It’s supposed to return HTML because it’s meant to be displayed in a browser. Is that a mistake on your part? Sure seems like it because Forge is supposed to handle that for you. You aren’t supposed to implement the OAuth Authorize/Token exchange which is what it looks like you’re trying to do.

Instead, at that point in your flow, you can make requests to the REST endpoints.