IAV navigated to an unexpected page and was cancelled Angular 9 Integration

Hello I am in need of some help to fix this problem. When running in https I am getting the following error:

I am able to generate a unique IAV token each time for the user. However, when I go to use the token in dwolla.iav.start I am not having any luck as shown in error above ^

Here is my code in Angular 9:

Angular Service

    getUserIAVToken(headers) {
        return this.httpClient.get<any>('https://api.payouttt.com/auth/api/generate/iav_token/', {headers});
      }

this.accountService.getUserIAVToken(this.headers).subscribe(iavToken => {
        myTest(JSON.stringify(iavToken));
      });

HTML

<div id="mainContainer">
          <input type="button" id="start" value="Add Bank">

JavaScript

function myTest(iavtoken) {
  (function ($) {
    $(document).ready(function () {
      $('#start').click(function () {
        console.log(iavtoken);
        dwolla.iav.start(iavtoken, {
          container: 'iavContainer',
          stylesheets: [
            'https://fonts.googleapis.com/css?family=Lato&subset=latin,latin-ext'
          ],
          microDeposits: false,
          fallbackToMicroDeposits: true,
          backButton: true,
          subscriber: ({currentPage, error}) => {
            console.log('currentPage:', currentPage, 'error:', JSON.stringify(error))
          }
        }, function (err, res) {
          console.log('Error: ' + JSON.stringify(err) + ' -- Response: ' + JSON.stringify(res));
        });

      });
    });
  })(jQuery);
}