AI 助理
备案控制台
开发者社区 云原生 文章 正文

前端与Servlet交互 详解

2024-04-29 69
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
本文涉及的产品
应用实时监控服务-应用监控，每月50GB免费额度
云原生网关 MSE Higress，422元/月
容器服务 Serverless 版 ACK Serverless，317元额度 多规格
简介： 前端与Servlet交互 详解

前端与Servlet交互 详解
15/100
发布文章
weixin_69252724
未选择文件

@[TOC]

一 、web开发

<1>概述:指的是将开发好的web项目部署在web服务器中供外界访问 流行的web服务器有Tomcat,WebSphere,WebLogivc,Jboss

<2>web环境搭配:

  1. 下载安装
    在这里插入图片描述

  2. Tomcat目录层次结构
    3.

在idea里配置Tomcat

  1. 首先点编辑配置
    在这里插入图片描述
  2. 配置本地tomcat在这里插入图片描述
  3. 配置
    在这里插入图片描述

二 、运行在web里的Servlet

<1> Servlet是Servlet Applet 的简称, 指的是用java编写的服务器端的程序, 它运行在web服务器中，web服务器负责Servlet和客户的通信以及调用Servlet方法。

servlet作用

  1. 接收用户发送的请求数据
  2. 调用其他java程序来处理请求
  3. 根据处理结果, 将结果响应给客户端
    <2>Servlet的创建使用
  4. 创建类继承 javax.servlet.http包下的HttpServle
  5. 在web.xml文件中配置Servle
  6. 运行Servlet程序 开启服务器之后 通过浏览器访问http:localhost:8080/项目名/配置的url

*注意: 由于客户端是通过URL地址访问web服务器中的资源，所以Servlet程序若想被外界访问，必须把servlet程序映射到一个URL地址上，这个工作在web.xml文件中使用元素和元素完成。*

<3>> 在web-xml文件里设置Servlet配置

Web.xml文件用于对web应用下的web资源进行配置，服务
器在启动时会读取web.xml文件中的内容。
在这里插入图片描述

整数
这里填入如果是大于0的数字就会再服务器启动的时候通过反射机制来创建servlet对象
默认情况下是第一次访问servlet对象时候来创建对象
在这里插入图片描述

三、Http请求协议

即超文本传输协议
http是基与tcp与ip通信协议来传递数据, 是网络模型中的应用层协议, 用来规定浏览器与服务器之间如何传输超文本内容.
也是基于tcp/ip协议 客户端与服务器之间必须建立连接

一个http请求包括三部分:
请求行:请求的地址, http版本,,状态码
请求头:客户的信息
*请求体:表单post提交数据的区域

<1>get方式

超链接访问, form表单提交,默认是get方式, 地址栏直接访问
主要用于从服务器获取信息, 通过URL提交数据, 数据在URL里可以看到, 放置的数据一般在1kb左右
注意get请求的中文参数是可以解析到的

<2> post方式

form表单提交, 指定method="POST"
主要是向服务器提交信息, 数据放在请求体里提交, 可以向后端提供大量数据, 数据放在请求体里面
post请求方式的中文数据是解析不到的, 要设置请求编码

<3>请求对象

后端通过继承 HttpServlet 类, 该类重写了servlet里的必要方法,(例如:servlet的构造方法, init方法, service方法, destroy方法),参数里有request对象,respose对象对前端信息,响应信息进行包装
继承该类就只用写需要的dopost与doget方法

HttpServlet 具体关系如下

HttpServlet extends GenericServlet
GenericServlet implements Servlet, ServletConfig, Serializable
所以说就是, 在最上层定义了一个Servlet接口(init, servelt, destory),所有javaEE实现了该接口

注意:Servlet接口里的service(HttpServletRquest,HttpServletRquest )是为前端通过服务的, 每次请求都会被访问 HttpServletRquest 表示请求 HttpServletRespose 表示响应,请求与响应对象里面封装了数据, 具体是服务器里的类实现HttpServletRespose 接口,并且把数据封装进去,java只是规范, 具体实现看服务器

1. request对象与respose对象

  1. http请求 request对象

    通过request对象来获取前端传入的数据

