支持全部JavaScript運行時的HTTP網絡庫-Fly.js

Fly.js 的定位是成爲 Javascript http請求的終極解決方案,也就是說,在任何可以執行 Javascript 的環境,只要具備訪問網絡的能力,Fly都能運行在其上,並提供統一的Promise based API。javascript

Github: github.com/wendux/flyjava

已支持的平臺

Fly.js 官方支持的Javascript運行時包括:瀏覽器、node、微信小程序。這意味着你能夠在這些平臺使用同一份代碼來發起http請求。值得一提是集成到web應用時(瀏覽器環境), fly.js的大小隻有4.7KB, 很是輕量。node

統一的用戶層API

Fly.js 支持的JavaScript運行時是不一樣的,但提供的用戶層API是統一的,API是基於Promise的,風格和 axios 很像(但不徹底相同),下面看幾個例子:ios

發起GET請求

var fly=require("flyio")
//經過用戶id獲取信息,參數直接寫在url中
fly.get('/user?id=133')
  .then(function (response) {
    console.log(response);
  })
  .catch(function (error) {
    console.log(error);
  });

//query參數經過對象傳遞
fly.get('/user', {
      id: 133
  })
  .then(function (response) {
    console.log(response);
  })
  .catch(function (error) {
    console.log(error);
  });
複製代碼

發起POST請求

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

複製代碼

發起多個併發請求

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) {
    //兩個請求都完成
  }))
  .catch(function(error){
    console.log(error)
  })

複製代碼

…….git

上面只是Fly.js的簡單使用,Fly.js 除了支持Promise風格的API以外,另外還支持:github

  1. 支持請求/響應攔截器。
  2. 自動轉換 JSON 數據。
  3. 瀏覽器端支持全局Ajax攔截。
  4. API支持typeScript。
  5. 支持請求配置
  6. H5頁面內嵌到原生 APP 中時,支持將 http 請求轉發到 Native,支持直接請求圖片。

詳細的文檔請參考 github fly .web

支持多平臺的原理

Fly 引入了Http Engine 的概念,所謂 Http Engine,就是真正發起 http 請求的引擎,這在瀏覽器中通常都是XMLHttpRequest,而在其它JavaScript運行時下,須要提供相應平臺的Http Engine,Fly 正是經過切換不一樣平臺的 Http Engine 而實現同時支持不一樣JavaScript運行時的 。json

Http Engine 是一個標準的接口協議,內部實現了真正的HTTP請求邏輯,不一樣JavaScript運行時只須要實現Http Engine的接口協議,就能夠無縫集成到Fly.js中。axios

如何支持新的JavaScript運行時

如上所述,要支持新的JavaScript運行時時,咱們須要實現該平臺下的Http Engine便可,可是從頭實現一個Http Engine 是很是複雜的,爲此,Fly 官方提供了一個 EngineWrapper 幫助工具,它能夠經過一個adapter(適配器)生成一個完整的 Http Engine,因此,咱們只須要實現一個adapter就行。小程序

一個簡單的例子

var engine= EngineWrapper(function (request,responseCallback) {
            responseCallback({
                statusCode:200,
                responseText:"你變或者不變,我都不變😜。",
                extraFeild:"自定義字段"
            })
        })
fly.engine=engine;

fly.get("../package.json").then(d=>{
    log(d.data)
    log(d.extraFeild)
})

控制檯輸出

> 你變或者不變,我都不變😜。
> 自定義字段

複製代碼

EngineWrapper的參數就是adapter, 在這個例子中,adapter 並無真正發起 http 請求,而是直接返回了固定內容,這樣 fly 上層請求任何接口收到的內容永遠都是相同的。完整的示例請移步:Fly.js-Http Engine .

遠程Http Engine

咱們說過,在瀏覽器環境中,fly 使用的默認engine 就是 XMLHttpRequest。如今咱們想一想混合APP, 若是能在 Native(Android、IOS) 上實現一個engine,而後供瀏覽器中的 fly 使用,那麼也就會將本來應該在瀏覽器中發起的請求重定向到了 Native 上。而這個在 Native 上實現的 engine,咱們稱其爲遠程 Http Engine,這是由於調用者和執行者並不在同一個環境。

經過遠程Http Engine, Fly.js能夠實現一個逆天的功能--請求重定向。它能夠將原本會在瀏覽器中發起的http請求重定向到Native, 這樣就能夠在Native 上進行統一的請求管理、cookie同步、證書檢驗、緩存和訪問控制等,詳細的內容請參考: Fly.js 請求重定向

最後

貼出Fly.js的Github源碼地址:github.com/wendux/fly , 詳細的文檔請移步github, 若是你喜歡Fly.js,歡迎star.

相關文章
相關標籤/搜索