Can someone explain the difference between Ajax and rest?

Question

AJAX

Asynchronous Javascript and XML". Ajax loosely defines a set of
technologies to help make web applications present a richer user
experience. Data updating and refreshing of the screen is done
asynchronously using javascript and xml (or json or just a normal http POST)

REST

"Representational State Transfer". Applications using REST principles have a Url structure and a request/response pattern that revolve around the use of resources. In a pure model, the HTTP Verbs Get, Post, Put and Delete are used to retrieve, create, update and delete resources respectively. Put and Delete are often not used, leaving Get and Post to map to select (GET) and create, update and delete (POST)

I'm really confused about these terms, I code websites with Symfony2 and everything always works, but as soon as my boss asks me how I did it I don't really know the words to use to explain it.It might be because I started all this as a hobby and spent my life concentrating on the practical parts.

Lets say I have this code on the client side (javascript):

       function image_remover(myimageId,path)
        {   
            // creating xmlhttprequest using ajax
            var xml = ( window.XMLHttpRequest ) ?
                   new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");
    
            xml.open("GET", path+"?imageId="+myimageId, true);  
            xml.setRequestHeader("Content-type", "application/json"); 
    
            xml.onreadystatechange = function() 
            {
                if( xml.readyState === 4 &&
                    xml.status     === 200 )
                {
                    var serverResponse = JSON.parse(xml.responseText); 
                     switch(serverResponse.d)
                     {
                       // do stuff
                     }
                }
            } 
            xml.send(null);   
        }

And this on the server side (PHP / Symfony2 Controller with annotations)

        /**
        *@Route("/removeImage",name="image_remover")
        */
        public function removeImageAction(Request $request)
        {
            //If user is not logged in..
            if (false === $this->get('security.context')->isGranted('ROLE_USER')) 
            {          
                //ip block 
                return new Response("an error has occured");
            }
    
             
            //My requests
            $current_imageId = intval($request->query->get('imageId')); 
            
            //Getting image repository
            $em = $this->getDoctrine()->getManager();
            $db_myimage = $em->getRepository('GabrielUploadBundle:Image')->findOneById($current_imageId); 
            
            //if image was found
            if($db_myimage)
            {
                //Owner of this image 
                $imageowner = $db_myimage->getImageowner();
    
                //Getting user name
                $user = $this->getUser();
                $current_username = $user->getUsername();    
    
                // is username == imageowner? if not = block ip
                if($current_username == $imageowner) 
                {
                    //remove image from database
                    $em->remove($db_myimage);
                    $em->flush();
    
                    // d = deleted y = yes
                    $response = array("d"=>1);    
                    return new Response(json_encode($response));
                }
                else
                {
                    //ip block
                    $response = array("d"=>0);
                    return new Response(json_encode($response));
                } 
            }
            else
            {
                //image object not found
                //d = deleted, n = not found
                $response = array("d"=>0);
                return new Response(json_encode($response));
            }
        }
    }  

At what part of this code did I use REST? What part is AJAX? did I even use REST?

Solution

I will not comment on your code in detail, but:

AJAX basically refers to making asynchronous request in JavaScript, traditionally sending/receiving XML (although nowadays, JSON is often used instead of XML). So that's the technique you use on client-side.

REST is a concept for HTTP request exchange, so you're making RESTful request calls (e.g. 'get') against the REST-API you implemented on server side.

See: Is AJAX a Rest api

And you might want read a little bit up about REST and AJAX on Wikipedia and other easy-to-access information sources.

Comments

[Jorge Y. C. Rodriguez]

are you sure this question bellows here? but either way Ajax-Javascript-Client side, is just talking to the server with out having to reload the application, this passes some parameters, you are using a REST service, since you post and get a result in json, xml, from the php function being called..

[imkrisna]

AJAX is like the postman who bring your mail envelope (REST) which contain the letter you want to read. The postman can be something else like Socket or cURL, and Envelope also can be something else such as SOAP

[user254883]

So ajax means exchanging JSON/XML data while REST is something like "GET /url?id=something" on the server?

[Trunk]

AJAX is a library to facilitate asynchronous communication between a website viewer and the site's server. For example, when someone signs up to a website AJAX is often used to get validation of a username, email address or phone number immediately after it's entered on the form rather than wait for the entire form's data to be submitted.

[Trunk]

REST is a protocol to enable transfer of data between 2 different web servers. For example, if you have a hotel website that allows users to see the current week's weather and tide data to enable guests to plan suitable activities. You want weather charts and tide tables to be extracted from other websites and inserted into the hotel's 'Guest Info' web page.

[Trunk]

So to answer your question, the first part of your code (the bit on the client side) is the AJAX part as it uses the XMLHttpRequest object and its methods. The second piece of code (the bit on the server) is the REST part call to another website. I must agree with you that these formal definitions on the web often obscure more than they enlighten. I know that when a technique or protocol is tested it must be formalized. But we all know that the origination process works on simple concepts, everyday language and elaborate effort, not complex, formally-defined concepts nor elegant reasoning !