Retrieve your Docusign Access Code using the typescript httpClient.post method

I am currently struggling to obtain the access token through the Docusign API. My code is producing an error in Xcode and I am unable to make it work on my native device or browser, despite successfully testing it via Postman. When attempting to run it in a browser, I encounter a CORS error, which was expected. However, I cannot understand why it fails on an iPhone.

My project utilizes Ionic and TypeScript. Most of the examples I have come across involve Express with extensive amounts of code that I find challenging to integrate into my Ionic project. If resolving this issue requires more than minor adjustments, I am open to hiring someone to assist me in getting it up and running.

Thank you

// Obtaining Docusign access token using authorization code
             const post_data = {
              'code': this.dsAuthCode,
              'grant_type': "authorization_code"
            }
    
            // HTTP Options
             const httpOptions = {
                headers: new HttpHeaders({
                  'Authorization': "Basic " + b64ds
                })
              }
    
          this.httpClient.post('https://account-d.docusign.com/oauth/token', post_data, httpOptions)
          .subscribe((data:any) => {
              this.dsAccessToken = data.access_token
              console.log('Access Token ', data.access_token)
              //this.docsignUserURI(data.access_token)
          }, error => {
              console.log('access token error', JSON.stringify(error));
          });


access token error {"headers":{"normalizedNames":{},"lazyUpdate":null,"headers":{}},"status":0,"statusText":"Unknown Error","url":"https://account-d.docusign.com/oauth/token","ok":false,"name":"HttpErrorResponse","message":"Http failure response for https://account-d.docusign.com/oauth/token: 0 Unknown Error","error":{"isTrusted":true}}

Answer №1

Currently, my process involves retrieving an access code from a web docusign popup and then passing it into a Firebase Cloud Functions callable https request using 'request-promise' to receive a promise in return.

.ts page:

async docsignAccessToken(){
   //this.dsAuthCode is a two sided [(ngModel)} on the html page
   // the docusign authorize code is pasted before running this functions
      console.log('starting access token, authcode = ', this.dsAuthCode)

      var fbdsAuth = firebase.functions().httpsCallable('dsAuth');
      fbdsAuth({dsAuthCode: this.dsAuthCode, b64ds: b64ds}).then(function(result) {
    // Read result of the Cloud Function.
    this.dsAccessToken = JSON.parse(result.data).access_token
    //this.docsignUserURI(data.access_token)
    // ...
      }).catch(function(error) {
        // Getting the Error details.
        var code = error.code;
        var message = error.message;
        var details = error.details;
        console.log(error)
        // ...
    });  

  }



firebase cloud functions:

    export const dsAuth = functions.https.onCall((data, context) => {
    
    
          var request = require('request-promise');;
          var options = {
            'method': 'POST',
            'url': 'https://account-d.docusign.com/oauth/token',
            'headers': {
              'Authorization': 'Basic ' + data.b64ds,
              'Content-Type': 'application/x-www-form-urlencoded'
            },
            form: {
              'code': data.dsAuthCode,
              'grant_type': 'authorization_code'
            }
          };
          return request(options, function (error, response) {
            if (error) throw new Error(error);
            console.log(response.body);
          });
    
        });

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Strategies for dealing with Observable inconsistencies in an Angular application

Encountering an error during the compilation of my Angular app: The error message states: Type 'Observable<Promise<void>>' is not compatible with type 'Observable<AuthResponseData>'. The issue lies in 'Promis ...

What is the process for specifying a method on a third-party class in TypeScript?

I'm facing a challenge while trying to extend a third-party class in TypeScript. The issue is that I am unable to access any existing methods of the class within my new method. One possible solution could be to redeclare the existing methods in a sep ...

What are some ways to troubleshoot the TypeScript React demonstration application in Chrome?

Debugging a TypeScript app in the Chrome debugger is a straightforward process. First, you need to configure the tsconfig.json file: "sourceMap": true, Next, install ts-node and set a breakpoint in your TypeScript code using "debugger;" ...

Alphabetic divider for organizing lists in Ionic

I am currently working with a list in ionic that is fetched from a controller and stored in localStorage. My goal is to add alphabetic dividers to the list, but I am facing some confusion on how to achieve this. Here is a snippet of the code: app.js $ion ...