<1>request.getParameter("具体参数名称"),一次只能接收一个数据

<2>request.getParameterValues("具体参数名称") ,一次返回一个String的数组

在这里插入图片描述

注意: 由于前后端解码规则问题, post请求的数据向后端传输时,中文时会乱码, 所以在接收之前(一定要在之前设置)要进行设置编码格式
get请求在Toncat8.0 之后 中文不会乱码

  1. 前端获取后端内容以及respose对象

    可以通过respose对象里封装的printWriter对象向前端发送数据
    由于response会默认以ISO8859-1将需要输出到浏览器的字符进行解码, 如果输出的字符不存在, 就会乱码产生
    所以要设置解码规则:如下
    在这里插入图片描述
    是在响应头的响应内容设置了一种编码格式

在这里插入图片描述print底层也是writer, print可以传入的参数更多

获取后端的响应数据
在这里插入图片描述

2. 响应状态码

在这里插入图片描述

四、Filter过滤器

<1>Filter接口

javaAPI提供Filter接口,编程过程中, 如果java类实现了这个接口, 这个类就叫做过滤器, 用Filter技术可以使得用户在访问某个资源时, 对访问请求和响应进行拦截,请求就不会到达目标的dopost或者doget

作用: 对服务器的web资源进行拦截(权限控制, 通过拦截资源进行权限控制, 是否可以访问 )
如图设置编码过滤器类:
在这里插入图片描述

类比servlet, 自己的过滤器要继承Filter接口, 该接口有三个方法init(), doFilter(), destory()

  1. init()
    该方法是对filter对象进行初始化
    的方法，仅在容器初始化filter对象结束后被调用一次
  2. doFilter()
    该方法是filter进行过滤操作的方法，是最重
    要的方法。过滤器实现类必须实现该方法。方法体中可以对request
    和response进行预处理。其中FilterChain可以将处理后的request
    和response对象传递到过滤链上的下一个资源。
  3. destory()
    该方法在容器销毁过滤器对象前被调用。

参数:FilterChain
过滤链, 这是用来管理过滤器,

<2>使请求继续向下执行

doFilter里的参数FilterChain, 过滤链

作用: 使得请求前往下一个过滤器, 或者 去处理请求
在这里插入图片描述

注意: 这里要在web.xml文件里面配置过滤器, 如下图所示
在这里插入图片描述

一个过滤器可以配置多个资源, 一个资源也可以配置多个过滤器

五、 AJAX (Asynchronous JavaScipt and XML)（异步JavaScript 和 XML)

<1>ajax概述

使用AJAX我们可以无刷新状态更新页面, 并且实现异步请求, 提升用户体验度,以前后端向前端响应数据时, 是将数据封装到一个XML文件里, 前端接收到时解析XML
实质: ajax实质是利用浏览器提供一个特殊对象(XMLHttpRequest)异步的向服务器发送请求,服务器返回部分数据放入特殊对象里, 浏览器去利用对象的这些数据对页面做部分更新, 页面无刷新, 不打断用户操作

XMLHttpRequest对象里的方法:

  1. XMLHttpRequest.open(method,URL,async)方法

    method 这是设置请求的参数
    URL这是请求的地址
    async参数指定是否使用异步请求，其值为true或
    false

  2. XMLHttpRequest.send(content)方法

    content参数指定请求的参数

  3. XMLHttpRequest.setRequestHeader(header,value)方法

    设置请求的头信息

<2> 就绪状态码

通过httpObj.readyState 获取状态码
在这里插入图片描述

<3>原生态的异步代码展示

后端发送数据来改变sapn标签的内容在这里插入图片描述>这里浏览器并不会改变span标签里的内容内外, 浏览器为了安全有一个跨域的保护机制, 第六点来解决跨域问题

<4>axious框架

Axious是ajax框架,一个基于promise的Http库, 可以用在浏览器 和 node.js里
特性:

  1. 可以从浏览器创建XMLHpptRequest对象
  2. 从 node.js 创建http请求
  3. 拦截请求跟响应
  4. 取消请求
  1. 首先要引入axios.js文件或者安装axios的脚手架
    在这里插入图片描述
    在这里插入图片描述
  1. 在main.js里配置axios组件

