Ajax - Bad request to Restfull api

996 views Asked by At

I need to make request to an rest api that I create based on an tutorial, and I have this ability for /register:

URL     /register
Method  POST
Params  name, email, password

I write this ajax request:

$(function() { 
    $('#createPin').click(function(e) { 
        e.preventDefault();

 var reg= { "email":"[email protected]", "name":"Mile","password": "facebook" }      
var urlAjax = "http://www.agroagro.com/test/v1/register";

$.ajax({
type: "POST",
url: urlAjax,
contentType: "application/json",
data: JSON.stringify(reg),
  crossDomain:true, 
  success: function(data) { alert("ajax worked"); },
error: function(data) {console.log(data); },
dataType: 'html',
beforeSend: function (xhr) {
            xhr.setRequestHeader("Access-Control-Allow-Origin", "*");
        },
        headers: {
            'Access-Control-Allow-Origin': '*'
        }
});


}); 
});

I also try just: data: reg, but in both cases I get:

 POST http://agroagro.com/test/v1/register 400 (Bad Request)

and:

XHR finished loading: POST "http://agroagro.com/test/v1/register".jquery-latest.min.js:4 sendjquery-latest.min.js:4 m.extend.ajaxtest.html:115 (anonymous function)jquery-latest.min.js:3 m.event.dispatchjquery-latest.min.js:3 r.handle
test.html:122 Object {readyState: 4, getResponseHeader: function, getAllResponseHeaders: function, setRequestHeader: function, overrideMimeType: function…}abort: function (a){var b=a||u;return i&&i.abort(b),x(0,b),this}always: function (){return e.done(arguments).fail(arguments),this}complete: function (){if(h){var d=h.length;!function f(b){m.each(b,function(b,c){var d=m.type(c);"function"===d?a.unique&&k.has(c)||h.push(c):c&&c.length&&"string"!==d&&f(c)})}(arguments),b?e=h.length:c&&(g=d,j(c))}return this}done: function (){if(h){var d=h.length;!function f(b){m.each(b,function(b,c){var d=m.type(c);"function"===d?a.unique&&k.has(c)||h.push(c):c&&c.length&&"string"!==d&&f(c)})}(arguments),b?e=h.length:c&&(g=d,j(c))}return this}error: function (){if(h){var d=h.length;!function f(b){m.each(b,function(b,c){var d=m.type(c);"function"===d?a.unique&&k.has(c)||h.push(c):c&&c.length&&"string"!==d&&f(c)})}(arguments),b?e=h.length:c&&(g=d,j(c))}return this}fail: function (){if(h){var d=h.length;!function f(b){m.each(b,function(b,c){var d=m.type(c);"function"===d?a.unique&&k.has(c)||h.push(c):c&&c.length&&"string"!==d&&f(c)})}(arguments),b?e=h.length:c&&(g=d,j(c))}return this}getAllResponseHeaders: function (){return 2===t?f:null}getResponseHeader: function (a){var b;if(2===t){if(!j){j={};while(b=Cc.exec(f))j[b[1].toLowerCase()]=b[2]}b=j[a.toLowerCase()]}return null==b?null:b}overrideMimeType: function (a){return t||(k.mimeType=a),this}pipe: function (){var a=arguments;return m.Deferred(function(c){m.each(b,function(b,f){var g=m.isFunction(a[b])&&a[b];e[f[1]](function(){var a=g&&g.apply(this,arguments);a&&m.isFunction(a.promise)?a.promise().done(c.resolve).fail(c.reject).progress(c.notify):c[f[0]+"With"](this===d?c.promise():this,g?[a]:arguments)})}),a=null}).promise()}progress: function (){if(h){var d=h.length;!function f(b){m.each(b,function(b,c){var d=m.type(c);"function"===d?a.unique&&k.has(c)||h.push(c):c&&c.length&&"string"!==d&&f(c)})}(arguments),b?e=h.length:c&&(g=d,j(c))}return this}promise: function (a){return null!=a?m.extend(a,d):d}readyState: 4responseText: "{"error":true,"message":"Required field(s) name, email, password is missing or empty"}"setRequestHeader: function (a,b){var c=a.toLowerCase();return t||(a=s[c]=s[c]||a,r[a]=b),this}state: function (){return c}status: 400statusCode: function (a){var b;if(a)if(2>t)for(b in a)q[b]=[q[b],a[b]];else v.always(a[v.status]);return this}statusText: "Bad Request"success: function (){if(h){var d=h.length;!function f(b){m.each(b,function(b,c){var d=m.type(c);"function"===d?a.unique&&k.has(c)||h.push(c):c&&c.length&&"string"!==d&&f(c)})}(arguments),b?e=h.length:c&&(g=d,j(c))}return this}then: function (){var a=arguments;return m.Deferred(function(c){m.each(b,function(b,f){var g=m.isFunction(a[b])&&a[b];e[f[1]](function(){var a=g&&g.apply(this,arguments);a&&m.isFunction(a.promise)?a.promise().done(c.resolve).fail(c.reject).progress(c.notify):c[f[0]+"With"](this===d?c.promise():this,g?[a]:arguments)})}),a=null}).promise()}__proto__: Object

Why what is the problem... also /register dont need autentification. How to properly add ajax request? I try to make request with Chrome Advanced REST client extension and there is all fine.

With Chrome Advanced REST client: https://i.stack.imgur.com/XnZCX.png - all work FINE. What is bad in my ajax request?

Update: I try also:

data: JSON.stringify({
                    name: "Mile2",
                    email: "[email protected]",
                    password: "facebook"
                }),

dataType: 'text', 

but again is BAD request

1

There are 1 answers

2
kamoor On BEST ANSWER

Please make sure the server supports cross domain communication for POST method. CORS Documentation