封装API接口

最新推荐文章于 2024-04-09 11:07:14 发布
最新推荐文章于 2024-04-09 11:07:14 发布
阅读量2.1k 收藏 9
点赞数 2
分类专栏： 日常问题记录
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Harden3/article/details/103861963
版权

封装API接口
目的：为了以后修改接口方便，如果项目很大，在每一个页面里修改接口的话，很麻烦，所以封装在一个文件里，找起来也很方便

如何封装
1.在src下建一个restful文件夹，在此下面建一个api.js文件
在这里插入图片描述
2.因为上面的接口地址写的是/api/* ,所以要在config文件夹下的index.js文件里加入
在这里插入图片描述3.如果遇到跨域问题，在config下的prod.env.js文件里加入
在这里插入图片描述
4.将api文件挂载到全局下，在main.js文件里加入
在这里插入图片描述
5.然后在组件里调用接口就不用写地址了，直接调用api里的方法就可以

在这里插入图片描述
这样就很方便了。

没有心气儿
关注
  • 2
    点赞
  • 踩
  • 9
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
封装api
yin_mkajs的博客
04-08 149
首先，新建一个http文件，然后再http文件里新建一个env.js文件来配置环境， 代码如下 //env.js //存放不同的环境地址 module.exports={ //线上地址 prod:{ baseUrl:'https://api.it120.cc' }, //测试地址 test:{ baseUrl:'https://www.05E.com' }, //本地地址 local:{ baseUrl:'https://www.
详解Vue中Axios封装API接口的思路及方法
10-14
主要介绍了详解Vue中Axios封装API接口的思路及方法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
使用JaveScript实现阿里云天气API的调用
qq_42010726的博客
11-15 1867
JavaScript调用阿里云天气查询API实现过程 最近闲来无聊，玩了一下Hbuilder，做了一个手机APP，主要功能为调用阿里云天气API，并且在app界面展示出来。不巧阿里云只给出了cure,php,java，python等语言的调用例程，就是没有JS的实现方法，而且这方面的资料又好少，没办法，只能自己爬坑了。下面的我使用JS实现的调用方法，有需要可以参考。 先简单说一下流程，你要用人家的...
API接口封装系列
最新发布
An4480的博客
04-09 473
API（Application Programming Interface）接口封装是将系统内部的功能封装成可复用的程序接口并向外部提供，以便其他系统调用和使用这些功能，通过这种方式实现系统之间的通信和协作。下面将介绍API接口封装的一些关键步骤和注意事项。总之，API接口封装是一个系统性的过程，需要明确需求、创建封装类、处理请求与响应，并提供友好的接口。同时，还需要考虑优化措施和使用相关工具来提高效率和质量。
Python封装API接口的实践
An4480的博客
12-23 257
在上述代码中，我们用Python和Flask实现了一个简单的API接口，这个接口返回了一个包含两本书的Json格式数据。1、定义API接口：首先，我们需要对API接口的功能进行明确的定义，然后根据功能定义选择合适的HTTP方法和URL。3、测试API接口：最后，我们需要对API接口进行测试，确保接口的功能正常，接口的返回值符合预期。3、一致性：Python封装的API接口，可以保证接口的一致性，使得客户端调用更加方便快捷。3、性能：对于大规模的请求，API接口的性能很重要，需要进行合理的性能优化。
api接口统一封装
weixin_30469895的博客
09-10 2869
具体的接口api模块，例如authorization.js import axios from '../axiosWrapper'let prefix = process.env.API_ROOT// 查询权限管理列表数据export const queryAuthTableList = (params) => { return axios.get(`${pref...
api.js封装请求
weixin_30765475的博客
02-11 654
1. 传入对象格式如 { a:{ getData:{ url: 'xx/xx/xx', method: 'get', require:['id', 'name'], // 简单检查 必传参数确实则不发请求 changeParamsProp:{ // 防止后端更改参数名 ...
微信小程序如何封装api接口
01-03
微信小程序如何封装api接口 首先创建个http文件夹（可自定义名字） 一：创建个env.js文件用来设置公共访问的url，即环境地址 module.exports = { //开发环境 dev:{baseUrl:http://localhost:3000}, //测试环境 ...
Api接口调用封装,实现POSt,GET等数据请求
06-29
Api接口调用封装,实现POSt,GET等数据请求，Api接口调用封装,实现POSt,GET等数据请求，Api接口调用封装,实现POSt,GET等数据请求，Api接口调用封装,实现POSt,GET等数据请求，Api接口调用封装,实现POSt,GET等数据请求，...
PHP调用接口API封装的例子
10-16
在本文中，我们将深入探讨如何在PHP中封装API接口调用的方法，主要涉及GET和POST两种常见的HTTP请求方式。这些技术对于开发人员来说至关重要，因为它们允许程序与其他服务或系统进行交互，获取或发送数据。 首先，...
【小学鸡学 API接口封装】
weixin_44460923的博客
03-28 90
小学鸡学 API接口封装 1. 创建Utils文件夹，写入 请求/接收拦截器写入request.js中 2.创建API文件夹，其下创建Index.js文件，创建各接口模块文件夹、文件 3.，各接口文件导入request文件，抛出各接口信息 4.index.js文件导入各模块，并抛出 5.main.js导入 将api集体导入变为全局，避免多次导入 ， 6.使用 注意接口在哪个模块下 ...
G723算法，封装了复杂的内部算法，提供简单的调用接口。
08-27
G723算法，封装了复杂的内部算法，提供简单的调用接口。默认为vc.net2003的工程，请根据需求进行转换。
js封装api
QQ2856639881的专栏
06-08 521
1、 http.js import '../js/jquery-3.3.1.min.js' //这个地方居然要如此引用 import _url from './config.js' import util from '../utils/util.js' import '../js/jquery-3.3.1.min.js' //这个地方居然要如此引用 export default { /** * 传入 headers data */ post: funct...
nodejs封装api
LPLIFE的博客
03-27 3211
安装了nodeJs 执行： 安装淘宝镜像 npm install -g cnpm --registry=https://registry.npm.taobao.org 安装 yarn（我使用这个，淘宝镜像总是莫名其妙各种bug。。。） npm install yarn -g 接着项目中执行： yarn add express --save yarn add body-parser...
封装好api接口
weixin_46191846的博客
08-12 502
// 详细注册 getwxre:(data)=>{ return request(‘user/wxapp/register/complex’,‘POST’,data,true) }, // 登录 login_wx: (code) => { return request(‘user/wxapp/login’,‘POST’, { code, type: 2 } ,true) 2.在外部封装一个utils文件里的一个auth.js文件 以及在template login文件夹下的组件 3.在我的页面的
js封装网易云api请求
热门推荐
诗水人间
06-11 14万+
封装axios，以及封装网易云音乐api文档中的所有请求 封装号的js文件地址Github:云博前端项目-网易云音乐api封装后的js文件地址 向将axios请求封装 npm install axios -s 封装的请求函数文件，通过传入type=GET/POST/PUT/DELETE分别发送 axios.get(url)和 axios.post(url,data) /* ajax请求函数模块 返回值: promise对象(异步返回的数据是: response.data) 其它请求使用axios.post
封装接口请求
qq_59076775的博客
04-24 4973
在做项目的时候,我们平常会对接口api进行一些封装。今天来教给大家一些简单的封装接口的方法。 一.request.js文件夹 通常情况下我们会在utils/request.js封装自己的api。 // 1.导入axios import axios from "axios"; // 2.创建axios副本 const _axios = axios.create({ baseURL: process.env.VUE_APP_BASE_API, }); // 3.请求拦截器 _axios.inte
6-5 JS编程接口（jQuery风格封装）
前端知识库
04-29 291
用jQuery风格封装 1.链式风格 也叫jQuery风格 window.jQuery() 是我们提供的全局函数 特殊函数jQuery 1.jQuery（选择器）用于获取对应的元素 2.它却不返回这些元素 3.相反，它返回一个对象，成为jQuery构造出来的对象 4.这个对象可以操作对应的元素 2.jQuery选择器是什么？ jQuery选择器是允许通过标签名、属性名或内容对DOM元素进行快速、准确的选择，而不必担心浏览器的兼容性，通过jQuery选择器对页面元素的精准定位，才能完成元素属性和行为的处理
java 封装自己的api_java api封装工具类实现
weixin_29501693的博客
02-16 786
最近接手了一个项目，做了前后端分离，前端通过ajax的方式调用后端，后端返回json。所以在项目中充斥这大量如下所示的代码User user = UserService.getUser(id);JSONObject jsonObject = new JSONObject();if (null != user){jsonObject.put("name", user.getName());jsonO...
Android 封装api接口类
05-23
在 Android 开发中，封装 API 接口类是一种常见的做法，可以提高代码的复用性和可维护性。以下是一个简单的封装 API 接口类的示例： ```java public class ApiClient { private static final String BASE_URL = ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值