• 各种构造HTTP请求的方法——最简洁,最易懂~


    目录

     一、通过前端构造的三种方法:

    1.1、通过浏览器自己构造

    1.2、通过form表单构造

    1.3、通过ajax构造

    二、通过postman构造

    三、通过Postman生成各种语言HTTP请求


     一、通过前端构造的三种方法:

    1.1、通过浏览器自己构造

    工具:浏览器;

            打开你的浏览器,在地址栏里写url,按下回车,就可以构造出get请求;(如下图)


    1.2、通过form表单构造

    工具:vscode;

            步骤一:在vscode中,创建html文件,构造一个form表单;(具体的如下代码)

    1. <body>
    2. <form action="https://cn.bing.com/" method="get">
    3. <input type="text" name="a">
    4. <input type="text" name="b">
    5. <input type="submit" value="提交">
    6. form>
    7. body>

    解释:

    • form表单的关键作用是传递键值对
    • action是你选择的网页;
    • method是构造http请求的方法,这里只支持 get 和 post ;
    • input标签用来构造键值对数据,一个input的就是一个键值对,name表示“键”,用户输入的数据表示“值”,最后通过submit来提交,发送请求
    • 若使用get方法,上述键值对就会存到url的query string中;若使用post方法,上述键值对就会放到body中(格式与query string一样);

            步骤二:打开HTML网页,输入你想输入的值;(如下图)

             最后:网页跳转,地址栏(如下图)


    1.3、通过ajax构造

    工具:vscode,jquery第三方库;

            最初ajax主要是借助HTTP传输xml,现在xml用的少了,因此ajax往往用来传输其他数据,例如json;

            form表单构造的数据一定会出发页面跳转,时间慢,开销大,所以并不是一件好事,使用ajax就可以不触发跳转,达到“局部刷新”的效果;

            步骤一:ajax api是浏览器自带的,原生api不太好用,所以可以使用第三方库,代替原生api;打开jquery官网(js中最知名的第三方库之一),复制script链接;

             步骤二:输入以下代码;

    1. <script src="https://lib.baomitu.com/jquery/1.12.4/jquery.min.js">script>
    2. <script>
    3. $.ajax({
    4. type: 'get',
    5. url:'https://cn.bing.com/',
    6. success: function(body) {
    7. //服务器返回正确响应(状态码:200),浏览器就会调用这个函数,处理响应;
    8. //参数body就是响应的正文
    9. console.log("OK~");//打印日志
    10. },
    11. error: function() {
    12. //服务器返回一个错误响应,浏览器就会调用error对应的函数
    13. console.log("error~");//打印日志
    14. }
    15. })
    16. script>

    解释:

    • 第一个script标签的src属性里的url就是刚刚从第三方库中所获取的;
    • type表示使用get方法;
    • url表示选择的网页;
    • data表示请求中的body部分(以上代码没有写)
    • success表示当服务器返回正确响应(状态码:200),浏览器就会调用他对应的函数,处理响应;参数body就是响应的正文;
    • error表示服务器返回一个错误响应,浏览器就会调用error对应的函数;

            最后:打开html,打开调试,会观察到如下信息:

    解释原因:

            这里出错了;原因是跨域(一个页面在域名a下通过ajax访问域名b的资源),这里浏览器是禁止的,除非跨域的网站返回的响应中告诉浏览器可以;(大部分网站是不可以的);

    解决方法:

            这里我们可以自己写一个服务器,把页面放到自己的服务器上,让页面访问自己服务器的资源;(这里不展开讲,后期会出博客);


    二、通过postman构造

    工具:

            属于是一个专门构造HTTP请求的第三方工具,主要是帮助接口测试的,简而言之:它可以用来更方便的构造HTTP请求;

    具体步骤如下图:

     最后结果:


    三、通过Postman生成各种语言HTTP请求

    具体步骤如下图: (简直不要太爽~)

            

     


     

  • 相关阅读:
    [NOIP2000 提高组]-乘积最大:隔板法-DFS搜索-Go语言
    智能指针那些事
    【网关路由测试】——诊断路由测试
    这6点建议,助你解决海外客户的视频验厂!
    KWin、libdrm、DRM从上到下全过程 —— drmModeAddFBxxx(20)
    Gradle介绍1-入门和IDEA整合(Gradle Wrapper)
    【数据结构】一文了解链表【思路+例题学习】
    升级降级苹果手机iOS系统工具iMazing2024
    Mac GPU MPS常用方法
    学习Java语法糖这一篇就够了(详细版)
  • 原文地址:https://blog.csdn.net/CYK_byte/article/details/127850980