Http请求响应 Ajax 过滤器

这篇具有很好参考价值的文章主要介绍了Http请求响应 Ajax 过滤器。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

10/10/2023

近期总结:

        最近学的后端部署,web服务器运行,各种请求响应,内容很多,学的很乱,还是需要好好整理,前面JavaSE内容还没有完全掌握,再加上一边刷题,感觉压力很大哈哈。看群友们都在说找工作难,又会被打击,不过感觉一切都以实力说话,提升自己比什么都有说服力,继续加油!

一、HTTP请求

从前端网页中可以向后端发送HTTP请求:
1,在浏览器地址栏输入后端地址;

2,超链接向后端发送http请求;

3,表单向后端发送http请求。

一个http请求包括:请求头,请求行,请求体

http请求方式:

  • POST请求(从客户端向后端发送大量数据。数据在请求体中存放,相对安全,数据无大小限制)
  • GET请求(向后端发送请求,携带少量数据,从后端获取大量数据,不安全,传输数据量有限,1~2Kb) 

http请求方法:

servletRequest.setCharacterEncoding("utf-8");//设置请求正文的字符编码。它确保服务器使用 UTF-8 字符编码正确解释传入数据
String account=req.getParameter("account");//接收请求中我们自己提交的数据
req.getMethod();//获得请求方法
req.getRequestURL();//获得客户端请求地址
req.getHeader();//获得请求头
req.getRemoteAddr();//获得客户端ip

二、HTTP响应(响应行 响应头 响应体)

响应状态码

200 请求成功

404 请求资源不存在

500 服务器内部错误(代码异常) 

http响应方法:

servletResponse.setContentType("text/html;charset=utf-8");//不仅发送到浏览器的内容会使用UTF-8编码,而且还通知浏览器使用UTF-8编码方式进行显示
httpResponse.setHeader("Access-Control-Allow-Origin", httpRequest.getHeader("origin"));//允许所有请求跨域
httpResponse.setHeader("Access-Control-Allow-Methods", "*");//允许跨域的请求方法GET, POST, HEAD 等
httpResponse.setHeader("Access-Control-Allow-Headers", "*");//允许跨域的请求头
httpResponse.setHeader("Access-Control-Allow-Credentials", "true");//是否携带cookie

三、过滤器(Filter)

作用:在请求进入到Servlet之前,让请求进入过滤器进行统一处理。

例如:可以对编码进行统一处理(请求,响应),可以对权限验证进行统一处理....

以对编码处理过滤为例:

 Http请求响应 Ajax 过滤器,后端,前端,服务器部署,前端,java,后端,服务器,servlet,ajax

1,创建一个专门编写过滤器的文件夹,创建.java文件,编写专门处理编码问题的代码。

import javax.servlet.*;
import java.io.IOException;

public class Encoding implements Filter {

    @Override
    public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain) throws IOException, ServletException {
        servletRequest.setCharacterEncoding("utf-8");//设置请求正文的字符编码。它确保服务器使用 UTF-8 字符编码正确解释传入数据
        servletResponse.setContentType("text/html;charset=utf-8");//不仅发送到浏览器的内容会使用UTF-8编码,而且还通知浏览器使用UTF-8编码方式进行显示
        filterChain.doFilter(servletRequest,servletResponse);//继续向后执行,后一个可能是下一个过滤器,也可能是Servlet
    }
}

2,对web.xml进行配置,为什么要配置web.xml(原因很简单,因为每次启动servlet时,服务器都会首先读取web.xml文件,这样过滤器才能被读取)

