小程序請求后端接口實例

 

小程序wxml頁面button 按鈕
<view>
    <button bindtap="change">點擊</button> //change 為js函數名
</view>

小程序js頁面函數
Page({

  change: function(event){
    wx.request({
      url: 'http://localhost:80/services/login/username',  //如果不設置method 則默認get請求地址
　　　 method: 'post',
      data: {
  　　　　　　//可攜帶參數   
　　　　　　　　},

 header: { 'content-type': 'application/json' // 默認值
 }, success: function(res) { console.log(res.data) //res.data 為接口返回值
 }, }) } }) springboot后端接口： @RestController @RequestMapping("/login") public class loginController { @RequestMapping(value = "/username",method = RequestMethod.POST) public String login(HttpServletRequest request){ System.out.println(request.getParameter("userName")); return "請求成功"; } }

//spring后端接口以及接收參數的方式
@Component
@Scope("prototype")
@Path("/medical")
public class MedicalRecordAction {

    @POST
    @Path("/login")
    @Produces(value = MediaType.TEXT_PLAIN)
    public String login(@FormParam(value = "requestJson") String   requestJson){  
        return medicalInsertService.login(requestJson);

}    


　　　　
　　　　//小程序前端請求方式以及請求參數
　　　　　　wx.request({
              url: app.globalData.webServiceUrl+'/medical/login',
              method: 'post',
              data: {
                requestJson:"{'accountid':\""+app.globalData.accountid+"\",}",
              },
              header: {'content-type': 'application/x-www-form-urlencoded' },
              success:function(res){
                
                if(res.data.code == 0){
                  for (let index in res.data.responseData) {
                    //獲取userid並配置全局userid
                    app.globalData.userid = res.data.responseData[index].userid
                  }               
                
                }else{
                  wx.showToast({
                    title: res.data.responseData,
                    icon: "none",
                  })
                }

              }
            })