XSRF with AngularJS: DocuSign API Embedded View Client-Side

XSRF with AngularJS: DocuSign API Embedded View Client-Side implementation

本文关键字:Embedded View Client-Side API DocuSign with AngularJS XSRF      更新时间:2023-09-26

我有一个AngularJS应用程序,该应用程序利用DocuSign Embedded Signing REST API在用户完成表单后打开一个包含嵌入文档的选项卡。

我已经浏览了StackOverflow的一些主题来提供帮助,但我找不到任何像我的实现一样的东西。

我在登录时继续收到 401 错误,我很确定这是因为 CORS 被阻止。任何帮助不胜感激!

这是我的DocuSign工厂:

app.factory('dsFactory', function($http) {
  return {
    login: function(templateId) {
      return $http({
        url: 'https://demo.docusign.net/restapi/v2/login_information',
        method: 'GET',
        params: {
          'X-DocuSign-Authentication': {
            'DocuSignCredentials': {
              'UserName': 'xxx',
              'Password': 'xxx',
              'IntegratorKey': 'xxx'
            }
          }
        }
      });
    },
    envelope: function(baseUrl, templateId, recipientName, templateRoleName) {
      var url = baseUrl + "/envelopes";
      return $http({
        url: url,
        method: 'POST',
        params: {
          "emailSubject": "DocuSign API call - Embedded Sending Test",
          "templateId": templateId,
          "templateRoles": [{
            "email": "xxx",
            "name": recipientName,
            "roleName": templateRoleName
          }],
          "status": "sent"
        }
      });
    },
    getUrl: function(baseUrl, envelopeId, recipientName) {
      var url = baseUrl + "/envelopes/" + envelopeId + "/views/recipient";
      return $http({
        url: url,
        method: 'POST',
        params: {
          "returnUrl": "http://www.docusign.com/devcenter",
          "authenticationMethod": "email",
          "email": "xxx",
          "userName": recipientName
        }
      });
    }
  };
});

以下是使用嵌入式文档视图打开新选项卡的承诺链:

// Elaborate promise chain for DocuSign login and document url retrieval
    loginPromise = dsFactory.login($scope.templateId);
    loginPromise.then(
      function(payload) {
        $scope.dsBaseUrl = payload.data.loginAccounts[0].baseUrl;
        envelopePromise = dsFactory.envelope($scope.dsBaseUrl, $scope.templateId, $scope.businessName, 'Signer');
        envelopePromise.then(
          function(payload) {
            $scope.dsEnvelopeId = payload.data.envelopeId;
            urlPromise = dsFactory.getUrl($scope.dsBaseUrl, $scope.dsEnvelopeId, $scope.businessName);
            urlPromise.then(
              function(payload) {
                $scope.dsCompleteUrl = payload.data.returnUrl;
                window.open($scope.dsCompleteUrl);
              },
              function(errorPayload) {
                console.log('retrieve DS url failed' + ''n');
                console.log('Status: ' + errorPayload.status);
              }
            );
          },
          function(errorPayload) {
            console.log('retrieve DS envelopeId failed' + ''n');
            console.log('Status: ' + errorPayload.status);
          }
        );
      },
      function(errorPayload) {
        console.log('DS login failed' + ''n');
        console.log('Status: ' + errorPayload.status);
      }
    );

关于如何使此集成正常工作的任何想法或帮助?

也许与标题有关?

此问题并非特定于 Angular。

  1. 如果您可以使用回调或要求目标域在"访问控制-允许源"标头中添加您的域。对于您的具体问题,我认为您不能要求DocuSign这样做。它给你留下#2。

  2. 您可以从服务器端调用 API。

Angularjs https (browser)->your server->DocuSign API>your server->browser