How to convert this curl to jQuery AJAX POST?

Question

curl --request POST \
--url 'https://usX.api.mailchimp.com/3.0/lists/1234/members' \
--user 'username:api_key' \
--header 'content-type: application/json' \
--data '{"email_address":"user@example.com", "status":"pending"}' \
--include

I've above curl and it's working fine when I try to add subscriber to my Mailchimp list.

However, I'm not sure how to convert this curl to working jQuery AJAX POST request since I only know how to pass data to AJAX POST.

Since this curl has --user, --header and --include, I don't know how to build the correct AJAX.

Please help.

$.ajax({
    url : "https://usX.api.mailchimp.com/3.0/lists/1234/members",
    type: "POST",
    data: {email_address: "user@example.com", status: "pending"},
    // stuck here - what else should I put?
});

I see 3 answers with 3 downvotes, but no explanation as to what is going on to make them wrong. I would read the manpage for curl to understand what those properties are defined as. Could you at least comment as to why they were wrong so it is seen as justified? — Fallenreaper, Apr 16 '19 at 19:10

score 2 · Answer 1 · edited May 23 '17 at 12:01

This has already been answered in the below question.

Converting curl cmd to jQuery $.ajax().

$.ajax({
    url: "https://usX.api.mailchimp.com/3.0/lists/1234/members",
    beforeSend: function(xhr) { 
      xhr.setRequestHeader("Authorization", "Basic " + btoa("username:api_key")); 
    },
    type: 'POST',
    dataType: 'json',
    contentType: 'application/json',
    processData: false,
    data: '{"email_address": "user@example.com", "status": "pending"}',
    success: function (data) {
      alert(JSON.stringify(data));
    },
    error: function(){
      alert("Cannot get data");
    }
});

madalinivascu · Answer 2 · 2016-06-08T08:30:51.470

Try the following:

$.ajax({
    url : "https://usX.api.mailchimp.com/3.0/lists/1234/members",
    username:'username',//change this
    password:'api_key',//change this
    type: "POST",
    contentType: "application/json",
    data: {email_address: "user@example.com", status: "pending"},
    success: function(data){
         //your code to process output value from data
    }
});

or using headers

$.ajax({
        url : "https://usX.api.mailchimp.com/3.0/lists/1234/members",
        type: "POST",
        headers: {
              'Authorization':'Basic ' + btoa("username:api_key"),
              'Content-Type':'application/json'
        },
        data: {email_address: "user@example.com", status: "pending"},
        success: function(data){
             //your code to process output value from data
        }
    });

score -1 · Answer 3 · edited May 23 '17 at 11:53

Here is a question/answer about sending the user/password with jQuery:

How to use Basic Auth with jQuery and AJAX?

Use jQuery's beforeSend callback to add an HTTP header with the authentication information:

beforeSend: function (xhr) {
    xhr.setRequestHeader ("Authorization", "Basic " + btoa(username + ":" + password));
},

You can set the content-type like this:

contentType: "application/json",

--include seems to be an outputting option for curl: All HTTP replies contain a set of response headers that are normally hidden, use curl's --include (-i) option to display them as well as the rest of the document.

How to convert this curl to jQuery AJAX POST?

3 Answers3