A wrapped jquery ajax handling, with custom request keys, response refactoring, pre handling, post handling.

requirements

• jquery
• json-refactor

quick start

1. load resources

var seeAjax = require('see-ajax');
seeAjax.doSomething

// or
 var $ = require('jquery');
$.seeAjax.doSomething

or load scripts directly

<script src="path/to/jquery"></script>
<script src="path/to/json-refactor"></script>
<script src="path/to/jquery.seeAjax"></script>
<script>
seeAjax.doSomething
// or
$.seeAjax.doSomething
</script>

2. config current application's options

seeAjax.config({...});

3. use

seeAjax.get(urlName, reqData, callback);

config options

example:

{
    env: 0/1/2/3, // environment
    name: {...},
    url: {...},
    requestKeys: {...},
    responseRefactor: {...},
    preHandle: {...},
    postHandle: {...},
    implement: {...},
    method: {...}
}

env

environment index, used to select a element of an array within url, requestKeys, responseRefactor, preHandle, postHandle, implement, method

name

url name mapping, used to get values of url, requestKeys, responseRefactor, preHandle, postHandle, implement, method

name: {
    exportName: 'inlineName'
}

url: {inlineName: []}
requestKeys: {inlineName: []}
responseRefactor: {inlineName: []}
preHandle: {inlineName: []}
postHandle: {inlineName: []}
implement: {inlineName: []}
method: {inlineName: []}

url

url to request data

url: {inlineName: [
    'url1', //env: 0
    'url2', //env: 1
    'url3', //env: 2
]}

// or
url: {
    // all environments will use this url
    inlineName: 'url'
}

requestKeys

request keys mapping

requestKeys: {inlineName: [
    {exportKey: 'realKey'}, // env: 0
    {exportKey: 'realKey'}, // env: 1
    {exportKey: 'realKey'}, // env: 2
]}

// or
requestKeys: {
    // all environments will use this map
    inlineName: {exportKey: 'realKey'}
}

responseRefactor

refactor response data, after ajax responding

responseRefactor: {
    common: []/{}, // common is system reserved keywork, this will apply to all requests
    inlineName: [
        {... refactor map ...}, // env: 0
        {... refactor map ...}, // env: 1
        {... refactor map ...}, // env: 2
    ]
}

// or 
responseRefactor: {
    // all environments will use this map
    inlineName: {... refactor map ...}
}

• refactor map: see json-refactor

preHandle

more handling after requestKeys, before ajax sending

preHandle: {
    common: (reqData) => {... do something ...}, // common is system reserved keywork, this will apply to all requests
    inlineName: [
        (reqData) => {... do something ...}, // env: 0
        (reqData) => {... do something ...}, // env: 1
        (reqData) => {... do something ...}, // env: 2
    ]
}

// or 
preHandle: {
    // all environments will use this hanlder
    inlineName: (reqData) => {... do something ...}
}

postHandle

more handling after responseRefactor

postHandle: {
    common: (res, reqData, urlName) => {... do something ...}, // common is system reserved keywork, this will apply to all requests
    inlineName: [
        (res, reqData, urlName) => {... do something ...}, // env: 0
        (res, reqData, urlName) => {... do something ...}, // env: 1
        (res, reqData, urlName) => {... do something ...}, // env: 2
    ]
}

// or 
postHandle: {
    // all environments will use this hanlder
    inlineName: (res, reqData, urlName) => {... do something ...}
}

implement

custom implement instead of ajax.

sometimes, you have not to use ajax, but other ways, for some reasons, this is what you want.

implement: {
    inlineName: [
        (res, reqData, urlName) => {... return a response ...}, // env: 0
        (res, reqData, urlName) => {... return a response ...}, // env: 1
        (res, reqData, urlName) => {... return a response ...}, // env: 2
    ]
}

// or 
implement: {
    // all environments will use this hanlder
    inlineName: (res, reqData, urlName) => {... return a response ...}
}

• note: every function should return a value, like ajax response

method

take a different http method to a special environment.

sometimes, you want to use different http method of different environment, especially PUT, DELETE, you may be in trouble when debug locally. and this is to resolve that problem, you may use GET in local, and use PUT in server.

method: {
    inlineName: [
        'delete', // env: 0, use DELETE
        'put', // env: 1, use PUT
        'post'// env: 2, use POST
        // other env, keep GET
    ]
}

seeAjax.get('inlineName', ...);

api

config

config options of current application

seeAjax.config({ ....});

getEnv

get current environment

var env = seeAjax.getEnv(); // 0/1/2/3

get

make a GET request

seeAjax.get(urlName, reqData, callback)
seeAjax.get(urlName, reqData, callback, stringify)
seeAjax.get(urlName, reqData, callback, extraOptions)
seeAjax.get(urlName, reqData, callback, stringify, extraOptions)

post

make a POST request

// like get

put

make a PUT request, this needs browser's supporting.

// like get

delete

make a DELETE request, this needs browser's supporting.

// like get

get/post/put/delete arguments

urlName

export url name, refer to option.name

reqData

request data, refer to https://api.jquery.com/jQuery.ajax/

callback

success callback, refer to https://api.jquery.com/jQuery.ajax/

stringify

whether stringify request data, default is false, and request will use application/x-www-form-urlencoded. if true, request will use a string in the body.

• note: if GET method, request data will always not be stringify.

extraOptions

extra more ajax options, refer to https://api.jquery.com/jQuery.ajax/

handlers sequences while processing

1. url: get real url
2. requestKeys: get real request data
3. preHandle: more handling before send a request
   1. common: common handling, if have
   2. yourName: named handling
4. implement: if have, return a custom response data, and will not send an ajax
5. method: check if has a different http method of current environment
6. responseRefactor: refactoring response data
   1. common: common handling, if have
   2. yourName: named handling
7. postHandle: more handling after refactoring response data
   1. common: common handling, if have
   2. yourName: named handling

demo code