java网页端数据传输到后端程序(Servlet 和jsp)

Servlet和jsp两种方式

将网页中form表单中的数据传输到服务端

Tomcat

首先需要下载一个Tomcat服务器,用来发布网站,版本可以任意选择,在Tomcat里面会带有servlet的jar包

首先使用servlet

Java Servlet 是运行在 Web 服务器或应用服务器上的程序,它是作为来自 Web 浏览器或其他 HTTP 客户端的请求和
HTTP 服务器上的数据库或应用程序之间的中间层。

使用 Servlet,您可以收集来自网页表单的用户输入,呈现来自数据库或者其他源的记录,还可以动态创建网页。

先利用eclipse创建一个网站,用别的开发工具也是一样的,创建网站是需要配置Tomcat服务器,以便网站导入了servlet的包,并且可以发布,如图

新建web工程
java网页端数据传输到后端程序(Servlet 和jsp)_第1张图片
配置Tomcat
java网页端数据传输到后端程序(Servlet 和jsp)_第2张图片

创建完之后再web项目的Webcontent里面编辑你需要添加的网页内容java网页端数据传输到后端程序(Servlet 和jsp)_第3张图片

这里我创建了一个index的html文件


<html>
<head>
<meta charset="UTF-8">
<title>Insert title heretitle>
head>
<body>
    <form action="MyServlet" method="post">
        <input id="name" name="name" type="text">
        <input id="pwd"name="pwd" type="text"> 
        <input name="submit" type="submit" value="提交">
    form>
body>
html>

创建一个form表单,表单中action表示的是用哪个servlet来处理提交的信息,
method则表示的数据的传输方式,分为两种,一种是get一种是post

下面就开始创建Servlet,在编写java代码的里面建好包,并创建一个类,这个类需要继承HttpServlet

java网页端数据传输到后端程序(Servlet 和jsp)_第4张图片

从网页读取数据

    在HttpServlet中有两个方法,doget 和dopost,这两个方法就是用来接收网页端数据和向网页端输出数据的
    在这里我们使用dopost的方法,在dopost中有个参数HttpServletRequest request我们可以通过这个参数获取网页的传输内容
    HttpServletRequest 参数中有getParameter这个方法能够获取网页的表单对象

String name = request.getParameter(“name”);
这是利用一个字符串来接收一个name属性为name的表单内的字符串数据
表单中的input都可以定义一个name,来被服务单获取,同理可获得pwd中的数据

向网页输出数据

输出数据则是依赖一个PrintWriter 的对象,此对象有个write 和print方法都可以向网页中输出数据,具体使用:

PrintWriter out = response.getWriter();
out.println(“字符串”);
在字符串的位置你也可以改成html代码这样,就能直接打印出来一个网页
服务端具体代码如下:

response.setContentType(“text/html;charset=utf-8”);

如果想输出网页的话要加入text/html这句话不然输出的就会是代码而不是网页
如果想从网页中获取中文字符则需要设置utf-8的格式不然会出现乱码

package com.yd;

import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public class Yd extends HttpServlet {

    private static final long serialVersionUID = 1L;

    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
    }

    @Override
    protected void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {

        response.setContentType("text/html;charset=utf-8");
        response.setCharacterEncoding("UTF-8");
        request.setCharacterEncoding("UTF-8");
        /** 设置响应头允许ajax跨域访问 **/
        response.setHeader("Access-Control-Allow-Origin", "*");
        /* 星号表示所有的异域请求都可以接受, */
        response.setHeader("Access-Control-Allow-Methods", "GET,POST");

        /**
         * 接收json
         */
        String name = request.getParameter("name");
        String pwd = request.getParameter("pwd");
        System.out.println(name);
        System.out.println(pwd);
        /**
         * 返回json
         */
        PrintWriter out = response.getWriter();
        String title = "成果";
        String docType = " \n";
        out.println(
                docType + "\n" + ""</span> + title + <span class="hljs-string">"\n" + "\n"
                        + "

" + title + "

\n"
+ "登陆成功\r\n" + "\r\n" + ""); out.close(); } }
3、配置Web.Xml文件、

建完servlet之后还需要在web.xml中配置一下,让网页和服务单都能找到该servlet
web.xml文件也在WebContent/Web-INF里面如果没有则需要你手动自己建一个

web.xml代码如下


<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xmlns="http://xmlns.jcp.org/xml/ns/javaee"
    xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
    id="WebApp_ID" version="3.1">
    <display-name>Mydisplay-name>
    <welcome-file-list>
        <welcome-file>index.htmlwelcome-file>
        <welcome-file>index.htmwelcome-file>
        <welcome-file>index.jspwelcome-file>
    welcome-file-list>

    <servlet>
        <servlet-name>MyServlet servlet-name>
        <servlet-class>com.yd.MyServlet servlet-class>
    servlet>

    <servlet-mapping>
        <servlet-name>MyServlet servlet-name>
        <url-pattern>/MyServlet url-pattern>
    servlet-mapping>
web-app>
    <servlet> 中的<servlet-name>是与
    <servlet-mapping>中的<servlet-name>对应的随便取什么名字都行,但是两个name需要一样
class>com.yd.MyServlet </servlet-class>
这表示的是你要使用的Servlet所在的路径,需要写包名,
/MyServlet -pattern>
其中的/MyServlet表示的是在网页中访问servlet时用到的URL地址,一定要加/  名字随意
file>index.htmlfile>
表示的是当只有前面部分的URL时访问的页面
例如你需要访问http://localhost/My/index.html时如果你在地址栏直接输入http://localhost/My则会直接访问你再这一项中设计的欢迎页面

到此就配置完成了,只需要运行发布到Tomcat上就能访问了
java网页端数据传输到后端程序(Servlet 和jsp)_第5张图片
java网页端数据传输到后端程序(Servlet 和jsp)_第6张图片

可从地址栏中看到URL进入了Servlet中,而且下方也读取到了输入框中的数据

着重提醒,html文件一定要放在WebContent下面而不是WebContent中的Web-INF下面,不然会一直出错,,血的教训啊。。。

使用jsp原理也差不多,jsp在本质上就是servlet

所以如果用jsp设计则不需要再xml文件中进行配置只需要将html中表单里的action写为你自己的jsp文件就行,然后在jsp中和servlet如出一辙
以下是代码:


<html>
<head>
<meta charset="UTF-8">
<title>Insert title heretitle>
head>
<body>
    <form action="My.jsp" method="post">
        <input id="name" name="name" type="text">
        <input id="pwd"name="pwd" type="text"> 
        <input name="submit" type="submit" value="提交">
    form>
body>
html>

jsp中的代码,

<%@ page language="java"  import="java.util.*" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Insert title heretitle>
head>
<body>
登陆成功
body>
html>
<%
    String name = request.getParameter("name");
    String pwd = request.getParameter("pwd");
    System.out.println(name+"  "+pwd);
%>

最终会看到一样的效果只不过地址栏中的servlet编程了jsp文件

html文件和jsp文件都需要写在WebContent下面,不要放在WebContent中Web-INF下面

你可能感兴趣的:(java,html)