web开发必备之跨域

1.什么是跨域?

当一个请求url的协议、域名、端口三者之间任意一个与当前页面url不同即为跨域
举个例子或许比较生动

当前所在页面请求的页面是否同域原因
https://www.csdn.net/https://blog.csdn.net/weixin_56703682同源(同域名同协议同端口)
https://www.csdn.net/http://www.csdn.net/×协议不同(http/https)
https://www.csdn.net/https://github.com/×主域名不同
https://www.csdn.net/https://www.blog.csdn.net/×协议不同
http://www.test.com:8848http://www.test.com:8080/×端口不同

2.为什么会出现跨域

跨域问题通常是由于浏览器的同源策略引起的。同源策略要求网页上的脚本只能读取来自同一源(协议、域名、端口)的响应,而不能读取其他源的信息。如果一个网页包含的脚本试图去读取来自不同源的数据,就会触发跨域问题。

这样的设计是为了保护用户的隐私和安全,防止恶意网站窃取用户的信息。然而,它也带来了一些限制,特别是对于现代Web应用来说,跨域访问是很常见的需求,比如从一个域名下请求API接口数据等。

3.怎么解决跨域

为了解决跨域问题,可以采取多种方法,比如使用JSONP、CORS(跨域资源共享)、代理、iframe消息传递等等。

通过使用请求头来解决

通过设置 CORS(跨域资源共享)相关的请求头来实现跨域请求。
java中如何使用springboot来解决呢?
https://spring.io/guides/gs/rest-service-cors

配置的pom.xml

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
	<modelVersion>4.0.0</modelVersion>
	<parent>
		<groupId>org.springframework.boot</groupId>
		<artifactId>spring-boot-starter-parent</artifactId>
		<version>3.2.0</version>
		<relativePath/> <!-- lookup parent from repository -->
	</parent>
	<groupId>com.example</groupId>
	<artifactId>rest-service-cors-complete</artifactId>
	<version>0.0.1-SNAPSHOT</version>
	<name>rest-service-cors-complete</name>
	<description>Demo project for Spring Boot</description>
	<properties>
		<java.version>17</java.version>
	</properties>
	<dependencies>
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-web</artifactId>
		</dependency>
		<dependency>
			<groupId>org.apache.httpcomponents.client5</groupId>
			<artifactId>httpclient5</artifactId>
			<scope>test</scope>
		</dependency>
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-test</artifactId>
			<scope>test</scope>
		</dependency>
	</dependencies>

	<build>
		<plugins>
			<plugin>
				<groupId>org.springframework.boot</groupId>
				<artifactId>spring-boot-maven-plugin</artifactId>
			</plugin>
		</plugins>
	</build>

</project>

在 Java 中实现跨域请求通常涉及到一些网络编程和设置响应头的工作。以下是一些基本的方法来实现跨域请求:

  1. 使用 HttpServletResponse 设置响应头:在处理请求的 Java 代码中,可以通过 HttpServletResponse 对象设置一些响应头信息,以允许跨域请求。例如,设置允许的域名、请求方法、头部信息等。
response.setHeader("Access-Control-Allow-Origin", "http://example.com"); // 设置允许跨域的域名
response.setHeader("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, OPTIONS"); // 设置允许的请求方法
response.setHeader("Access-Control-Allow-Headers", "Content-Type, Authorization"); // 设置允许的请求头部信息
response.setHeader("Access-Control-Max-Age", "3600"); // 设置预检请求的缓存时间
response.setHeader("Access-Control-Allow-Credentials", "true"); // 设置是否允许发送 Cookie
  1. 使用 Filter 进行统一处理:可以编写一个 Filter 来统一处理跨域请求,通过设置响应头来实现跨域访问的授权。
public class CorsFilter implements Filter {
    @Override
    public void doFilter(ServletRequest request, ServletResponse response, FilterChain chain)
            throws IOException, ServletException {
        HttpServletResponse httpResponse = (HttpServletResponse) response;
        // 设置允许跨域的域名
        httpResponse.addHeader("Access-Control-Allow-Origin", "http://example.com");
        // 设置允许的请求方法
        httpResponse.addHeader("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, OPTIONS");
        // 设置允许的请求头部信息
        httpResponse.addHeader("Access-Control-Allow-Headers", "Content-Type, Authorization");
        // 设置预检请求的缓存时间
        httpResponse.addHeader("Access-Control-Max-Age", "3600");
        // 设置是否允许发送 Cookie
        httpResponse.addHeader("Access-Control-Allow-Credentials", "true");

        chain.doFilter(request, response);
    }
}
  • 3
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值