在这里插入图片描述

//导入axios的Http网络请求库
import axios from 'axios';
axios.defaults.baseURL="http://localhost:8080/webBack_5.14/";//设置访问后端项目地址
Vue.prototype.$http=axios;//将axios挂载到vue的全局对象里, 直接用this可以访问

  1. 然后使用对应的axios的语法

在这里插入图片描述

axious框架实现异步请求 代码演示

在这里插入图片描述

六、 什么是跨域问题?

在这里插入图片描述

浏览器不让从一个域名的网页去请求另一个域名网页的资源,这是浏览器的同源策略造成的, 是javaScript加的安全限制, 不能接收另一个服务器给发送给前端的请求
跨域的定义是: 只要协议 域名 端口 有任何一个不同 就是跨域

<1> 为什么要限制跨域访问
万一是另外一个恶意网站响应的数据,会导致服务器出问题

<2> 为什么要跨域
公司的不同子域需要相互调用资源时

<3>后端解决跨域
后端可以设置响应头的声明,告诉浏览器此次的访问是安全的
location.assign 并不会出现跨域问题, 他会重新开一个窗口,跟原服务器没关系

如下图
重写Filter接口, 重写doFilter方法()在这里插入图片描述

由于我的JDK版本有点问题,所以过滤器接口里的三个方法都要重写, 在新版本的JDK里面innit与destory方法是默认方法不用就不用重写
再将此过滤器配置到web.xml文件里
在这里插入图片描述

七、 Json(JvaaScript Object Natataion javaScript) 即(对象表现形式)是什么?

<1>json概念:
json是一种轻量级的数据交换格式,为了不同语言传输数据的一种标准数据格式
格式:

  1. 数据在键值对存储
    1. 数据由逗号分隔
    2. 大括号保存对象
    3. 方括号保存数组

<2>前后端传输对象
早期是使用XML文件, java把数据写入到xml文件里, 传输到前端js解析数据, 现在通过json数据格式传输
java后端代码 如下:
在这里插入图片描述

直接发送json格式数据
{num:1, name:张三,age:19}

八、前端接收后端的json数据

通过resp对象来获取后端的自定义状态码
resp.data.data.code

resp.data就是响应头里的数据
!\](https://ucc.alicdn.com/images/user-upload-01/ad439ed8154b464eb94b39c74ac2afc5.png)

resp.data.data这是后端封装的结果集对象里的data
在这里插入图片描述

resp.data.data.token,就是admin里的token属性
在这里插入图片描述

文章目录
一 、web开发
二 、运行在web里的Servlet
三、Http请求协议

  1. request对象与respose对象
  2. 响应状态码
    四、Filter过滤器
    五、 AJAX (Asynchronous JavaScipt and XML)（异步JavaScript 和 XML)
    六、 什么是跨域问题?
    七、 Json(JvaaScript Object Natataion javaScript) 即(对象表现形式)是什么?
    八、前端接收后端的json数据
    一 、web开发
    <1>概述:指的是将开发好的web项目部署在web服务器中供外界访问 流行的web服务器有Tomcat,WebSphere,WebLogivc,Jboss
    <2>web环境搭配:

下载安装
在这里插入图片描述

Tomcat目录层次结构
3.

在idea里配置Tomcat

首先点编辑配置
在这里插入图片描述
配置本地tomcat在这里插入图片描述
配置
在这里插入图片描述
二 、运行在web里的Servlet

<1> Servlet是Servlet Applet 的简称, 指的是用java编写的服务器端的程序, 它运行在web服务器中，web服务器负责Servlet和客户的通信以及调用Servlet方法。

servlet作用

接收用户发送的请求数据
调用其他java程序来处理请求
根据处理结果, 将结果响应给客户端

<2>Servlet的创建使用
创建类继承 javax.servlet.http包下的HttpServle
在web.xml文件中配置Servle
运行Servlet程序 开启服务器之后 通过浏览器访问http:localhost:8080/项目名/配置的url
注意: 由于客户端是通过URL地址访问web服务器中的资源，所以Servlet程序若想被外界访问，必须把servlet程序映射到一个URL地址上，这个工作在web.xml文件中使用元素和元素完成。

