I need to do a http request to a mail chimp subscription list via a component post

后端 未结 1 1589
悲&欢浪女
悲&欢浪女 2020-12-07 05:25

I need to do a http request to a mail chimp subscription list via a component post

I\'ve read the mail chimp documentation and couldnt find anything

相关标签:
1条回答
  • 2020-12-07 06:13

    I finally found out how to fix your issue. You need to use the Jsonp support of Angular2.

    Your address supports Jsonp by adding a c query parameter to your URL and switching https://mysubscriptionlist.us10.list-manage.com/subscribe/post by https://mysubscriptionlist.us10.list-manage.com/subscribe/post-json. You need to put the JSONP_CALLBACK value in it (see this issue: https://github.com/angular/angular/issues/5613).

    In this case, you will have the following response payload:

    JSONP_CALLBACK (
    {
      "result": "success",
      "msg": "Almost finished... We need to confirm your email address. To complete the subscription process, please click the link in the email we just sent you."
    }
    )
    

    After having registered JSONP_PROVIDERS when calling the bootstrap function:

    import {bootstrap} from 'angular2/platform/browser'
    import {JSONP_PROVIDERS} from 'angular2/http'
    import {AppComponent} from './app.component'
    
    bootstrap(AppComponent, [ JSONP_PROVIDERS ]);
    

    You can then execute your request using an instance of the Jsonp class you injected from constructor:

    import {Component} from 'angular2/core';
    import {Jsonp} from 'angular2/http';
    
    @Component({
      selector: 'my-app',
      template: `
        <div>
          Result: {{result | json}}
        </div>
      `
    })
    export class AppComponent {
      constructor(jsonp:Jsonp) {
        var url = 'https://mysubscriptionlist.us10.list-manage.com/subscribe/post-json?u=(...)&subscribe=Subscribe&EMAIL=my@email.com&c=JSONP_CALLBACK';
        jsonp.request(url, { method: 'Get' })
         .subscribe((res) => {
           this.result = res.json()
         });
      }
    }
    

    See this plunkr for a working sample: http://plnkr.co/edit/dqreqBL6kyNkR8Z2wgGR?p=preview

    0 讨论(0)
提交回复
热议问题