@cycjimmy/mini-xhr

A very lightweight javascript library for HTTP requests.


Keywords
mini, xmlHttpRequest, promise, xhr
License
MIT
Install
npm install @cycjimmy/mini-xhr@2.0.0

Documentation

Mini XHR

libraries dependency status libraries sourcerank Coverage Status Release date rollup semantic-release jest npm license

A very lightweight javascript library for HTTP requests.

Language: En | 中文


Install

NPM version NPM bundle size npm download

# via npm
$ npm install @cycjimmy/mini-xhr --save

# or via yarn
$ yarn add @cycjimmy/mini-xhr

Usage

import miniXhr from '@cycjimmy/mini-xhr';

# OR
const miniXhr = require('@cycjimmy/mini-xhr');

miniXhr.get(url [, settings])
  .then((data) => {
    // handle data
  })
  .catch((err) => {
    // handle error
  });

miniXhr supports the following methods:

miniXhr.get(url, [,settings])

  • url: [Require][String] The server URL that will be used for the request.
  • The settings supports: [Option][Object]
    • params: [Option][Object] The key-value pair for the URL parameters to be sent with the request. Default {}.
    • responseType: [Option][String] The type of data that the server will respond with. Choose one of the options:
      • 'arraybuffer'
      • 'document'
      • 'json'(default)
      • 'text'
      • 'stream'
      • 'blob'
    • headers: [Option][Object] The key-value pair that custom headers to be sent. Default {}.
    • contentType: [Option][String] Content type. Default 'application/json; charset=UTF-8'.
    • timeout: [Option][Number] The number of milliseconds before the request times out. A value of 0 means there will be no timeout. Default 0.
    • timeoutCB: [Option][Function] The time-out callback function. Default null.

miniXhr.post(url, [,settings])

  • url: [Require][String] The server URL that will be used for the request.
  • The settings supports: [Option][Object]
    • params: [Option][Object] The key-value pair for the URL parameters to be sent with the request. Default {}.
    • data: [Option][Object|FormData|String] The data to be sent as the request body. Default {}.
    • dataType: [Option][String] The type of the data to be sent as the request body. Choose one of the options:
      • 'json'(default)
      • 'formData'
      • 'text'
    • responseType: [Option][String] The type of data that the server will respond with. Choose one of the options:
      • 'arraybuffer'
      • 'document'
      • 'json'(default)
      • 'text'
      • 'stream'
      • 'blob'
    • headers: [Option][Object] The key-value pair that custom headers to be sent. Default {}.
    • contentType: [Option][String] Content type. Default 'application/json; charset=UTF-8'.
    • timeout: [Option][Number] The number of milliseconds before the request times out. A value of 0 means there will be no timeout. Default 0.
    • timeoutCB: [Option][Function] The time-out callback function. Default null.

miniXhr.jsonp(url, [,settings])

  • url: [Require][String] The server URL that will be used for the request.
  • The settings supports: [Option][Object]
    • params: [Option][Object] The key-value pair for the URL parameters to be sent with the request. Default {}.
    • timeout: [Option][Number] The number of milliseconds before the request times out. A value of 0 means there will be no timeout. Default 5000.

Handling Errors

GET or POST
miniXhr.get('/getData')
  .then((data) => {
    // data handle
  })
  .catch((err) => {
    console.log(err.statusText);  // the text of the response status
    console.log(err.status);      // the numerical HTTP status code
  });
JSONP
miniXhr.jsonp('/getData')
  .then((data) => {
    // data handle
  })
  .catch((err) => {
    console.log(err);  // return 'error' or 'timeout'
  });

Use in browser: E.g.

<script src="mini-xhr.umd.min.js"></script>
<script>
  miniXhr.jsonp('/getData', {
    params: {
      key1: 'value1',
      key2: 'value2',
    }
  })
    .then(function(data) {
      // data handle
    });
</script>

CDN

jsdelivr

To use via a CDN include this in your html:

<script src="https://cdn.jsdelivr.net/npm/@cycjimmy/mini-xhr@7/dist/mini-xhr.umd.min.js"></script>