Retrieve information prior to CanActivation being invoked

As I develop a web application utilizing REST to retrieve data (using Spring Boot), the server employs cookies for authenticating logged-in users. Upon user signing in, I store their information in the AuthenticationHolderService service (located in root ...

Inter-component communication within nested structures in Angular 2

Working on an Angular2 project that involves multiple nested components, I have successfully sent data from a child component to its immediate parent. However, when dealing with three levels of nesting, the question arises: How can I send or modify data ac ...

Methods for populating an object with Interface type and returning it

This is my function that populates an object based on interface type: public _fillAddModel<T>(lessonId: number, studyPeriodId: number, confirmed: boolean = false): T { let data: T; data = { lesson: this.substitution.lessonNumber, ...

Retrieve and showcase information from Firebase using Angular

I need to showcase some data stored in firebase on my HTML page with a specific database structure. I want to present the years as a clickable array and upon selecting a year, retrieve the corresponding records in my code. Although I managed to display a ...

What is the best way to divide a string into an array containing both linked and non-linked elements?

I'm struggling to find the right solution to my problem. I need to create a view that is enclosed in a clickable div. The content will consist of plain text mixed with clickable URLs - the issue arises when clicking on a link also triggers the method ...

Troubles with applying Global Themes in StyledComponents for React Native

Problem with Global Theme in StyledComponents (React Native) When attempting to utilize a color from my global theme in my component and setting it like so: background-color: ${({theme}) => theme.} The properties within theme, such as colors, font-siz ...

Getting services in a directive in AngularJS by function name: How to do it?!

I am looking for a way to incorporate a reusable pattern in my directive, such as displaying a modal with a list of data. The modal will have a method to retrieve data, which is defined in a service. The service is dynamically generated based on the parame ...

The Ins and Outs of Selecting the Correct Module to Attach a Controller in NestJS CLI

My experience with NestJS has been great so far, especially the Module system and how easy it is to parse requests. However, I have a question about the NestJS CLI. Let's say I have multiple modules. When I create a controller using the command "nes ...

Testing Slack's Web API with Jest for mock purposes

Currently, I am working with two files. One file is where I set up a slack web API client to post a message and test it with a mocked value: main.ts: import { WebClient } from '@slack/web-api'; const slack = new WebClient(process.env.SLACK_API_K ...

In TypeScript, fetch JSON data from a URL and gain access to an array of JSON objects

I'm struggling to find a solution and implement it in the correct format. An API returns a JSON file to me via a URL. The format is as follows: {"success":true, "data":[ { "loadTimestamp":"2022-07-20T ...

React TypeScript error: Cannot access property "x" on object of type 'A | B'

Just starting out with react typescript and I've encountered the following typescript error when creating components: interface APIResponseA { a:string[]; b:number; c: string | null; // <- } interface APIResponseB { a:string[] | null; b:number; d: ...

What are the steps to validate a form control in Angular 13?

My Angular 13 application has a reactive form set up as follows: https://i.sstatic.net/LE219.png I am trying to validate this form using the following approach: https://i.sstatic.net/gxpgN.png However, I encountered the following error messages: https:// ...

What is the method for opening the image gallery in a Progressive Web App (PWA)?

I am struggling to figure out how to access the image gallery from a Progressive Web App (PWA). The PWA allows me to take pictures and upload them on a desktop, but when it comes to a mobile device, I can only access the camera to take photos. I have tried ...

Please ensure that the property name is a valid type, such as 'string', 'number', 'symbol', or 'any'

Can anyone help me convert this JavaScript file to Typescript? import React, { useState } from 'react'; import { Button } from './Button'; import { Link } from 'react-router-dom'; import './Navbar.css'; import Settin ...

Tips for utilizing interpolation for conditions instead of using *ngIf

For my application, I am using two different languages and have written them within two <option> tags. Is it possible to combine both conditions into a single <option> tag using interpolation? <option *ngIf="this.language=='en&apos ...

Is there a way for me to retrieve the header values of a table when I click on a cell?

I have a project where I am developing an application for booking rooms using Angular 2. One of the requirements is to be able to select a cell in a table and retrieve the values of the vertical and horizontal headers, such as "Room 1" and "9:00". The data ...