34 JSON
pop1040 edited this page 3 years ago

<-back to home

JSON api

How it works

The front end and back end communicate via HTTP POST requests where the front end, a web page, uses AJAX to send a JSON object in string form to the backend, which responds with another JSON object formatted as a string containing the response. For example:

Stage 1: The front end wants to make a request

The front end calls the JavaScript function request(input, callback) (A JavaScript function I wrote) which it gives an object that contains the request information and a function to be called with the response Object as the argument. Example:

request({action:'searchComments',name:'some user name we are searching for',text:'some text idk'}, (response)=>{
   console.log(response.text);
}

This causes the request function to make an HTTP POST requests to /api containing that JavaScript object formatted as a String.

This is what that would look like in wireshark (without all the normal BS):

POST /api HTTP/1.1
Host: wishlist.cosi.clarkson.edu
Content-Type: application/json
Content-Length: 95

{"action":"searchComments","name":"some user name we are searching for","text":"some text idk"}

You can see the JSON String as the body section of the HTTP POST request (Fun fact: you can telnet at wishlist/ with the command telnet wishlist.cosi.clarkson.edu 80 and paste this directly in and it will respond)

Stage 2: The back end responds

The back end then responds to this request with a JSON string containing the response. This is what that would look like in wireshark (without all the normal BS):

HTTP/1.1 200 OK
Date: Mon, 04 Feb 2019 03:21:21 GMT
Server: Apache/2.4.25 (Debian)
Content-type: application/json
Content-length: 31

{"comments":[],"success":true}

In this case no comments were returned because no one has commented with the name "some user name we are searching for". The callback function we provided earlier is now called with a JavaScript object with the field comments set to an empty array and success set to a boolean true

All supported 'actions' and how they work

Different types of packets are referred to as 'actions'. You specify which action you would like to perform by setting this string in the JSON object you send to the server. The currently supported actions are as follows:

Action Explination
searchComments get a list of all comments, or search by username and/or comment text
addComment add a new comment
editComment edit an existing comment's text
deleteComment delete a comment

All actions must have the "action" String set to one of the actions above to specify what type of action is being performed.

searchComments

This is how you get all comments or search for a specific comment. If you don't want to search and just get all comments you simply give a blank string for the name and text field. The following fields are used for this action

field type requeired purpose
name string no specifies text the name must contain
text string no specifies text the comment must contain

Example JSON request:

{
    "action":"searchComments",
    "name":"<insert username to search for here>",
    "text":"<insert text to search for here>"
}

Returns a boolean success set to true and an array of objects each of which are for one comment. Each object contains three fields:

field type purpose
name string name of user who posted comment
text string comment text
id int id of the comment, used to refrence a comment when deleting or editing

Example JSON response:

{
    "success":true,
    "comments":[
        {
            "text":"Some comment text",
            "name":"Some random person",
            "id":27
        },
        {
            "text":"Another random comment",
            "name":"Another random person",
            "id":36
        }
    ]
}

addComment

Adds a comment. Takes a username and the text commented.

field type requeired purpose
name string yes username for comment
text string yes comment text
{
    "action":"addComment",
    "name":"<insert username for comment>",
    "text":"<insert text for comment>"
}

Returns the boolean success which is set to true and nothing else.

Example JSON response:

{
    "success":true
}

editComment

Edits an existing comment. Takes a comment id and the new text.

field type requeired purpose
id int yes id of comment to edit (this known because of the search comments action
newText string yes new text for the comment
{
    "action":"editComment",
    "id": 27,
    "newText":"<insert new text for comment>"
}

Returns the boolean success which is set to true and nothing else.

Example JSON response:

{
    "success":true
}

deleteComment

Deletes a comment. Takes a comment id.

field type requeired purpose
id int yes id of comment to delete (this known because of the search comments action
{
    "action":"deleteComment",
    "id": 27
}

Returns the boolean success which is set to true and nothing else.

Example JSON response:

{
    "success":true
}