Converting a cURL command into ajax

Question

I'm trying to use the zoom.us API that is provided by the site. They give me the cURL command to create a new user:

curl --data 'api_key=your_api_key&api_secret=your_api_secret&email=user@email.com&type=1&first_name=John&last_name=Smith' https://api.zoom.us/v1/user/create

I translated to AJAX:

$.ajax({
        url: 'https://api.zoom.us/v1/user/create',
        type: "POST",
        cache: true,
        async: false,
        headers: {
            'Content-Type': 'application/json'
        },
        data: JSON.stringify({ 'api_key': 'key', 'api_secret': 'secret', 'email': 'email@email.com', 'first_name': 'John', 'last_name': 'Smith' }),
        success: function (res) {
            console.log(res);
        },
        error: function (err) {
            console.error(err);
        }
    });

(Note: the variables for 'api_key' and 'api_secret' are just placeholders in the above example. I have my own key and secret that I use when trying to make this API call)

This code does not work for me, though. I get the following 403 error:

XMLHttpRequest cannot load https://api.zoom.us/v1/user/create. 
Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. 
Origin 'http://mywebsite.com' is therefore not allowed access. The response had HTTP status code 403.

My question is this: what am I doing wrong? Is there anything I mistranslated? Also, I know that similar questions have been asked before (that's how I got came up with my translated code above), but they weren't able to resolve my issue

Here's the zoom.us documentation in case it's helpful: https://support.zoom.us/hc/en-us/articles/201363033-REST-User-API

ETA: after apokryfos's comment, here's my updated code:

$.ajax({
    url: 'https://api.zoom.us/v1/user/create',
    cache: true,
    async: false,
    data: { 'api_key': 'key', 'api_secret': 'secret', 'email': e, 'first_name': 'john', 'last_name': 'smith' },
    success: function (res) {
        console.log(res);
    },
    error: function (err) {
        console.error(err);
    }
});

Produces a new 405 error:

XMLHttpRequest cannot load api.zoom.us/v1/user/create?api_key=key&api_secret =secret&email=test%40email.com&first_name=Juan&last_name=Gon‌zalez. 
No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'website.com'; is therefore not allowed access.

POST data and JSON data are not the same thing. You should pass the object without strigifying it. Also don't change the content type. — apokryfos, Aug 24 '16 at 15:10
More commonly known as CORS (Cross-origin resource sharing). I would think you're doing things wrong if you're putting api keys / secrets on every clients machine. — Jonnix, Aug 24 '16 at 15:16
Thanks @apokryfos, that resolved my 403 error, but now I got a new 405 error: XMLHttpRequest cannot load https://api.zoom.us/v1/user/create?api_key=key&api_secret =secret&email=test%40email.com&first_name=Juan&last_name=Gonzalez. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://website.com' is therefore not allowed access. The response had HTTP status code 405. — Juan, Aug 24 '16 at 15:16
Apologies if my comment was misleading. The only part that needed removing was the JSON part. The `type: "POST"` should have remained. — apokryfos, Aug 24 '16 at 15:26

score 1 · Answer 1 · answered Aug 24 '16 at 15:33

Try once adding dataType: 'jsonp' like the bellow

    $.ajax({
    url: 'https://api.zoom.us/v1/user/create',
    cache: true,
    dataType: 'jsonp'
    async: false,
    data: { 'api_key': 'key', 'api_secret': 'secret', 'email': e, 'first_name': 'john', 'last_name': 'smith' },
    success: function (res) {
        console.log(res);
    },
    error: function (err) {
        console.error(err);
    }
});

score 0 · Accepted Answer · answered Aug 24 '16 at 17:09

0

I was able to find the correct answer thanks to @apokryfos.

$.ajax({
    url: 'https://crossorigin.me/https://api.zoom.us/v1/user/create',
    type: "POST",
    cache: true,
    async: false,
    data: { 'api_key': 'key', 'api_secret': 'secret', 'email': e, 'first_name': f, 'last_name': l },
    success: function (res) {
        console.log(res);
    },
    error: function (err) {
        console.error(err);
    }
});

}

answered Aug 24 '16 at 17:09

Juan

61
7

I would also suggest you communicate with the API provider to let them know that browsers mistakenly interpret any HTTP errors from that web service as CORS violations. There is no CORS violation here, it's just the remote server does not indicate that it is accepting CORS requests so the browser assumes the error is because of that. – apokryfos Aug 25 '16 at 08:04

Converting a cURL command into ajax

2 Answers2