API call over AJAX

Question

I'm new to AJAX and I want to generate a password over this API. I want to use AJAX but dont know exactly how and where to specify the parameters.

$.ajax({
    url: 'https://passwordwolf.com/?length=10&upper=off&lower=off&special=off&exclude=012345&repeat=5',
    dataType: "text json",
    type: "POST",
    data: {upper: off, lower: on, special: off},
    success: function(jsonObject,status) {

        console.log("function() ajaxPost : " + status);

    }
});

Many Thanks, Pls don't hate my programming skills!

it depends on whether the API you're calling expects the variables to be sent on the querystring (i.e. part of the URL) or in the request body (i.e. included via the `data` option). You need to check that first and then you'll know what to do. — ADyson, Mar 06 '18 at 13:41
@ADyson From looking at the URL I can tell it must be in the URL can I then leave out the data: part completely? — Gucci, Mar 06 '18 at 13:43
Yes. Also check which HTTP method the API requires you to use (i.e. GET or POST or PUT or DELETE). If you're using ajax cross-domain you also need to verify whether it supports CORS or not - if not then an ajax request won't work. — ADyson, Mar 06 '18 at 13:44
Also, having visited the URL above, which is a HTML page designed for users to view, it suggests a different API link in order to get the data in machine-readable JSON format - `https://passwordwolf.com/api/?upper=off&lower=off&special=off&length=10&exclude=012345&repeat=5` is the correct URL to call the actual API. And it should be done via a GET (since I was able to paste the URL into the browser bar and run it from there, which always causes a GET) — ADyson, Mar 06 '18 at 13:46
However, as demoed here: https://jsfiddle.net/5a2xayy2/ the API doesn't support CORS (see the error in your browser's console). So you'll have to make your request from a non-ajax context, or use the workaround shown in the answer below. — ADyson, Mar 06 '18 at 13:49

score 3 · Accepted Answer · answered Mar 06 '18 at 13:48

Having a look at their API:

You should use the GET method, not POST.
The url should be https://passwordwolf.com/api/ (notice the /api at the end).
Besides, passwordwolf doesn't accept CORS, so you should probably call that service from your server side and mirror it to your frontend with the appropriate CORS headers.

See demo below (it uses cors-anywhere to circunvent the CORS problem).

It also shows how to correctly use an object to set params.

var CORS = 'https://cors-anywhere.herokuapp.com/';

$.ajax({
  url: CORS + 'https://passwordwolf.com/api/',
  dataType: "json",
  type: "GET",
  data: {
    length: 10,
    upper: "off",
    lower: "off",
    special: "off",
    exclude: "012345",
    repeat: 5
  },
  success: function(jsonObject, status) {
    console.log("ajax result: " + JSON.stringify(jsonObject));
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

API call over AJAX

1 Answers1