JavaWeb项目中如何让后端的数据传递到前端(包括JSP、JS)

后端传递给前端的方式很多。如果是后端传递给JSP、我想大家很多人都知道 可以使用
后端可以使用:
req.setAttribute("msg",msg);
前端可以使用:
<%=request.getAttribute("msg")%>
或者用JSP的el表达式比如${msg}
这边小编重点讲讲如何在JS和后端通信。如果你使用的是(VUE)技术其实方法是一样的。
以下小编传递的是JSON格式的数据以及文本(String)格式的数据把数据传递给前端。
String格式的传递

 @WebServlet("/collegeService")//这里写的是到时候要访问的路径
public class CollegeService extends HttpServlet {
    @Override
    protected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        resp.setCharacterEncoding("utf-8");
        resp.setContentType("text/html; charset=utf-8");
        PrintWriter out = resp.getWriter();
        ITeacher teacherdao=new TeacherDao();
        String str=teacherdao.FindeCollegeName(Integer.parseInt(LoginController.collegeid));//这里是传递的数据,可以是自定义的文本
        System.out.println(str);
        out.println( str);//把数据加载到网页上。
        out.flush();
        out.close();

    }
}

前端使用ajax,如果不会ajax的可以百度看看。

  // 请求学院
  var that=this;
    $.ajax({
      url: './collegeService',//路径
      type: 'GET',//get或者post方法
      dataType: 'text',//返回的格式
      sync: true,//同步还是异步
      success: function (data, status) {
        console.log("data"+data);
        that.college1=data;

      }
    });
    //设置3000毫秒后取到值是为了顺序执行,不让在上面的取值的时候,这个就已经覆值了,就会发现,值没有成功的赋值。
    setTimeout(function () {
      that.college=that.college1;

    }, 3000)

接下来是返回JSON格式的数据

   // 请求数据
    var data1 = new Array();
    data1.length = 0;
    $.ajax({
      url: './teacheingPlanService',
      type: 'GET',
      dataType: 'json',
      sync: true,
      success: function (data, status) {
        data1.push(data);//要使用push而不能使用=赋值
      }
    });

    // console.log(this.tableData)
    setTimeout(function () {

      that.tableData.length = 0;//清空
      for (var i = 0; i < data1[0].length; i++) {
        that.tableData.push(data1[0][i]);
      }
      that.loading = false;

    }, 10000)
  }

可以发现前端使用ajax接受数据的时候,如果使用的的是JSON返回的如果是数组需要采用push如果采用=会发现值没有成功的赋值。

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值