用postman实现post提交json数据

发表于:2021-2-08 09:55

字体: | 上一篇 | 下一篇 | 我要投稿

 作者:刘宏缔的架构森林    来源:博客园

  一,用postman摸拟js的JSON.stringify方式提交数据到接口:
  我们这里看一个例子:用json方式提交用户名和密码后,
  接口返回一个jwt的token字符串, 
  1,headers:
  添加一项: Content-Type
  取值为: application/json
  如图:
      
  2,body标签:
  形式选择:raw
  格式选择:JSON
  如图:  
  
  3,提交后可以看到结果:
   
  二,用js实现json格式提交数据的例子:
  <!DOCTYPE html>
  <html lang="en">
  <head>
      <meta charset="UTF-8">
      <title>使用 jwt 登录页面</title>
  </head>
  <body>
  <div>
      <input type="text" id="userName" name="userName" value="" placeholder="username">
  </div>
  <div>
      <input type="password" id="password" name="password" value="" placeholder="password">
  </div>
  <div>
      <input type="button" id="btnSave" onclick="go_login()"  value="登录">
  </div>
  <script src="https://cdn.bootcss.com/jquery/1.11.3/jquery.js"></script>
  <script>
          //登录
          function go_login() {
              var username=$("#userName").val();
              var password=$("#password").val();
              if ($("#userName").val() == "") {
                  alert('userName is empty');
                  $("#userName").focus();
                  return false;
              }
              if ($("#password").val() == "") {
                  alert('password is empty');
                  $("#password").focus();
                  return false;
              }
              var postData = {
                  "username":username ,
                  "password" : password
              }
              $.ajax({
                  cache: true,
                  type: "POST",
                  url: "/auth/authenticate",
                  contentType: "application/json;charset=UTF-8",
                  data:JSON.stringify(postData),
                  dataType: "json",
                  async: false,
                  error: function (request) {
                      console.log("Connection error");
                  },
                  success: function (data) {
                      //save token
                      console.log("data:");
                      console.log(data);
                      if (data.code == 0) {
                          //success
                          alert("success:"+data.msg+";token:"+data.data.token);
                          //save token
                          localStorage.setItem("token",data.data.token);
                      } else {
                          //failed
                          alert("failed:"+data.msg);
                      }
                  }
              });
          };
  </script>
  </body>
  </html>
  关键的一行代码是:
  JSON.stringify(postData)   
  三,查看postman的版本:

  本文内容不用于商业目的,如涉及知识产权问题,请权利人联系博为峰小编(021-64471599-8017),我们将立即处理
《2023软件测试行业现状调查报告》独家发布~

关注51Testing

联系我们

快捷面板 站点地图 联系我们 广告服务 关于我们 站长统计 发展历程

法律顾问:上海兰迪律师事务所 项棋律师
版权所有 上海博为峰软件技术股份有限公司 Copyright©51testing.com 2003-2024
投诉及意见反馈:webmaster@51testing.com; 业务联系:service@51testing.com 021-64471599-8017

沪ICP备05003035号

沪公网安备 31010102002173号