Fly.js is a promising, powerful HTTP request library that supports multiple JavaScript runtimes. With it, you can use an HTTP request code in the browser, wechat applet, Weex, Node and so on. At the same time, it can easily cooperate with the framework of the Vue family to achieve Write Once Run Everywhere as much as possible.

Github: github.com/wendux/fly

The problem

With the release of Weex and MPvue, both support vue.js syntax. Vue already runs in browsers, applets, and Native. Although there are still differences between platforms, Write Once Run Everywhere can be basically implemented. This allows us to achieve maximum code reuse on multiple ends. But both VUE and Weex and MPVUE are essentially a View layer, and at best, only UI reuse is possible. But after the UI, the most important thing for an application is data, and that data usually comes from web requests (mostly HTTP). When using these frameworks, you need to use platform-specific apis for your network requests! This is bad, and means that the code for your network request cannot be reused, so although the UI can be reused, we still need to adapt the code for the network request part.

Consistent network requests

To solve this problem, we need a network library that can support multiple platforms, provide a unified API at the user level, and mask platform differences at the bottom. The fly.js API is designed in a similar (but not identical) style to Axios to make it easier for Axios users to migrate.

Fly.js enables multi-environment support by switching between different Http engines underneath different JavaScript runtimes, but at the same time provides a unified, standard Promise API for the user layer. Fly.js also supports request/response interceptors, automatic JSON conversion, request forwarding, and more. For details, see github.com/wendux/fly

Supported platforms

Currently, fly.js supports node. js, wechat Applet, Weex and browsers, all of which have different JavaScript runtime. More platforms are being added, so stay tuned.

Fly simple usage example

The following example will run on all supported platforms unless otherwise specified.

Making a GET request

// Different platforms may need to import different files, see the documentation for details
var fly=require("flyio")

// Get the information from the user ID. The parameters are written directly in the URL
fly.get('/user? id=133')
  .then(function (response) {
    console.log(response);
  })
  .catch(function (error) {
    console.log(error);
  });

// The query argument is passed through the object
fly.get('/user', {
      id: 133
  })
  .then(function (response) {
    console.log(response);
  })
  .catch(function (error) {
    console.log(error);
});

Copy the code

Making a POST request

fly.post('/user', {
    name: 'Doris'.age: 24
    phone:"18513222525"
  })
  .then(function (response) {
    console.log(response);
  })
  .catch(function (error) {
    console.log(error);
  });
Copy the code

Initiate multiple concurrent requests

function getUserRecords() {
  return fly.get('/user/133/records');
}

function getUserProjects() {
  return fly.get('/user/133/projects');
}

fly.all([getUserRecords(), getUserProjects()])
  .then(fly.spread(function (records, projects) {
    // Both requests are completed
  }))
  .catch(function(error){
    console.log(error)
  })
Copy the code

The interceptor

Fly supports request/response interceptors that do some pre-processing before the request is initiated and after the response data is received.


// Add request interceptor
fly.interceptors.request.use((request) = >{
    // Add custom headers to all requests
    request.headers["X-Tag"] ="flyio";
  	// Print out the request body
  	console.log(request.body)
  	// Terminate the request
  	//var err=new Error("xxx")
  	//err.request=request
  	//return Promise.reject(new Error(""))
  
    Request can be returned explicitly or not. The interceptor returns Request by default when there is no return value
    return request;
})

// Add a response interceptor, which is executed before the then/catch processing
fly.interceptors.response.use(
    (response) = > {
        // Only the data field of the request result is returned
        return response.data
    },
    (err) => {
        // This is where a network error occurs
        //return Promise.resolve("ssss")})Copy the code

There are many other powerful features of fly.js. For more information, go to fly.js.

feedback

If you have any questions, please send them to issue.fly.js at github: github.com/wendux/fly