Skip to content

Commit 8234f56

Browse files
committed
Puts docs directly into the repo (who needs a wiki?). Inspired by what I saw in @cowboy's grunt repo. So simple I feel stupid not having thought about it before.
1 parent 1b93327 commit 8234f56

File tree

3 files changed

+285
-3
lines changed

3 files changed

+285
-3
lines changed

README.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
## About
1+
# jQuery-JSONP
22

33
jQuery-JSONP is a compact (1.8kB minified), yet feature-packed, alternative solution to jQuery's implementation of JSONP.
44

@@ -33,5 +33,5 @@ jQuery-JSONP has also been tested with jQuery 1.3.x up to 1.7.x
3333

3434
## Documentation
3535

36-
* [API Documentation](/jaubourg/jquery-jsonp/wiki/API)
37-
* [Tips & Tricks](/jaubourg/jquery-jsonp/wiki/TipsAndTricks)
36+
* [API Documentation](/jaubourg/jquery-jsonp/blob/master/doc/API.md)
37+
* [Tips & Tricks](/jaubourg/jquery-jsonp/blob/master/doc/TipsAndTricks.md)

doc/API.md

Lines changed: 158 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,158 @@
1+
# API
2+
3+
## `jQuery.jsonp( options )`
4+
5+
### Overview
6+
7+
Loads a remote JSON object using a JSONP request.
8+
9+
`$.jsonp()` returns the extended options (the `xOptions` object) for the query (that is an object containing all the options passed to the function plus defaults for those not provided). In most cases you won't need `xOptions` to manipulate directly, but it is available if you need to abort the request manually (`xOptions` provides an `abort()` method to that end).
10+
11+
*_As of version 2.3.0, if you use jQuery-JSONP with jQuery 1.5+, the `xOptions` object is a Promise. See [jQuery's documentation](http://api.jquery.com/deferred.promise/) for more information on Promises and Deferreds._*
12+
13+
`$.jsonp()` takes one argument, an object of key/value pairs, that are used to initialize and handle the request. All options are optional. A default can be set for any option with `$.jsonp.setup()`. See below for a full list of the key/values that can be used.
14+
15+
### Options
16+
17+
#### beforeSend - `function` (`undefined`)
18+
19+
A function called before the request is even performed. You may return `false` in the callback to cancel the request.
20+
21+
```js
22+
function (xOptions) {
23+
this; // the xOptions object or xOptions.context if provided
24+
}
25+
```
26+
27+
#### cache - `boolean` (`false`)
28+
29+
If set to `false` it will force the data that you request not to be cached by the browser, unless the `pageCache` option is set to true.
30+
31+
#### callback - `string` (`"_jqjsp"`)
32+
33+
Name of the JSONP callback as provided in the request url. Most of the time, you won't have to change this value but some JSONP providers have a predefined callback name that cannot be overidden. Set the name of said callback in the `callback` option and `$.jsonp` will catch the call.
34+
35+
*_As of version 2.0, the library defines a function for the callback in the global scope, so it is no longer safe to use the name of a function already defined: said function will be redefined by jQuery-JSONP._*
36+
37+
*_On the other hand, it is still perfectly safe to have several concurrent requests using the same callback name: in that case, jQuery-JSONP ensures no collision occurs internally._*
38+
39+
#### callbackParameter - `string` (`undefined`)
40+
41+
*_as of version 1.0.1_*
42+
43+
If provided, specifies the name of the url parameter that conveys the callback name to the service.
44+
45+
Example:
46+
47+
```js
48+
$.jsonp({
49+
url: "http://service.org/path?param1=xx&param2=xx",
50+
callbackParameter: "callback"
51+
});
52+
```
53+
54+
is strictly equivalent to:
55+
56+
```js
57+
$.jsonp({
58+
url: "http://service.org/path?param1=xx&param2=xx&callback=?"
59+
});
60+
```
61+
62+
#### charset - `string` (`undefined`)
63+
64+
*_as of version 2.1.1_*
65+
66+
Forces the request to be interpreted as a certain charset. Only needed for charset differences between the remote and local content.
67+
68+
#### complete - `function` (`undefined`)
69+
70+
A function to be called when the request finishes (after success and error callbacks are executed). The function gets passed two arguments: The `xOptions` object and a string describing the type of completion of the request (`"success"`, `"error"` or `"timeout"`).
71+
72+
```js
73+
function (xOptions, textStatus) {
74+
this; // the xOptions object or xOptions.context if provided
75+
}
76+
```
77+
78+
#### context - `object` (`undefined`)
79+
80+
*_as of version 2.1.1_*
81+
82+
This object will be made the context of all `xOptions`-related callbacks. For example specifying a DOM element as the context will make it the context for the complete callback of a request, like so:
83+
84+
```js
85+
$.jsonp({
86+
url: "test.php?callback=?",
87+
context: document.body,
88+
complete: function() {
89+
$(this).addClass("done");
90+
}
91+
});
92+
```
93+
94+
#### data - `object | string` (`undefined`)
95+
96+
Data to be sent to the server. It is converted to a query string, if not already a string, and then appended to the url. Object must be key/value pairs. If value is an array, jQuery serializes multiple values with same key i.e. `{ foo: [ "bar1", "bar2" ] }` becomes `"&foo=bar1&foo=bar2"`.
97+
98+
#### dataFilter - `function` (`undefined`)
99+
100+
A function to be used to handle the raw responsed JSON object. This is a pre-filtering function to sanitize the response. You should return the sanitized data. The function gets one argument: The raw JSON object returned from the server.
101+
102+
```js
103+
function (json) {
104+
// do something
105+
// return the sanitized json
106+
return json;
107+
}
108+
```
109+
110+
#### error - `function` (`undefined`)
111+
112+
A function to be called if the request fails. The function is passed two arguments: The `xOptions` object and a string describing the type of error that occurred. Possible values for the second argument are `"error"` (the request finished but the JSONP callback was not called) or `"timeout"`.
113+
114+
```js
115+
function (xOptions, textStatus) {
116+
this; // the xOptions object or xOptions.context if provided
117+
}
118+
```
119+
120+
#### pageCache - `boolean` (`false`)
121+
122+
If set to true, will override the `cache` option and provide a page based caching of the result of the request. Whenever another request is made later on with `pageCache` set to `true` and with options inducing the exact same final url for the request, the cached response is used and no distant call is actually made.
123+
124+
Lifetime of this cache is page-based which means it gets erased at each page reload.
125+
126+
#### success - `function` (`undefined`)
127+
128+
A function to be called if the request succeeds. The function gets passed two arguments: The JSON object returned from the server and a string describing the status (always `"success"`).
129+
130+
```js
131+
function (json, textStatus) {
132+
this; // the xOptions object or xOptions.context if provided
133+
}
134+
```
135+
136+
#### timeout - `number` (`0`)
137+
138+
If greater than `0`, sets a local timeout (in milliseconds) for the request. This will override the global timeout, if one is set via `$.jsonp.setup`. For example, you could use this property to give a single request a longer timeout than all other requests that you've set to time out in one second.
139+
140+
#### traditional - `boolean` (`false`)
141+
142+
*_as of version 2.0.2_*
143+
144+
Set this to true if you wish to use the traditional style of [param serialization](http://api.jquery.com/jQuery.param/).
145+
146+
#### url - `string` (`location.href`)
147+
148+
The URL to request. If more than one `?` character is found in the url, the latest will be replaced by the value of the `callback` option. Note that, given this rule, no valid url can have more than two `?` characters.
149+
150+
## `jQuery.jsonp.setup( options )`
151+
152+
### Overview
153+
154+
Setup global settings for JSONP requests.
155+
156+
### Options
157+
158+
See $.jsonp for a description of all available options.

doc/TipsAndTricks.md

Lines changed: 124 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,124 @@
1+
# Tips & Tricks
2+
3+
## Basic example
4+
5+
Get user profiles from [YouTube](http://www.youtube.com/):
6+
7+
```js
8+
function getProfile(userId) {
9+
10+
$.jsonp({
11+
"url": "http://gdata.youtube.com/feeds/api/users/"+userId+"?callback=?",
12+
"data": {
13+
"alt": "json-in-script"
14+
},
15+
"success": function(userProfile) {
16+
// handle user profile here
17+
},
18+
"error": function(d,msg) {
19+
alert("Could not find user "+userId);
20+
}
21+
});
22+
}
23+
```
24+
25+
## Callback name is not in the url parameters
26+
27+
By default, $.jsonp() uses "_jqjsp" as the callback name. You then just have to put "_jqjsp" where the callback name is supposed to be in the url.
28+
29+
```js
30+
"http://weird-provider.org/_jqjsp/my-service?param1=1&param2=2&..."
31+
```
32+
33+
If you find it confusing or unreadable to have _jqjsp buried inside the url, you can always use the callback option to use a different name and do something like this:
34+
35+
```js
36+
$.jsonp({
37+
url: "http://weird-provider.org/XXXXXXXX/my-service?param1=1&param2=2&...",
38+
callback: "XXXXXXXX",
39+
success: function(json) {
40+
// This will be called in case of success no matter the callback name
41+
},
42+
error: function() {
43+
// This will be called in case of error no matter the callback name
44+
}
45+
});
46+
```
47+
48+
## Provider calls a specific callback and I can't override its name in the url
49+
50+
Thankfully, $.jsonp() can handle the situation and you won't have to create a function that's named after the callback and is supposed to handle every response received from this provider.
51+
52+
Say services of _lazy-provider.org_ all call the same callback: _lazyCallback_. All you have to do is something like this:
53+
54+
```js
55+
$.jsonp({
56+
url: "http://lazy-provider.org/a-service?param1=1&param2=2&...",
57+
callback: "lazyCallback",
58+
success: function(json) {
59+
// Will be given the response of 'a-service'
60+
},
61+
error: function() {
62+
// Will be notified of an error requesting 'a-service'
63+
}
64+
});
65+
66+
$.jsonp({
67+
url: "http://lazy-provider.org/another-service?param1=1&param2=2&...",
68+
callback: "lazyCallback",
69+
success: function(json) {
70+
// Will be given the response of 'another-service'
71+
},
72+
error: function() {
73+
// Will be notified of an error requesting 'another-service'
74+
}
75+
});
76+
```
77+
78+
Both requests can be sent concurrently and $.jsonp() ensures that no collision will ever occur.
79+
80+
## How do I take advantage of the cache?
81+
82+
$.jsonp handles two types of cache. One is browser based, the other is page based.
83+
84+
### Browser cache
85+
86+
Usual JSONP implementations rely on generated callback names to allow concurrent JSONP requests. $.jsonp does not. No matter the situation, provided you don't change it in the options, the callback will always be "_jqjsp". This means that the url used to perform the request is exactly the same from one call to another for the same set of parameters. In that case, "smart" Data APIs can issue a _304: Not Modified_ HTTP response, asking browsers to retrieve the previous response they obtained for the same url from cache.
87+
88+
This is not an exact science. [YouTube](http://www.youtube.com/), for instance, does not always issue a _304_ but when it does eventually, it means further JSONP requests will not involve any network traffic.
89+
90+
To take advantage of browser caching, you have to set the _cache_ option to true. For 1instance:
91+
92+
```js
93+
$.jsonp({
94+
url: "...",
95+
cache: true,
96+
success: function(json) {
97+
// your success code here
98+
},
99+
error: function() {
100+
// error handling goes here
101+
}
102+
});
103+
```
104+
105+
### Page-based cache
106+
107+
Some providers just ignore situations when the callback name has not changed. In this case, you can use the page-based cache. This cache is stored in the javascript VM memory and ensures that, when you make a request that has been answered previously, you will get the exact same response and no network traffic will occur.
108+
109+
This cache is wiped out as soon as the page is reloaded.
110+
111+
To take advantage of page-based caching, you have to set the _pageCache_ option to true. Note that doing so overiddes any setting the _cache_ option could have and it is then also considered to be true. For instance:
112+
113+
```js
114+
$.jsonp({
115+
url: "...",
116+
pageCache: true,
117+
success: function(json) {
118+
// your success code here
119+
},
120+
error: function() {
121+
// error handling goes here
122+
}
123+
});
124+
```

0 commit comments

Comments
 (0)