servlet数据发布

最新推荐文章于 2023-01-22 09:54:06 发布

风铃峰顶

最新推荐文章于 2023-01-22 09:54:06 发布

阅读量326

点赞数

分类专栏：架构 Servlet

架构同时被 2 个专栏收录

27 篇文章 0 订阅

订阅专栏

Servlet

4 篇文章 0 订阅

订阅专栏

一、Servlet数据发布

1. 新建动态网站工程ServletDemo，src文件夹的Demo包下新建Servlet类Work Center；

2. doPost方法中写入：

response.setCharacterEncoding("UTF-8");

response.setContentType("application/json; charset=utf-8");

response.addHeader("Access-Control-Allow-Origin","*");


String jsonStr="{\"name\":\"zhanghao\",\"sex\":\"nan\"}";


PrintWriter out =null;

try {

out =response.getWriter();

out.write(jsonStr);

}catch (IOException e) {

e.printStackTrace();

}finally {

if (out !=null) {

out.close();

}

}

doGet方法中写入：

doPost(request, response);

注意：若import中"javax.servlet.http.HttpServlet"错误，参考：

https://jingyan.baidu.com/article/c14654138559940bfcfc4ccc.html。

3. WebContent下新建index.jsp:

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<%

String path = request.getContextPath();

String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

%>


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

  <head>

    <base href="<%=basePath%>">

    

    <title>My JSP 'index.jsp' starting page</title>

<meta http-equiv="pragma" content="no-cache">

<meta http-equiv="cache-control" content="no-cache">

<meta http-equiv="expires" content="0">    

<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">

<meta http-equiv="description" content="This is my page">


  </head>

  

  <body>

  </body>

</html>

4.WebContent的WEB-INF下web.xml中写入：

<?xml version="1.0" encoding="UTF-8"?>

<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" id="WebApp_ID" version="3.0">

  <display-name>ServletDemo</display-name>

  <servlet>

    <servlet-name>WorkCenter</servlet-name>

    <servlet-class>deml.WorkCenter</servlet-class>

  </servlet>

  <servlet-mapping>

    <servlet-name>WorkCenter</servlet-name>

    <url-pattern>/Workcenter</url-pattern>

  </servlet-mapping>

</web-app>

注意：<url-pattern>/WorkCenter</url-pattern>不符合命名规范，

参考：https://www.cnblogs.com/xiangxinhouse/p/6377842.html。

4. 启动tomcat，访问http://localhost:8080/ServletDemo/Workcenter

注意：eclipse及IE会提示下载Workcenter.json，Microsoft Edge则会显示在网页中显示json内容。

二、Ajax访问数据

1.下载jquery-3.2.1.min.js，新建show.html：

<!DOCTYPE html>

<html>

<head>

<meta charset=utf-8>

<title>test</title>

<script src="js/jquery-3.2.1.min.js"></script>

<script >


var goAjax=function(){

var url1="http://localhost:8080/ServletDemo/Workcenter";

alert(url1);

$.ajax({


url:url1,  

type:'POST',  

dataType:'json',  

timeout:20000,  

success:function(val){

//show val to browser console

console.log(val);

//alert

alert(val['name']);

}

});

}


</script>

</head>

<body>

<button onclick="goAjax()">点击</button>


</body>

</html>

2. 在IE中打开show.html，允许网页运行脚本，在Microsoft Edge中打开show.html可能阻止网页运行脚本，参考：

https://jingyan.baidu.com/article/574c52191c8f9b6c8c9dc140.html

三、Ajax请求与Servlet响应中加入传参

1. doPost方法修改：

response.setCharacterEncoding("UTF-8");

response.setContentType("application/json; charset=utf-8");

response.addHeader("Access-Control-Allow-Origin","*");


String jsonStr="{\"name\":\"";


PrintWriter out =null;

try {

out =response.getWriter();


out.write(jsonStr +request.getParameter("name") + "\",\"sex\":\"nan\"}");

}catch (IOException e) {

e.printStackTrace();

}finally {

if (out !=null) {

out.close();

}

}

2. show.html修改：

<!DOCTYPE html>

<html>

<head>

<meta charset=utf-8>

<title>test</title>

<script src="js/jquery-3.2.1.min.js"></script>

<script >


var goAjax=function(){

var url1="http://localhost:8080/ServletDemo/Workcenter";

alert(url1);

$.ajax({


url:url1,  

type:'POST',  

dataType:'json',  

data:{

name:'zhanghao'

},

timeout:20000,  

success:function(val){

//show val to browser console

console.log(val);

//alert

alert(val['name']);

}

});

}


</script>

</head>

<body>

<button onclick="goAjax()">点击</button>


</body>

</html>

注意：data的name:’zhanghao’的单引号不能用双引号代替，data{}后必须有“,”，type使用’GET’或’POST’均可。