<3>> 在web-xml文件里设置Servlet配置

Web.xml文件用于对web应用下的web资源进行配置，服务
器在启动时会读取web.xml文件中的内容。
在这里插入图片描述
整数
这里填入如果是大于0的数字就会再服务器启动的时候通过反射机制来创建servlet对象
默认情况下是第一次访问servlet对象时候来创建对象
在这里插入图片描述

三、Http请求协议
即超文本传输协议
http是基与tcp与ip通信协议来传递数据, 是网络模型中的应用层协议, 用来规定浏览器与服务器之间如何传输超文本内容.
也是基于tcp/ip协议 客户端与服务器之间必须建立连接

一个http请求包括三部分:
请求行:请求的地址, http版本,,状态码
请求头:客户的信息
*请求体:表单post提交数据的区域

<1>get方式

超链接访问, form表单提交,默认是get方式, 地址栏直接访问
主要用于从服务器获取信息, 通过URL提交数据, 数据在URL里可以看到, 放置的数据一般在1kb左右
注意get请求的中文参数是可以解析到的

<2> post方式

form表单提交, 指定method=“POST”
主要是向服务器提交信息, 数据放在请求体里提交, 可以向后端提供大量数据, 数据放在请求体里面
post请求方式的中文数据是解析不到的, 要设置请求编码

<3>请求对象

后端通过继承 HttpServlet 类, 该类重写了servlet里的必要方法,(例如:servlet的构造方法, init方法, service方法, destroy方法),参数里有request对象,respose对象对前端信息,响应信息进行包装
继承该类就只用写需要的dopost与doget方法

HttpServlet 具体关系如下

HttpServlet extends GenericServlet
GenericServlet implements Servlet, ServletConfig, Serializable
所以说就是, 在最上层定义了一个Servlet接口(init, servelt, destory),所有javaEE实现了该接口

注意:Servlet接口里的service(HttpServletRquest,HttpServletRquest )是为前端通过服务的, 每次请求都会被访问 HttpServletRquest 表示请求 HttpServletRespose 表示响应,请求与响应对象里面封装了数据, 具体是服务器里的类实现HttpServletRespose 接口,并且把数据封装进去,java只是规范, 具体实现看服务器

  1. request对象与respose对象
    http请求 request对象
    通过request对象来获取前端传入的数据

<1>request.getParameter(“具体参数名称”),一次只能接收一个数据

<2>request.getParameterValues(“具体参数名称”) ,一次返回一个String的数组

在这里插入图片描述

注意: 由于前后端解码规则问题, post请求的数据向后端传输时,中文时会乱码, 所以在接收之前(一定要在之前设置)要进行设置编码格式
get请求在Toncat8.0 之后 中文不会乱码

前端获取后端内容以及respose对象
可以通过respose对象里封装的printWriter对象向前端发送数据
由于response会默认以ISO8859-1将需要输出到浏览器的字符进行解码, 如果输出的字符不存在, 就会乱码产生
所以要设置解码规则:如下
在这里插入图片描述
是在响应头的响应内容设置了一种编码格式

在这里插入图片描述print底层也是writer, print可以传入的参数更多

获取后端的响应数据
在这里插入图片描述

  1. 响应状态码
    在这里插入图片描述

四、Filter过滤器

<1>Filter接口

javaAPI提供Filter接口,编程过程中, 如果java类实现了这个接口, 这个类就叫做过滤器, 用Filter技术可以使得用户在访问某个资源时, 对访问请求和响应进行拦截,请求就不会到达目标的dopost或者doget

作用: 对服务器的web资源进行拦截(权限控制, 通过拦截资源进行权限控制, 是否可以访问 )
如图设置编码过滤器类:
在这里插入图片描述

类比servlet, 自己的过滤器要继承Filter接口, 该接口有三个方法init(), doFilter(), destory()

