jsonp-modernized
A modernized package for sending jsonp requests based on promises.
This package is based on the original npm jsonp package and is ment to resolve some of its shortcomings:
- At the time of writing, the original jsonp package has been not been updated since 2016
- The original jsonp package does not handle errors properly, only waiting for timeout even if server error is encountered
- The original jsonp package does not support promises
Features
- Requests based on ES6 promises
- Proper error handling and clear error messages
- Support query parameters with optional encoding
- Fully customizable callback function and parameter names
Installation
npm i jsonp-modernized --save
Usage
Import package
// Common js
const jsonp = require('jsonp-modernized');
// ES
import jsonp from 'jsonp-modernized';
// CDN
<script src="https://unpkg.com/jsonp-modernized/dist/jsonp.min.js"></script>
Basic usage
jsonp(url, options)
.then(function(responseData) {
// Response is parsed json
console.log(responseData);
})
.catch(function(error) {
// Error contains message and previous if applicable
console.log(error);
});
Options
All options are optional
option | type | default |
---|---|---|
callbackFunction | string (min:1) | "__jp[ID]" |
callbackParameter | string (min:1) | "callback" |
timeout | integer (min:0) or false | 60000 |
parameters | object | {} |
encodeParameters | boolean | true |
callbackFunction
Generated callback function signature. [ID] is a placeholder that will be replaced with an unique id generated by the library.
callbackParameter
Name of the callback query parameter.
timeout
Request timeout in milliseconds
parameters
Request GET parameters
encodeParameters
Whether URL parameters should be url encoded
Server side implementation
The external server should look for the presence of the "callback" parameter and return a response consisting of the callback followed by parenthesis wrapped around the json response string
Simple example using php
$callback = $_GET['callback'] ?? null;
// Assume that this is a jsonp request based on the callback parameter and GET http method
if($callback !== null) {
header('Content-Type', 'application/javascript');
// Some response data
$json = json_encode([
'foo' => 'bar'
]);
echo "$callback($json)";
exit();
}
Compatibility
Since JSONP is a relatively old protocol, it should generally be more widely supported by older browsers when compared to CORS.
The following browsers have been tested manually:
browser | version |
---|---|
Chrome | 80.0.3987.87 (64-bit) |
Firefox | 72.0.2 (64-bit) |
Edge | 44.18362.449.0 |