|
5 | 5 | [](https://unpkg.com/safe-jsonp/dist/safe-jsonp.umd.js)
|
6 | 6 |
|
7 | 7 |
|
8 |
| -A sandboxed JSONP implementation for browsers. |
9 |
| - |
10 |
| -# Why |
11 |
| - |
12 |
| -If for any reason you still have to use JSONP instead of ajax & CORS on a page with sensitive data to fetch data |
13 |
| -from third-party services, you can use this package which makes jsonp requests more secure using a temporary sandboxed |
14 |
| -iframe as a proxy. This could potentially protect from XSS attacks injected in the jsonp response, |
15 |
| -since the sandbox iframe does not have unsafe access to its parent page. At the same time, json data can be sent |
16 |
| -from iframe to the parent document as a simple json string using the window.postMessage feature. |
17 |
| -The package supports sandbox and non-sandbox mode (like typical jsonp packages), by default |
18 |
| -sandbox mode is preferred, but not required. |
| 8 | +:star: A safer JSONP implementation for browsers with extra features :star: |
19 | 9 |
|
20 | 10 | # Features
|
21 |
| -- :zap: **exclusive: optional sandbox mechanism for safer requests to untrusted origins (internally used iframes)** |
22 |
| -- :zap: **exclusive: ability to abort the related http request in sandbox mode- other libs can't do this at all, |
23 |
| - they just ignore the response, but related http query keeps in pending state for some time** |
24 |
| -- support Promise and callback styles |
25 |
| -- support custom Promise class |
26 |
| -- anti-caching `_rnd` query param |
27 |
| -- support query params in url string and/or options.params property |
| 11 | +- :zap: **safer requests to untrusted origins using optional sandbox mechanism\* (iframes & postMessage used inside)** |
| 12 | +- :zap: **can abort the related http requests\** (other libs just ignore the response, but related http query keeps in pending state for some time** |
| 13 | +- :heavy_check_mark: no dependencies |
| 14 | +- :heavy_check_mark: CDN friendly |
| 15 | +- supports Promise and callback styles |
| 16 | +- supports custom Promise class |
| 17 | +- supports query params in url string and/or options.params property |
28 | 18 | - automatically encoding params, converting objects and arrays params to JSON strings
|
| 19 | +- anti-caching `_rnd` query param |
29 | 20 |
|
| 21 | +\* this feature works only in modern browsers (except all IE). |
| 22 | + |
| 23 | +\** not available in IE, Edge has partial support. |
30 | 24 | ## Try It!
|
31 | 25 | [JSFiddle.net demo](https://jsfiddle.net/DigitalBrain/ugz5qn0r/)
|
32 | 26 |
|
33 | 27 | ## Installation
|
34 | 28 |
|
35 |
| -Install for node.js or browserify using `npm`: |
| 29 | +Install for node.js or browserify using npm or yarn: |
36 | 30 |
|
37 | 31 | ``` bash
|
38 | 32 | $ npm install safe-jsonp --save
|
39 | 33 | ```
|
40 | 34 |
|
| 35 | +``` bash |
| 36 | +$ yarn add safe-jsonp |
| 37 | +``` |
| 38 | + |
41 | 39 | ## Basic usage example
|
42 | 40 | Promise style:
|
43 | 41 | ```javascript
|
@@ -68,22 +66,16 @@ JSONP('http://api.github.com/users/DigitalBrainJS', (err, data) => {
|
68 | 66 |
|
69 | 67 | ## CDN
|
70 | 68 | Use unpkg.com cdn to get the link to the script/module from the package:
|
71 |
| -- UMD ES5 version (~15kB) |
| 69 | +- minified (production) UMD ES5 version (~7kB) |
72 | 70 | ```html
|
73 | 71 | <script src="https://unpkg.com/safe-jsonp"></script>
|
74 | 72 | ```
|
75 |
| -- minified UMD ES5 version (~7kB) |
76 |
| -```html |
77 |
| -<script src="https://unpkg.com/safe-jsonp/dist/safe-jsonp.umd.min.js"></script> |
78 |
| -``` |
79 |
| -- ESM ES2015 module (~14kB) |
| 73 | +- ESM ES2015 module(~14kB) |
80 | 74 | ```javascript
|
81 | 75 | import JSONP from "https://unpkg.com/safe-jsonp/dist/safe-jsonp.esm.js"
|
| 76 | +//or minified version |
| 77 | +import JSONP from "https://unpkg.com/safe-jsonp/dist/safe-jsonp.esm.min.js" |
82 | 78 | ```
|
83 |
| -## Functional diagram |
84 |
| -Sandbox mode: |
85 |
| - |
86 |
| - |
87 | 79 |
|
88 | 80 | ## More examples
|
89 | 81 | ##### additional options:
|
@@ -170,7 +162,10 @@ Returns a promise or JSON instance depending on the presence of a callback argum
|
170 | 162 | - `parseURL(url: String): URL|Object` parse URL into components
|
171 | 163 | - `parseParams(paramsStr: String): Object` parse URL params string eg. `a=1&b=2` to params object `{a:1, b:2}`
|
172 | 164 | - `encodeParams(params: Object): String` encode params object to string
|
173 |
| - |
| 165 | +## Functional diagram |
| 166 | +Sandbox mode: |
| 167 | + |
| 168 | + |
174 | 169 | ## Contribution
|
175 | 170 | Feel free to fork, open issues, enhance or create pull requests.
|
176 | 171 | ## License
|
|
0 commit comments