init()
该方法是对filter对象进行初始化
的方法，仅在容器初始化filter对象结束后被调用一次
doFilter()
该方法是filter进行过滤操作的方法，是最重
要的方法。过滤器实现类必须实现该方法。方法体中可以对request
和response进行预处理。其中FilterChain可以将处理后的request
和response对象传递到过滤链上的下一个资源。
destory()
该方法在容器销毁过滤器对象前被调用。
参数:FilterChain
过滤链, 这是用来管理过滤器,

<2>使请求继续向下执行

doFilter里的参数FilterChain, 过滤链

作用: 使得请求前往下一个过滤器, 或者 去处理请求
在这里插入图片描述

注意: 这里要在web.xml文件里面配置过滤器, 如下图所示
在这里插入图片描述

一个过滤器可以配置多个资源, 一个资源也可以配置多个过滤器

五、 AJAX (Asynchronous JavaScipt and XML)（异步JavaScript 和 XML)

<1>ajax概述

使用AJAX我们可以无刷新状态更新页面, 并且实现异步请求, 提升用户体验度,以前后端向前端响应数据时, 是将数据封装到一个XML文件里, 前端接收到时解析XML
实质: ajax实质是利用浏览器提供一个特殊对象(XMLHttpRequest)异步的向服务器发送请求,服务器返回部分数据放入特殊对象里, 浏览器去利用对象的这些数据对页面做部分更新, 页面无刷新, 不打断用户操作

XMLHttpRequest对象里的方法:

XMLHttpRequest.open(method,URL,async)方法
method 这是设置请求的参数
URL这是请求的地址
async参数指定是否使用异步请求，其值为true或
false

XMLHttpRequest.send(content)方法
content参数指定请求的参数

XMLHttpRequest.setRequestHeader(header,value)方法
设置请求的头信息

<2> 就绪状态码

通过httpObj.readyState 获取状态码
在这里插入图片描述

<3>原生态的异步代码展示

后端发送数据来改变sapn标签的内容在这里插入图片描述>这里浏览器并不会改变span标签里的内容内外, 浏览器为了安全有一个跨域的保护机制, 第六点来解决跨域问题

<4>axious框架

Axious是ajax框架,一个基于promise的Http库, 可以用在浏览器 和 node.js里
特性:

可以从浏览器创建XMLHpptRequest对象
从 node.js 创建http请求
拦截请求跟响应
取消请求
首先要引入axios.js文件或者安装axios的脚手架
在这里插入图片描述
在这里插入图片描述

在main.js里配置axios组件

在这里插入图片描述

//导入axios的Http网络请求库
import axios from ‘axios’;
axios.defaults.baseURL=“http://localhost:8080/webBack_5.14/”;//设置访问后端项目地址
Vue.prototype.$http=axios;//将axios挂载到vue的全局对象里, 直接用this可以访问

然后使用对应的axios的语法
在这里插入图片描述

axious框架实现异步请求 代码演示

在这里插入图片描述

六、 什么是跨域问题?
在这里插入图片描述

浏览器不让从一个域名的网页去请求另一个域名网页的资源,这是浏览器的同源策略造成的, 是javaScript加的安全限制, 不能接收另一个服务器给发送给前端的请求
跨域的定义是: 只要协议 域名 端口 有任何一个不同 就是跨域

<1> 为什么要限制跨域访问
万一是另外一个恶意网站响应的数据,会导致服务器出问题

<2> 为什么要跨域
公司的不同子域需要相互调用资源时

<3>后端解决跨域
后端可以设置响应头的声明,告诉浏览器此次的访问是安全的
location.assign 并不会出现跨域问题, 他会重新开一个窗口,跟原服务器没关系

如下图
重写Filter接口, 重写doFilter方法()在这里插入图片描述

由于我的JDK版本有点问题,所以过滤器接口里的三个方法都要重写, 在新版本的JDK里面innit与destory方法是默认方法不用就不用重写

再将此过滤器配置到web.xml文件里
在这里插入图片描述

七、 Json(JvaaScript Object Natataion javaScript) 即(对象表现形式)是什么?

<1>json概念:

json是一种轻量级的数据交换格式,为了不同语言传输数据的一种标准数据格式
格式:

数据在键值对存储
数据由逗号分隔
大括号保存对象
方括号保存数组

