servlet处理跨域请求
前言
我们要做的是让在一个不在当前项目文件夹的前端页面发送Ajax请求,由一个远程servlet处理
代码
创建一个web工程
导入所需的jar-> servlet-api.jar fastjson.jar
编写前端页面
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<input type="button" value="get" id='get'>
<input type="button" value="POST" id='post'>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
<script>
let data = {
name: '狗剩',
age: 20
}
$("#get").on('click', function() {
$.ajax({
type: 'get',
contentType:'application/json', //data发送方式
url: 'http://localhost/TestServlet', //发送跨域请求
data: data,
success: (res) => {
console.log("res:", res)
}
})
})
$("#post").on('click', function() {
$.ajax({
type: 'post',
contentType:'application/json',
url: 'http://localhost/TestServlet',
data: JSON.stringify(data),
success: (res) => {
console.log("res:", res)
}
})
})
</script>
</body>
</html>
- 配置一个Filter处理跨域请求
import javax.servlet.*;
import javax.servlet.http.HttpFilter;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
public class Filter extends HttpFilter {
@Override
public void doFilter(ServletRequest req, ServletResponse resp, FilterChain chain) throws ServletException, IOException {
//设置跨域请求
System.out.println("Filter 过滤器 执行 了");
HttpServletRequest request = (HttpServletRequest)req;
HttpServletResponse response = (HttpServletResponse)resp;
//允许跨域主机地址
response.setHeader("Access-Control-Allow-Origin", "*");
//允许跨域方法
response.setHeader("Access-Control-Allow-Methods", "POST, DELETE,PUT,GET,OPTIONS");
//缓存时间
response.setHeader("Access-Control-Max-Age", "3600");
//允许跨域的请求头
response.setHeader("Access-Control-Allow-Headers", "*");
//是否携带cookie
response.setHeader("Access-Control-Allow-Credentials", "true");
//允许放行
chain.doFilter(request, response);
}
}
- 编写servlet处理请求
import com.alibaba.fastjson.JSON;
import javax.servlet.ServletException;
import javax.servlet.ServletInputStream;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.BufferedReader;
import java.io.IOException;
import java.io.InputStreamReader;
import java.util.Map;
public class TestServlet extends HttpServlet {
@Override
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
System.out.println("请求已到达-> post");
request.setCharacterEncoding("utf-8");
ServletInputStream inputStream = request.getInputStream();
BufferedReader br = new BufferedReader(new InputStreamReader(inputStream));
StringBuilder sb = new StringBuilder();
String str = null;
while((str = br.readLine()) != null) {
sb.append(str);
}
System.out.println(sb.toString());
//转为map集合
Map parseObject = JSON.parseObject(sb.toString(), Map.class);
System.out.println("parseObject:" + parseObject);
}
@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
System.out.println("请求已到达-> get");
request.setCharacterEncoding("UTF-8");
String name = request.getParameter("name");
int age = Integer.parseInt(request.getParameter("age"));
System.out.println("name:" + name + ", age:" + age);
}
}
- 配置web.xml
<filter>
<filter-name>Filter</filter-name>
<filter-class>Filter</filter-class>
</filter>
<filter-mapping>
<filter-name>Filter</filter-name>
<!-- 配置需要进行跨域的接口 -->
<url-pattern>/*</url-pattern>
</filter-mapping>
<servlet>
<!--servlet名 -->
<servlet-name>Test</servlet-name>
<!-- servlet路径,包名.类名 -->
<servlet-class>TestServlet</servlet-class>
</servlet>
<servlet-mapping>
<!--servlet映射,必须与servlet-name同名 -->
<servlet-name>Test</servlet-name>
<!--浏览器中输入的访问该servlet的url-->
<url-pattern>/TestServlet</url-pattern>
</servlet-mapping>
- 部署项目,启动服务器,测试跨域请求
结语
//需要注意的是前端Ajax请求的url
url: 'http://localhost/TestServlet'
//servlet的web.xml配置
<url-pattern>/TestServlet</url-pattern>
//localhost后面的地址和xml配置的地址一致即可
servlet处理跨域请求的更多相关文章
- 巧妙利用JQuery和Servlet来实现跨域请求
在网上看到很多的JQuery跨域请求的文章,比较有意思.这里我发表一个Servlet与JQuery配置实现跨域的代码,供大家参考.不足之处请指教 原理:JavaScript的Ajax不可以跨域,但是可 ...
- JQuery和Servlet来实现跨域请求
在网上看到很多的JQuery跨域请求的文章,比较有意思.这里我发表一个Servlet与JQuery配置实现跨域的代码,供大家参考.不足之处请指教 原理:JavaScript的Ajax不可以跨域,但是可 ...
- [转]Ajax跨域请求
一.编一个服务器端servlet @RequestMapping("/haha") @ResponseBody String haha(String haha, HttpServl ...
- 实现跨域请求jsonp方式
原理:http://madong.net.cn/index.php/2012/12/368/ 调用端: $.getJSON("http://192.168.220.85:8001/esb/a ...
- javascript跨域请求RESTful Web Service
跨域请求RESTful Web Service 当我们用js请求RESTful Web Service的时候,通常会出现跨域无法访问的问题,也就是无法正常得到我们要的值.jsonp是个解决问题的方法. ...
- 有关Ajax跨域请求的解决方案
前言 最近博主在赶项目进度.所以微信二次开发那边的博文一直没有更新.后续时间会慢慢记录这个学习历程的.来年公司要开发微信小程序.到时也会记录一下历程. 闲话少说,今天在工作中遇到了SpringMVC接 ...
- Spring Boot Web应用开发 CORS 跨域请求支持:
Spring Boot Web应用开发 CORS 跨域请求支持: 一.Web开发经常会遇到跨域问题,解决方案有:jsonp,iframe,CORS等等CORS与JSONP相比 1. JSONP只能实现 ...
- SpringMVC处理跨域请求时的一个注意事项
由于公司对SpingMVC框架里面的东西进行了扩展,在配置SpringMVC时没有使用<mvc:annotation-driven>这个标签.而且是自己手动来配置HandlerMa ...
- spring mvc \ spring boot 允许跨域请求 配置类
用@Component 注释下,随便放个地方就可以了 package com.chinaws.wsarchivesserver.core.config; import org.springframew ...
随机推荐
- javascript里面的document.getElementById
一.getElementById:获取对 ID 标签属性为指定值的第一个对象的引用,它有 value 和 length 等属性 1.获取当前页面的值input标签值:var attr1=documen ...
- git clone 中途停止不动
参考链接1:https://blog.csdn.net/weixin_36965307/article/details/105046699 参考链接2:https://blog.csdn.net/le ...
- 第八篇--编写Windows服务
编写service服务参考网址:https://blog.csdn.net/nodeathphoenix/article/details/24181509 vc获得显示器状态(捕获息屏.亮屏网址):h ...
- linux下利用JMX监控Tomcat
利用JMX监控Tomcat,就是相当于部署在tomcat上的应用作为服务端,也就是被管理资源的对象.然后通过程序或者jconsole远程连接到该应用上来.远程连接需要服务器端提供ip和port.如果需 ...
- solr(CVE-2017-12629)远程命令执行
影响版本Apache Solr 5.5.0到7.0.1版本 solr(CVE-2017-12629-RCE) 环境搭建 1.burp检测 创建listen POST /solr/demo/config ...
- 2020国防科大综述:3D点云深度学习——综述(3D点云分割部分)
目录 摘要 1.引言: 2.背景 2.1 数据集 2.2评价指标 3.3D点云分割 3.1 3D语义分割 3.1.1 基于投影的方法 多视图表示 球形表示 3.1.2 基于离散的方法 稠密离散表示 稀 ...
- YOLO-V4 实现口罩识别(附加数据、数据批量处理程序)
一.YOLO-v4概念 如果想要了解和认识yolo-v4的基本概念,首先要提的就是它的基础版本yolo-v1,对于yolo来说,最经典的算是yolo-v3.如果想要了解它的由来和历史的话,可以自行搜索 ...
- Netty入门(三):EventLoop
前言 Netty系列索引: 1.Netty入门(一):ByteBuf 2.Netty入门(二):Channel IO相关: 1.Java基础(一):I/O多路复用模型及Linux中的应用 上文提到,早 ...
- 腾讯技术团队整理,为什么 Flutter 能最好地改变移动开发
导语 | Flutter 框架是当下非常热门的跨端解决方案,能够帮助开发者通过一套代码库高效构建多平台精美应用,支持移动.Web.桌面等多端开发.但仍然有很多产品.设计.甚至开发同学并不了解 Flut ...
- 且看一文梳理VS2019中dll的创建使用
动态链接库(dll) Windows下有静态链接(lib)库和动态链接库(dll)两种共享代码的方式. 本文将介绍dll的应用场景,以及在vs2019平台下的生成和使用. 今天的笔记内容说的是平时经常 ...