【jquery Ajax】接口的学习与Postcode插件的使用

简介: 【jquery Ajax】接口的学习与Postcode插件的使用

 接口

       接口的概念

使用Ajax请求数据时,被请求的url地址,就叫做数据接口(接口),同时,每个接口必须有请求方式,

       分析接口的请求过程

               通过GET方式请求接口的过程

image.gif编辑

                 通过post方式请求接口的过程

image.gif编辑

        接口测试工具

               什么是接口测试工具

为了验证接口能否被正常访问,我们常常需要使用接口测试工具,来对数据接口进行检测。

接口测试工具能让我们在不写任何代码的情况下,对接口进行调用和测试。

                安装Postcode

postman安装包臃肿,而且 Postman 还收费,免费版本也不支持一些功能。关键有些功能完全用不到,还占地方,推荐一个vscode 插件,叫做postcode。

image.gif编辑

安装失败的话,会提示手动安装,手动安装再导入也可以,

image.gif编辑

               使用postcode测试get接口

步骤

    1. 选择请求的方式
    2. 填写请求的URL地址
    3. 填写请求的参数
    4. 点击Send按钮发起GET请求
    5. 查看服务器响应的结果。

    image.gif编辑

                    使用postcode测试post接口

    步骤

      1. 选择请求的方式
      2. 填写请求的URL地址
      3. 选择Body面板并勾选数据格式
      4. 填写要发送到服务器的数据
      5. 点击Send按钮发起POST请求
      6. 查看结果

      image.gif编辑

      提交数据 要选择body里的image.gif编辑格式进行提交。

              接口文档

                     什么是接口文档

      接口文档,顾名思义就是接口的说明文档,它是我们调用接口的依据,好的接口文档包含了对接口URL,参数以及输出内容的说明,我们参照接口文档就能方便的知道接口的作用,以及接口如何进行调用。

                     接口文档的组成部分

      接口文档可以包含很多信息,也可以按需进行精简,不过,一个合格的接口文档,应该包含以下六项内容,从而为接口的调用提供依据。

        1. 接口名称:用来标识各个接口的简单说明,如何登录接口,获取图书列表接口等
        2. 接口URL: 接口的调用地址。
        3. 调用方式: 接口的调用方式 如GET或POST。
        4. 参数格式:接口需要传递的参数,每个参数必须包含参数名称,参数类型,是否必选,参数说明这四项内容。
        5. 响应格式:接口的返回值的详细描述,一般包含数据名称,数据类型,说明三项内容。
        6. 返回示例(可选):通过对象的形式,列举服务器返回数据的结构。

                        接口文档示例

        image.gif编辑

        响应格式

        image.gif编辑

        返回示例

        image.gif编辑


        目录
        相关文章
        |
        3月前
        |
        设计模式 JavaScript 前端开发
        必知的技术知识:jQuery插件开发精品教程,让你的jQuery提升一个台阶
        必知的技术知识:jQuery插件开发精品教程,让你的jQuery提升一个台阶
        36 1
        |
        3月前
        |
        前端开发 JavaScript
        杨校老师课堂之基于Servlet整合JQuery中的Ajax进行表单提交[基于IDEA]
        杨校老师课堂之基于Servlet整合JQuery中的Ajax进行表单提交[基于IDEA]
        34 0
        杨校老师课堂之基于Servlet整合JQuery中的Ajax进行表单提交[基于IDEA]
        |
        28天前
        |
        前端开发 JavaScript Java
        SpringBoot+JQuery+Ajax实现表单数据传输和单文件或多文件的上传
        关于如何在SpringBoot项目中结合JQuery和Ajax实现表单数据的传输以及单文件或多文件上传的教程。文章提供了完整的前后端示例代码,包括项目的`pom.xml`依赖配置、SpringBoot的启动类`App.java`、静态资源配置`ResourceConfig.java`、配置文件`application.yml`、前端HTML页面(单文件上传和多文件上传加表单内容)以及后端控制器`UserController.java`。文章最后展示了运行结果的截图。
        41 0
        SpringBoot+JQuery+Ajax实现表单数据传输和单文件或多文件的上传
        |
        19天前
        |
        JavaScript 前端开发 数据安全/隐私保护
        Validform jQuery插件详解
        【8月更文挑战第21天】
        |
        28天前
        |
        XML JSON 前端开发
        AJAX是什么?原生语法格式?jQuery提供分装好的AJAX有什么区别?
        AJAX是什么?原生语法格式?jQuery提供分装好的AJAX有什么区别?
        26 0
        |
        29天前
        |
        JavaScript 前端开发
        Ajax的使用(jquery的下载)
        这篇文章是关于Ajax学习笔记的分享,包括JQuery的下载方式、Ajax的主要参数说明,以及如何在网页中使用Ajax进行异步请求的示例代码。
        |
        3月前
        |
        JavaScript 前端开发 安全
        安全开发-JS应用&原生开发&JQuery库&Ajax技术&加密编码库&断点调试&逆向分析&元素属性操作
        安全开发-JS应用&原生开发&JQuery库&Ajax技术&加密编码库&断点调试&逆向分析&元素属性操作
        |
        3月前
        |
        JavaScript Perl PHP
        一篇文章讲明白jQuery插件之jqueryeditableplugin
        一篇文章讲明白jQuery插件之jqueryeditableplugin
        20 0
        |
        4月前
        |
        JSON 前端开发 JavaScript
        Ajax 学习总结
        这是一个关于Ajax学习的总结,包括导入Ajax包、异步请求和表单验证。示例展示了如何使用jQuery进行Ajax请求,从后台获取并显示数据,同时提到了Json乱码问题的解决方法和表单数据的前后端交互。还给出了表单验证的简单示例,通过Ajax实时校验用户名。
        43 2
        |
        4月前
        |
        XML JSON 前端开发
        学习Ajax使用异步对象发送请求
        Ajax,全称Asynchronous JavaScript and XML(异步JavaScript和XML),是一种用于创建更好、更快以及交互性更强的Web应用程序的技术。
        47 3