{"id":13362067,"url":"https://github.com/chans-open-source/vue-apis","last_synced_at":"2026-01-17T01:55:20.205Z","repository":{"id":34579952,"uuid":"177938547","full_name":"chans-open-source/vue-apis","owner":"chans-open-source","description":"集成axios的vue插件","archived":false,"fork":false,"pushed_at":"2023-01-03T18:36:57.000Z","size":1127,"stargazers_count":27,"open_issues_count":16,"forks_count":5,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-05T09:45:30.851Z","etag":null,"topics":["ajax","axios","browser","http","mit-license","node","vue","xhr"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/chans-open-source.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2019-03-27T07:14:01.000Z","updated_at":"2023-11-07T12:51:13.000Z","dependencies_parsed_at":"2023-01-15T07:53:57.641Z","dependency_job_id":null,"html_url":"https://github.com/chans-open-source/vue-apis","commit_stats":null,"previous_names":["changedenczd/vue-apis"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/chans-open-source/vue-apis","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chans-open-source%2Fvue-apis","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chans-open-source%2Fvue-apis/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chans-open-source%2Fvue-apis/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chans-open-source%2Fvue-apis/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/chans-open-source","download_url":"https://codeload.github.com/chans-open-source/vue-apis/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chans-open-source%2Fvue-apis/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":28491830,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-01-17T00:50:05.742Z","status":"ssl_error","status_checked_at":"2026-01-17T00:43:11.982Z","response_time":107,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["ajax","axios","browser","http","mit-license","node","vue","xhr"],"created_at":"2024-07-29T22:01:48.813Z","updated_at":"2026-01-17T01:55:20.182Z","avatar_url":"https://github.com/chans-open-source.png","language":"JavaScript","funding_links":[],"categories":["Components \u0026 Libraries"],"sub_categories":["Utilities"],"readme":"# vue-apis\n[![LICENSE](https://img.shields.io/badge/license-MIT%20996-blue.svg)](https://github.com/996icu/996.ICU/blob/master/LICENSE)\n\n[\n![NPM version](https://img.shields.io/npm/v/vue-apis.svg)\n![NPM download](https://img.shields.io/npm/dm/vue-apis.svg)\n![NPM download](https://img.shields.io/npm/dw/vue-apis.svg)\n](https://www.npmjs.com/package/vue-apis)\n\n[\n![GitHub watchers](https://img.shields.io/github/watchers/Chans-Open-Source/vue-apis.svg)\n![GitHub stars](https://img.shields.io/github/stars/Chans-Open-Source/vue-apis.svg)\n![GitHub forks](https://img.shields.io/github/forks/Chans-Open-Source/vue-apis.svg)\n![GitHub issues](https://img.shields.io/github/issues/Chans-Open-Source/vue-apis.svg)\n![GitHub last commit (branch)](https://img.shields.io/github/last-commit/Chans-Open-Source/vue-apis.svg)\n](https://github.com/Chans-Open-Source/vue-apis)\n\n\n* A vue plug-in integrated with axios. Build the API using chain programming and return the request instance as a Promise. A nice simplification of how apis are built, and how they are referenced.\n* 一个集成了axios的vue插件。使用链式编程方式构建api，并以Promise返回请求实例。很好地简化了api的构建方式，和引用方式（通过this.$apis.apiName进行引用）。\n\n## Browser Support\n\n![Chrome](https://raw.github.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png) | ![Firefox](https://raw.github.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png) | ![Safari](https://raw.github.com/alrra/browser-logos/master/src/safari/safari_48x48.png) | ![Opera](https://raw.github.com/alrra/browser-logos/master/src/opera/opera_48x48.png) | ![Edge](https://raw.github.com/alrra/browser-logos/master/src/edge/edge_48x48.png) | ![IE](https://raw.github.com/alrra/browser-logos/master/src/archive/internet-explorer_9-11/internet-explorer_9-11_48x48.png) |\n--- | --- | --- | --- | --- | --- |\nLatest ✔ | Latest ✔ | Latest ✔ | Latest ✔ | Latest ✔ | 11 ✔ |\n\n[![Browser Matrix](https://saucelabs.com/open_sauce/build_matrix/axios.svg)](https://saucelabs.com/u/axios)\n\n## Installing\n```\nnpm install vue-apis\n// or\nyarn add vue-apis\n```\n\n## Usage\n### Import\n```\nimport Vue from 'vue'\nimport VueApis from 'vue-apis'\n\nVue.use(VueApis, options)\n```\n\n### Api\n| function | example | argument | description |\n| ---------- | ---- | ------------- | ----------- |\n| setUrl | setUrl('https://baidu.com') | (url: String) | set request url address |\n| setData | setData({ a: 1}) | (data: Object) | set post body object |\n| setParams | setParams({ t: Date.now() }) | (params: Object) | set request url query |\n| setHeaders | setHeaders({ 'content-type': 'application/json' }) | (headers: Object) | set request headers |\n| setTimeout | setTimeout(10000) | (timeout: Number) | set request timeout |\n| setCustomOptions | setCustomOptions({ responseType: 'stream' }) | (options: Object, clear: boolean) | set custom options |\n\n### Options\n| option key | type | default value | description |\n| ---------- | ---- | ------------- | ----------- |\n| apis | object | {} | api set | |\n| showLoading | function | undefined | show loading layout function |\n| hideLoading | function | undefined | hide loading layout function |\n| interceptors | [InterceptorObject](#InterceptorObject) | undefined | You can intercept requests or responses before they are handled by then or catch. |\n\n#### InterceptorObject\n| field | type | description |\n| --- | --- | --- |\n| request | [RequestObject](#RequestObject) / Function | When the instance is 'Function', it is a 'then' callback to the interceptor |\n| response | [ResponseObject](#ResponseObject) / Function | When the instance is 'Function', it is a 'then' callback to the interceptor |\n\n##### RequestObject\n| Function | e.g. |\n| --- | --- |\n| then | (config) =\u003e { return config; } |\n| catch | (error) =\u003e { return Promise.reject(error); } |\n\n\n##### ResponseObject\n| Function | e.g. |\n| --- | --- |\n| then | (response) =\u003e { return response; } |\n| catch | (error) =\u003e { return Promise.reject(error); } |\n\n### Example\n* main.js\n```js\nimport Vue from 'vue'\nimport VueApis from 'vue-apis'\nimport Api from './api'\n\nVue.use(VueApis, {\n  apis: Api,\n  showLoading: () =\u003e {\n    console.log('showLoading')\n  },\n  hideLoading: () =\u003e {\n    console.log('hideLoading')\n  },\n  interceptors: {\n    request: {\n      then(config) {\n        // Do something before request is sent\n        return config;\n      },\n      catch(error) {\n        // Do something with request error\n        return Promise.reject(error);\n      }\n    },\n    response: {\n      then(response) {\n        // Do something with response data\n        return response;\n      },\n      catch(error) {\n        // Do something with response error\n        return Promise.reject(error);\n      }\n    }\n  }\n})\n```\n* api.js\n```js\nimport { ApiOptions, ApiMethod } from 'vue-apis'\n\nconst $api = {\n  readme () {\n    return new ApiOptions()\n    .setUrl(`https://raw.githubusercontent.com/Chans-Open-Source/vue-apis/master/README.md`)\n    .setMethod(ApiMethod.GET)\n    .setParams({\n      timestamp: Date.now()\n    })\n    .setHeaders({\n      Authorization: `Bearer ${Date.now()}`\n    })\n    .request()\n  }\n}\n\nexport default $api\n```\n* home.vue\n```html\n\u003ctemplate\u003e\n  \u003cdiv v-html=\"readme\"\u003e\u003c/div\u003e\n\u003c/template\u003e\n\u003cscript\u003e\n  export default {\n    data () {\n      return {\n        readme: ''\n      }\n    },\n    async created () {\n      const res = await this.$apis.readme()\n      this.readme = res\n    }\n  }\n\u003c/script\u003e\n```\n\n#### FormData\n* Api\n```js\nconst $api = {\n  formDataRequest (formData) {\n    return new ApiOptions()\n    .setUrl(URL)\n    .setMethod(ApiMethod.POST)\n    .setData(formData)\n    .request()\n  }\n}\n```\n* Create FormData Instance\n```js\nconst formData = new window.FormData()\nformData.append(key, value)\n\n// Request\nthis.$apis.formDataRequest(formData)\n```\n\n#### Custom Options\n```js\nconst $api = {\n  formDataRequest (formData) {\n    return new ApiOptions()\n    .setUrl(URL)\n    .setMethod(ApiMethod.POST)\n    .setData(formData)\n    .setCustomOptions({\n      url: `https://baidu.com`, // invalid\n      data: {}, // invalid\n      params: {}, // invalid\n      headers: {}, // invalid\n      method: {}, // invalid\n      responseType: 'stream' // valid\n    }, /* is clear all custom options at first */ false)\n    .request()\n  }\n}\n```\n\n## Source Code\n* [Official Demo Source](https://github.com/Chans-Open-Source/official-web-for-vue)\n* [Plugin Source](https://github.com/Chans-Open-Source/vue-apis)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchans-open-source%2Fvue-apis","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fchans-open-source%2Fvue-apis","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchans-open-source%2Fvue-apis/lists"}