<2>前后端传输对象

早期是使用XML文件, java把数据写入到xml文件里, 传输到前端js解析数据, 现在通过json数据格式传输
java后端代码 如下:
在这里插入图片描述

直接发送json格式数据
{num:1, name:张三,age:19}

八、前端接收后端的json数据
通过resp对象来获取后端的自定义状态码
resp.data.data.code

resp.data就是响应头里的数据

文章标签：
云解析DNS
域名
前端开发
数据格式
Java
JavaScript
XML
关键词：
前端交互
前端Servlet
Servlet交互
Servlet前端
游客hjgt3xacvje4w
目录
相关文章
龙大吉
|
2月前
|
前端开发 API UED
Python后端与前端交互新纪元：AJAX、Fetch API联手，打造极致用户体验！
Python后端与前端交互新纪元：AJAX、Fetch API联手，打造极致用户体验！
龙大吉
86 2
土木林森
|
3月前
|
前端开发 JavaScript API
解锁高效应用构建：Vuex与后端交互的前端状态同步策略，让数据流动如行云流水，紧跟前端开发的热点趋势
【8月更文挑战第27天】本文深入探讨了Vue框架下的前端状态管理库Vuex与后端服务交互时的状态同步策略。通过剖析Vuex的核心机制——状态(State)、变异(Mutation)、动作(Action)及模块(Module)，文章展示了如何优雅地将后端数据加载并更新至前端状态中。特别地，借助示例代码解释了Action处理API调用、Mutation更新状态的过程，并介绍了如何通过模块化和命名空间提高状态管理的准确性和时效性。此外，还讨论了组件如何利用`mapState`和`mapActions`简化状态访问与操作的方法。遵循这些策略，开发者可以在构建复杂应用时显著提升性能与用户体验。
土木林森
45 0
不吃核桃
|
3月前
|
前端开发 JavaScript Serverless
中后台前端开发问题之通过低代码实现前后端交互如何解决
中后台前端开发问题之通过低代码实现前后端交互如何解决
不吃核桃
43 0
不吃核桃
|
3月前
|
前端开发 UED
中后台前端开发问题之中后台前端开发中的复杂交互问题如何解决
中后台前端开发问题之中后台前端开发中的复杂交互问题如何解决
不吃核桃
32 0
土木林森
|
10天前
|
设计模式 前端开发 JavaScript
揭秘！前端大牛们如何巧妙利用JavaScript，打造智能交互体验！
【10月更文挑战第30天】前端开发领域充满了无限可能与创意，JavaScript作为核心语言，凭借强大的功能和灵活性，成为打造智能交互体验的重要工具。本文介绍前端大牛如何利用JavaScript实现平滑滚动、复杂动画、实时数据更新和智能表单验证等效果，展示了JavaScript的多样性和强大能力。
土木林森
26 4
土木林森
|
9天前
|
前端开发 JavaScript 数据处理
前端界的宝藏技术：掌握这些，让你的网页秒变交互神器！
【10月更文挑战第31天】前端开发藏有众多宝藏技术，如JavaScript异步编程和Web Components。异步编程通过Promise、async/await实现复杂的网络请求，提高代码可读性；Web Components则允许创建可重用、封装良好的自定义组件，提升代码复用性和独立性。此外，CSS动画、SVG绘图等技术也极大丰富了网页的视觉和交互体验。不断学习和实践，让网页秒变交互神器。
土木林森
17 2
狗哥不是甜妹
|
5月前
|
存储 前端开发 小程序
表白墙完善（数据库，前端，后端Servlet），再谈Cookie和Session。以及一个关于Cookie的练习小程序
表白墙完善（数据库，前端，后端Servlet），再谈Cookie和Session。以及一个关于Cookie的练习小程序
狗哥不是甜妹
57 4
热爱技术的小郑
|
3月前
|
前端开发 JavaScript
这篇文章介绍了如何使用form表单结合Bootstrap格式将前端数据通过action属性提交到后端的servlet，包括前端表单的创建、数据的一级和二级验证，以及后端servlet的注解和参数获取。
这篇文章介绍了使用AJAX技术将前端页面中表单接收的多个参数快速便捷地传输到后端servlet的方法，并通过示例代码展示了前端JavaScript中的AJAX调用和后端servlet的接收处理。
热爱技术的小郑
29 2
这篇文章介绍了如何使用form表单结合Bootstrap格式将前端数据通过action属性提交到后端的servlet，包括前端表单的创建、数据的一级和二级验证，以及后端servlet的注解和参数获取。
热爱技术的小郑
|
3月前
|
前端开发
第一种方式：使用form表单将前端数据提交到servelt（将前端数据提交到servlet）
这篇文章介绍了如何使用form表单结合Bootstrap格式将前端数据通过action属性提交到后端的servlet，包括前端表单的创建、数据的一级和二级验证，以及后端servlet的注解和参数获取。
热爱技术的小郑
66 2
第一种方式：使用form表单将前端数据提交到servelt（将前端数据提交到servlet）
土木林森
|
3月前
|
开发者 图形学 API
从零起步，深度揭秘：运用Unity引擎及网络编程技术，一步步搭建属于你的实时多人在线对战游戏平台——详尽指南与实战代码解析，带你轻松掌握网络化游戏开发的核心要领与最佳实践路径
【8月更文挑战第31天】构建实时多人对战平台是技术与创意的结合。本文使用成熟的Unity游戏开发引擎，从零开始指导读者搭建简单的实时对战平台。内容涵盖网络架构设计、Unity网络API应用及客户端与服务器通信。首先，创建新项目并选择适合多人游戏的模板，使用推荐的网络传输层。接着，定义基本玩法，如2D多人射击游戏，创建角色预制件并添加Rigidbody2D组件。然后，引入网络身份组件以同步对象状态。通过示例代码展示玩家控制逻辑，包括移动和发射子弹功能。最后，设置服务器端逻辑，处理客户端连接和断开。本文帮助读者掌握构建Unity多人对战平台的核心知识，为进一步开发打下基础。
土木林森
116 0

