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

@alicloud/console-fetcher-interceptor-res-biz

v1.4.9

Published

@alicloud/console-fetcher 响应拦截 - 业务层错误

Downloads

498

Readme

@alicloud/console-fetcher-interceptor-res-biz

@alicloud/console-fetcher 的响应拦截器,封装业务错误。

  • 扩展 FetcherConfig 增加可选方法(一般情况下不需要设置,除非「非正常」场景)
    • isSuccess(o: IBizJson): boolean
    • getData(o: IBizJson): T
    • getCode(o: IBizJson): string
    • getRequestId(o: IBizJson): string
    • getTitle(o: IBizJson): string
    • getMessage(o: IBizJson): string

阿里云控制台的 API 请求一般会以如下形式返回:

interface IBizJson<T> {
  code: string;
  requestId: string;
  data?: T;
  title?: string;
  message?: string;
}

其中 code'200'(有些接口会是数字 200)的时候表示业务逻辑是成功的,这时候可以拿到 data;否则表示业务逻辑错误,这个时候可以拿到 message

INSTALL

tnpm i @alicloud/console-fetcher-interceptor-res-biz -S

APIs

import createFetcher, {
  Fetcher
} from '@alicloud/fetcher';
// import interceptors 1
import intercept, {
  FetcherConfigExtended
} from '@alicloud/console-fetcher-interceptor-res-biz';
// import interceptors 2

const fetcher: Fetcher<FetcherConfigExtended> = createFetcher<FetcherConfigExtended>();

// ... add interceptors 1  
intercept(fetcher);
// ... add interceptors 2

export default fetcher

@alicloud/fetcher 的扩展

FetcherConfig

可以在 config 对象上传入新增参数:

interface FetcherConfigExtra {
  /**
   * 判断请求是否成功,默认判断 `json.code === '200' || json.code === 200`
   * 
   * - `boolean` 直接成功或失败
   * - `(json: any) => boolean` 根据原始 json 对象进行自定义判断
   */
  isSuccess?: boolean | ((json: any) => boolean);
  /**
   * 提取最终需要的数据,默认 `json.data`
   * 
   * - `string` 自定义数据字段,如 `'DATA'` 则表示获取 `json.DATA`
   * - `(json: any) => any` 从原始 json 对象进行自定义提取
   */
  getData?: string | ((json: any) => any);
  /**
   * 当 `isSuccess` 判定为失败时,从数据中提取错误 code,默认 `json.code`
   * 
   * - `string` 自定义数据字段,如 `'DATA'` 则表示获取 `json.DATA`
   * - `(json: any) => any` 从原始 json 对象进行自定义提取
   */
  getCode?: string | ((json: any) => string);
  /**
   * 当 `isSuccess` 判定为失败时,从数据中提取错误 message,默认 `json.message`
   * 
   * - `string` 自定义数据字段,如 `'MESSAGE'` 则表示获取 `json.MESSAGE`
   * - `(json: any) => any` 从原始 json 对象进行自定义提取
   */
  getMessage?: string | ((json: any) => string);
}

错误名

ERROR_BIZ = 'FetcherErrorBiz'

如何覆盖默认设置

方法 1 - 创建实例时传入默认值

假设 ~ 是你项目下 src 的 alias。

创建自己的 Fetcher 实例,传入默认值:

import createFetcher, {
  Fetcher
} from '@alicloud/fetcher';
// import interceptors 1
import intercept, {
  FetcherConfigExtended
} from '@alicloud/console-fetcher-interceptor-res-biz';
// import interceptors 2

const fetcher: Fetcher<FetcherConfigExtended> = createFetcher<FetcherConfigExtended>({
  isSuccess?,
  getData?,
  getCode?,
  getRequestId?,
  getTitle?,
  getMessage?
});

// ... add interceptors 1  
intercept(fetcher);
// ... add interceptors 2

export default fetcher;

方法 2 - 调用的时候传入覆盖

import fetcher from '~/util/fetcher'; // 假设这是你项目下的 fetcher 文件路径

interface IResult {
  id: string;
  name: string;
}
interface IBody {
  id: string;
}

fetcher.request<IResult>({
  url: '____url____',
  isSuccess?,
  getData?,
  getCode?,
  getRequestId?,
  getTitle?,
  getMessage?
});

fetcher.post<IResult, IBody>({
  isSuccess?,
  getData?,
  getCode?,
  getRequestId?,
  getTitle?,
  getMessage?
}, '____url____', {
  id: '____id____'
});

// 假设有一个 JSONP 请求,它的返回直接就是数据(即没有业务错误):

fetcher.jsonp({
  isSuccess: true,
  getData: json => json
}, '____url____')