tomcat 添加CROS跨源请求

本文介绍了一种解决通过工具远程访问REST API时出现的跨源请求被阻止的问题的方法。通过添加自定义的CorsFilter过滤器,允许所有来源的请求,并配置了必要的头部信息以解决CORS请求失败的错误。

通过工具远程访问rest会出现

 已阻止跨源请求:同源策略禁止读取位于 http://XXXXX:1200/gyly/busData 的远程资源。(原因:CORS 请求失败)。 
修改方法
添加Filter
import java.io.IOException;

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

import org.springframework.web.filter.OncePerRequestFilter;

public class CorsFilter extends OncePerRequestFilter {

 @Override
    protected void doFilterInternal(HttpServletRequest request, HttpServletResponse response, FilterChain filterChain)
            throws ServletException, IOException {
    response.addHeader("Access-Control-Allow-Origin", "*");
    response.addHeader("Access-Control-Allow-Methods",
            "GET, POST, PUT, DELETE, OPTIONS");
    response.addHeader("Access-Control-Allow-Headers",
            "origin, content-type, accept, x-requested-with, sid, mycustom, smuser");
        filterChain.doFilter(request, response);
    }
}

修改web.xml
 <filter>
	  <filter-name>CorsFilter</filter-name>
	  <filter-class>com.interfaceservice.filter.CorsFilter</filter-class>
	</filter>
	<filter-mapping>
	  <filter-name>CorsFilter</filter-name>
	  <url-pattern>/*</url-pattern>
	</filter-mapping>



请求头中设置 CORS 主要是在服务器端进行操作,通过设置特定的 HTTP 响应头来允许请求。以下是不同后端语言设置 CORS 请求头的示例: #### Node.js + Koa 框架 ```javascript const koa = require('koa'); const app = new koa(); app.use(async function(ctx, next) { // 允许所有来请求 ctx.set("Access-Control-Allow-Origin", '*'); // 允许携带凭证(如 cookie) // ctx.set("Access-Control-Allow-Credentials", true); // 预检请求的有效期(秒) // ctx.set("Access-Control-Max-Age", 86400000); // 允许的请求方法 // ctx.set("Access-Control-Allow-Methods", "OPTIONS, GET, PUT, POST, DELETE"); // 允许的请求头 // ctx.set("Access-Control-Allow-Headers", "x-requested-with, accept, origin, content-type"); await next(); }); app.use(async (ctx) => { ctx.body = ctx; }); app.listen(3003, () => { console.log('done2'); }); ``` 此示例展示了使用 Koa 框架设置 CORS 请求头的方法,通过 `ctx.set` 方法设置不同的响应头来控制请求的规则 [^5]。 #### PHP 在 PHP 中,可以通过 `header` 函数来设置 CORS 响应头: ```php <?php // 允许所有来请求 header("Access-Control-Allow-Origin: *"); // 允许的请求方法 header("Access-Control-Allow-Methods: GET, POST, PUT, DELETE, OPTIONS"); // 允许的请求头 header("Access-Control-Allow-Headers: Content-Type, X-Requested-With"); // 处理请求的代码 if ($_SERVER['REQUEST_METHOD'] === 'OPTIONS') { // 预检请求直接返回 200 http_response_code(200); exit; } // 正常处理其他请求 // ... ?> ``` #### Python + Flask 框架 ```python from flask import Flask, request app = Flask(__name__) @app.after_request def after_request(response): # 允许所有来请求 response.headers['Access-Control-Allow-Origin'] = '*' # 允许的请求方法 response.headers['Access-Control-Allow-Methods'] = 'GET, POST, PUT, DELETE, OPTIONS' # 允许的请求头 response.headers['Access-Control-Allow-Headers'] = 'Content-Type, X-Requested-With' return response @app.route('/', methods=['GET', 'POST']) def index(): return 'Hello, World!' if __name__ == '__main__': app.run(debug=True) ``` ### 注意事项 - `Access-Control-Allow-Origin`:指定允许访问该资的外域 URI。如果要允许所有域名进行域调用,可以使用通配符 `*`,但如果请求头中有 `token`,则不能使用通配符 [^3]。 - `Access-Control-Allow-Methods`:指定允许的请求方法,用逗号分隔。 - `Access-Control-Allow-Headers`:指定允许的请求头,用逗号分隔,如 `Content-Type,X-Requested-With,accept,Origin` 等 [^1]。
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值