云原生

热门文章

最新文章

  • 1
    Docker 镜像加速器
  • 2
    Docker CE 镜像源站
  • 3
    Minikube - Kubernetes本地实验环境
  • 4
    重塑云上的 Java 语言
  • 5
    微服务架构的理论基础 - 康威定律
  • 6
    微服务（Microservice）那点事
  • 7
    Docker的Windows容器初体验
  • 8
    Docker学习路线图 (持续更新中)
  • 9
    使用Delve进行Golang代码的调试
  • 10
    使用Docker运行Java Web应用
  • 1
    浏览器拨测：将网站护航的阵地再前推一米
    15
  • 2
    基于事件驱动构建 AI 原生应用
    11
  • 3
    微服务引擎 MSE 及云原生 API 网关 2024 年 10 月产品动态
    6
  • 4
    Spring AI Alibaba 配置管理，用 Nacos 就够了
    11
  • 5
    活动速递丨AI 原生应用开发实战营·北京站邀您参会
    7
  • 6
    Vgo2.0【更新喽】-依然适合golang初学者的开源框架
    14
  • 7
    程序调用大模型返回结构化输出（JSON）
    12
  • 8
    基于大模型的应用的测试的一些注意事项
    10
  • 9
    Testability的追根溯源
    11
  • 10
    流量回放的数据隔离
    11

    • 相关课程

    更多
  • 移动Web前端开发
  • Servlet完全自学手册图文教程
  • 零基础学前端HTML+CSS
  • 前端开发CSS基础
  • 前端开发框架Bootstrap使用教程
  • Servlet入门

    • 相关电子书

    更多
  • Vue.js 在前端服务化上的探索与实践
  • 阿里文娱大前端技术实践
  • 前端代码是怎样智能生成的

    • 相关实验场景

    更多
  • 前端开发基础3：CSS3常见显示属性
  • 前端开发基础6：Node.js和LESS预编译工具
  • 前端开发基础2：VS Code和Edge的联动开发
  • 前端开发基础1：前端开发环境的安装和配置
  • WEB网页编程实战
    • 下一篇
    阿里云OSS设置跨域访问