<filter>
        <filter-name>Encoding</filter-name>
        <filter-class>com.ffyc.webserver.filter.Encoding</filter-class>
    </filter>
    <filter-mapping>
        <filter-name>Encoding</filter-name>
        <url-pattern>/*</url-pattern>
<!--        /*代表所有地址均可进入过滤器   -->
    </filter-mapping>

四、前端向后端发送请求方式:

1,同步方式

在前端向后端发送请求后,后端返回的内容会打断前端用户操作。

2,异步方式(不同步)

后端响应回来的内容不会打断前端用户操作

异步请求已经成为前后端交互的标配


 如何从前端向后端发送异步请求?

1,使用原生的js发送异步请求

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
	</head>
	<script src="js/axios.min.js"></script>
	<body>
		<form method="post">
			<input type="text" placeholder="账号" name="account" onblur="checkAccount(this.value)"><span id="msgid"></span><br>
			<input type="password" placeholder="密码" name="password"><br>
			<input type="submit" value="登录"/>
			
		</form>
		<script>
			function checkAccount(account){
				var reqobj=new XMLHttpRequest();
					reqobj.open("get","http://localhost:8088/webServer/LoginServlet?account="+account);//准备请求
					reqobj.send();//发送请求
					reqobj.onreadystatechange=function(){
						document.getElementById("msgid").innerHTML=reqobj.responseText;
					}
			}
		</script>
	</body>
</html>

 2,使用ajax框架(网络请求库)例如axious

Ajax:可以无刷新状态更新页面,解决了打断前端用户操作的问题,实现了异步提交。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
	</head>
	<script src="js/axios.min.js"></script>
	<body>
		<form method="post">
			<input type="text" placeholder="账号" name="account" onblur="checkAccount(this.value)"><span id="msgid"></span><br>
			<input type="password" placeholder="密码" name="password"><br>
			<input type="submit" value="登录"/>
			
		</form>
		<script>
			function checkAccount(account){
				   axios.get("http://localhost:8088/webServer/LoginServlet?account="+account).then(a=>{
				 	document.getElementById("msgid").innerHTML=a.data;
				 })
			}
		</script>
	</body>
</html>

注意:记得在后端添加过滤器

package com.ffyc.webserver.filter;

import javax.servlet.*;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;


public class CorsFilter implements Filter {
    public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain)
            throws IOException, ServletException {
        HttpServletResponse httpResponse = (HttpServletResponse) servletResponse;
        HttpServletRequest httpRequest = (HttpServletRequest) servletRequest;
        //允许携带Cookie时不能设置为* 否则前端报错
        httpResponse.setHeader("Access-Control-Allow-Origin", httpRequest.getHeader("origin"));//允许所有请求跨域
        httpResponse.setHeader("Access-Control-Allow-Methods", "*");//允许跨域的请求方法GET, POST, HEAD 等
        httpResponse.setHeader("Access-Control-Allow-Headers", "*");//允许跨域的请求头
        httpResponse.setHeader("Access-Control-Allow-Credentials", "true");//是否携带cookie

        filterChain.doFilter(servletRequest, servletResponse);
    }
}

配置web.xml文章来源地址https://www.toymoban.com/news/detail-726533.html

    <filter>
        <filter-name>corss</filter-name>
        <filter-class>com.ffyc.webserver.filter.CorsFilter</filter-class>
    </filter>
    <filter-mapping>
        <filter-name>corss</filter-name>
        <url-pattern>/*</url-pattern>
    </filter-mapping>

到了这里,关于Http请求响应 Ajax 过滤器的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • SpringCloud GateWay通过过滤器GatewayFilter修改请求或响应内容

    Spring Cloud Gateway在有些场景中需要获取request body内容进行参数校验或参数修改,我们通过在GatewayFilter中获取请求内容来获取和修改请求体,下面我们就基于ServerWebExchange来实现: ServerWebExchange命名为服务网络交换器,存放着重要的请求-响应属性、请求实例和响应实例等等,有

    2024年02月16日
    浏览(54)
  • java在过滤器中为http请求加请求头header

            现在有一个需求场景:每一个请求我都需要在请求头里面加上token这个请求头,作为一种校验机制,传统的接口可以通过设置一个全局的变量,然后通过页面携带过来(大概就是先将我们的token放在session中,写一个服务用来获取session中的token,然后主页面用 ajax 调

    2024年02月12日
    浏览(39)
  • [后端开发] 过滤器相关注解

    使用Springboot框架开发后端,在鉴权的时候使用到了过滤器。但是在测试的过程发现,跨域的过滤器在过滤链中出现了两次,导致前端访问后端接口时报错:The \\\'Access-Control-Allow-Origin\\\' headers contains multiple values,but only one allowed.错误 在浏览器端比较正常访问接口和报错接口的hea

    2024年04月16日
    浏览(45)
  • SpringBoot很实用的请求过滤器 - FilterRegistrationBean

    在日常的开发中,我们的项目可能会被各种各样的客户端进行访问,那么,一些带有意图的朋友,就会利用自己所学的技术进行有目的的访问,那么我们的服务端就不再安全和可靠, 我相信每位开发者都知道爬虫这种东西,那么当我们的请求不再安全,那么我们后台的数据就

    2024年02月07日
    浏览(36)
  • 前端异步请求并解决跨域问题(Ajax+axios框架)、后端响应多个数据(JSON)

    目录 一、前后端同步异步请求 1.同步请求: 2.异步请求: 3.跨域问题(前端问题) 4.axios框架(封装后) 二、后端向前端响应多个数据-JSON 1.同步请求:         发送一个请求,回应请求,回应的内容会覆盖浏览器中的内容,这样会 打断 前端其他的正常操作。 2.异步请求:

    2024年02月07日
    浏览(71)
  • 【Spring Security】使用 OncePerRequestFilter 过滤器校验登录过期、请求日志等操作

    OncePerRequestFilter 是一个过滤器,每个请求都会执行一次;一般开发中主要是做检查是否已登录、Token是否过期和授权等操作,而每个操作都是一个过滤器,下面演示一下。 检查是否登录过期过滤器 检查是否登录过期过滤器 End

    2024年02月10日
    浏览(69)
  • 从Spring Cloud Gateway过滤器中获取请求体的最优方案

    在spring cloud gateway出现这个问题的时候我们第一反应应该很简单,但是真正实现的时候却有点困难。我看了很多相关的文档,感觉太多都不清晰而且解决不了问题。下面我就把我的方便理解的解决方案写下来。 1. 先重写请求体(过滤器优先级一定要在要获取body之前执行) 这

    2024年02月16日
    浏览(47)
  • jQuery选择器(二)(基本过滤器,内容过滤器,可见过滤器)

    写在前面 jQuery是一个快速、简洁的 JavaScript 框架,是继Prototype之后又一个优秀的 JavaScript 代码库。jQuery的设计宗旨是“WriteLess,DoMore”,即倡导写更少的代码,做 更多的事情。jQuery封装了 JavaScript 常用的功能代码,提供一种简便的 JavaScript 设计模式,优化HTML文档操作、事件

    2024年02月02日
    浏览(54)
  • Gateway自定义过滤器——全局过滤器

    首先,我们要知道全局过滤器其实是特殊路由过滤器(特殊的GatewayFilter),会有条件地作用于所有路由。 为什么要自定义全局过滤器?就好比是看大门的保安大叔,平时主要是做好进出大门外来人员登记即可,但是因为新冠疫情,现在还需要给外来人员测量体温等等。而已有的

    2024年02月16日
    浏览(47)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包