Coder Social home page Coder Social logo

fetch.io's Introduction

NPM version Build status Test coverage License Dependency status

fetch.io

Extends the whatwg fetch - fetch spec api, makes it easier to use. Both node & browser supported.

  • install
$ npm install fetch.io
  • import
const Fetch = require('fetch.io')

// or ES6 style

import Fetch from 'fetch.io'

APIs

  • .config() - set options

  • .set() - set http header

  • .type() - set content type

  • .send() - send body data

  • .query() - set query string

  • .append() - append form data

  • .text() - convert response body to string

  • .json(strict = true) - convert response body to object (strict JSON mode default)

Options

  • jsonHandler - Function, add a handler for .json(), to check the response data
  • prefix - String, url prefix
  • Other whatwg-fetch options

Usage

const request = new Fetch({
  prefix: 'http://example.com/api/v1'
})
  • default options
{
  prefix: '',
  mode: 'cors',
  cache: 'no-cache',
  credentials: 'same-origin'
}
request
  .get(path)
  .config({
    credentials: 'omit'
  })
  .query({
    type: 1
  })
  .query({
    name: 'hello'
  })
  .then(res => {
    // fetch response
  })
  .catch(err => {
    // ...
  })
  • get json body
request
  .get(path)
  .json()
  .then(body => {
    // response body
  })
  .catch(err => {
    // ...
  })
  • get text body
request
  .get(path)
  .text()
  .then(body => {
    // response body
  })
  .catch(err => {
    // ...
  })
  • send json
request
  .post(path)
  .send({
    type: 1
  })
  .send({
    name: 'hello'
  })
  .then(res => {
    // fetch response
  })
  .catch(err => {
    // ...
  })
  • send urlencoded
request
  .post(path)
  .send('type=1')
  .send('name=hello')
  .then(res => {
    // fetch response
  })
  .catch(err => {
    // ...
  })
  • send urlencoded
request
  .post(path)
  .type('form')
  // equal to:
  // .type('urlencoded')
  // equal to:
  // .set('content-type', 'application/x-www-form-urlencoded')
  .send({
    type: 1,
    name: 'hello'
  })
  .then(res => {
    // fetch response
  })
  .catch(err => {
    // ...
  })
  • set header
request
  .post(path)
  .set({
    'content-type': 'application/json'
  })
  .send({
    name: 'hello'
  })
  .then(res => {
    // fetch response
  })
  .catch(err => {
    // ...
  })
  • send form (multipart) (upload file)
request
  .post(path)
  .append('filename', 'user.png')
  .append('file': document.querySelector('input[type="file"]')files[0])
  .then(res => {
    // fetch response
  })
  .catch(err => {
    // ...
  })

License

MIT

fetch.io's People

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.