npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@xsyx/easy-api-h5

v4.0.0-beta.15

Published

完整规范请参考 https://www.yuque.com/xsued/book/lz3qo4

Downloads

12

Readme

api 使用手册

完整规范请参考 https://www.yuque.com/xsued/book/lz3qo4

  1. 初始化
// import EasyApi from '@xsyx/easy-api-h5'; // 这种也可以
import { registerModule } from '@xsyx/easy-api-h5';


export const commonApi = registerModule({
  prefix: 'http://test.xsts.xyz', // 请求的统一前缀
  module:{}, // 请求的接口基本信息,见 「module 配置规范」
  loading: true,//全局的loading
  // 以下皆为可选项
  mock: true, // 是否使用mock,全局有效(可选项)
  timeout: 15* 1000, // 超时时间
  // 标准化返回格式,如果响应格式不符合规范,则通过该函数进行标准化,
  // success 为 false 的返回将会走到 exception 
  standard: (response)=>{ // easeApi 接受的标准是 { data, code, success: true/false, message}; 
    const {rspCode, data, rspDesc} = response
      return {
          code: rspCode,
          success: rspCode === 'success', // code === '200'
          data: data,
          message: rspDesc
      }
  }, 
  headers: {// 全局头部(可选项)
  	Authorization: async function(){// 可为函数
			return await kylinApi.getToken();
		}
  }, 
  hooks:{ // 全局钩子(可选项)
    afterFetch:[
    	(url, response, params, options)=>{
      	console.log(response)
      }
    ],
    beforeFetch:[
    	(url, response, params, options)=>{
      	console.log(response)
      }
    ]
  },
  plugins:{ // 注册吐司消息插件和加载动画插件(可选项)
    toast(option){
      const instance = Message.info(option);
      return ()=>{ // 返回一个用来关闭弹窗的方法
        instance.close();
      }
    }
    loading(options){
    	Loading.service(options)
    }
  }
})
  1. 在 modules 中配置接口基本信息

    • url 接口地址
    • method 请求方式
    • 更多配置
    export default {
      // 一个简单的url 配置
      fetchSomeData: {
        // 完整的访问方法名
        url: "/sample/data/normal", // 请求的地址(必填)
        // 以下皆为可选项
        mockUrl: "/mock/data/normal", // mock 地址(可选项)
        mockData: { rspCode: "success", data: [] }, // 静态 mock 数据
        cached: "5000", // 表示接口在多久以内,缓存临时数据(可选项)
        sensitive: "11", // 灵敏期,在这个时间段内,不会走缓存
        method: "POST", // 请求方法 post get(可选项)
        concurrency: false, // 是否允许并发(可选项)
        mock: false, // 是否访问 mock(可选项), 若配置了全局mock 则仍然根据子项生效
        fit: (rsp, params) => {
          // 拦截返回数据格式化
          return rsp;
        },
        repeat: 3, // 重试次数
        feed: (rsp, params) => {
          // 补偿机制,如果重试无效,则进入兜底返回
          // 补偿机制
        },
        fail(rsp, params) {
          // 全局错误处理
        },
      },
    };
  2. 在 api.js 中注册对应的模块,同时导出。

    • 导出的变量名,既是最终使用时调用的名字。
    • 如: api.brandHouse.fetch1(params, options)
    • 其中 brandHouse 就是 模块名
    • params 就是传给服务端的数据,例如
    //服务端支持json数据,直接传json数据,不用修改请求header
    api.brandHouse.fetch1(
      {
        bcd: 123,
        abc: 1344,
      },
      options
    );
    //若服务端不支持json数据, 直接在headers 中修改 content type
    // 该配置同样可以在 全局配置中生效
    api.brandHouse.fetch1(
       {a: 1 b:2},
       {
         headers: {
           'Content-Type': 'application/x-www-form-urlencoded'
         }
       }
    );
    • options 包含如下两个参数
    • loading false string|bool|object
    • silence false bool 是否在出错的时候静默