vue跨域解决方案 简书_springboot允许跨域

vue跨域解决方案 简书_springboot允许跨域一:为什么会出现跨域问题?出于浏览器的同源策略限制。同源策略(Sameoriginpolicy)是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正常功能可能都会受到影响。可以说Web是构建在同源策略基础之上的,浏览器只是针对同源策略的一种实现。同源策略会阻止一个域的javascript脚本和另外一个域的内容进行交互。所谓同源(即指在同一个域)就是两个页面具有相同的协议(protocol),主机(host)和端口号(port)。二:什么是跨域?当一个请求url的协议、域

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺

一:为什么会出现跨域问题?

出于浏览器的同源策略限制。 同源策略(Sameoriginpolicy)是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正常功能可能都会受到影响。可以说Web是构建在同源策略基础之上的,浏览器只是针对同源策略的一种实现。同源策略会阻止一个域的javascript脚本和另外一个域的内容进行交互。所谓同源(即指在同一个域)就是两个页面具有相同的协议(protocol),主机(host)和端口号(port)。

二:什么是跨域?

当一个请求url的协议、域名、端口三者之间任意一个与当前页面url不同即为跨域。
1 . 两个相同的源之间浏览器默认其是可以相互访问资源和操作DOM的。
2 .两个不同的源之间 若想要相互访问资源或者操作DOM,那么会有一套基础的安全策略的制约。

三:后台解决方案

1.方法一:@CrossOrigin
注意:
1、springMVC的版本要在4.2或以上版本才支持@CrossOrigin
2、非@CrossOrigin没有解决跨域请求问题,而是不正确的请求导致无法得到预期的响应,导致浏览器端提示跨域问题。
3、在Controller注解上方添加@CrossOrigin注解后,仍然出现跨域问题,解决方案之一就是:在@RequestMapping注解中没有指定Get、Post方式,具体指定后,问题解决。其中@CrossOrigin中的2个参数:origins : 允许可访问的域列表
maxAge:准备响应前的缓存持续的最大时间(以秒为单位)。可以配置在Controller上 也可以配置在方法上。

2. 方法二: 过滤器

package com.sysg.config;


import org.springframework.core.annotation.Order;
import org.springframework.stereotype.Component;

import javax.servlet.*;
import javax.servlet.annotation.WebFilter;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;


/** * @author 77916 */

@Component
@Order(1)
@WebFilter(filterName = "CoresFilter", urlPatterns = "/*")
public class CoresFilter implements Filter { 
   
    @Override
    public void destroy() { 
   

    }

    @Override
    public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain)
            throws IOException, ServletException { 
   
        HttpServletResponse response = (HttpServletResponse) servletResponse;
        //表示所有的域都可以接受
        response.setHeader("Access-Control-Allow-Origin", "*");
        //允许所有的方法
        response.setHeader("Access-Control-Allow-Methods","POST,GET,DELETE,PUT,OPTIONS");
        //请求得到结果的有效期
        response.setHeader("Access-Control-Max-Age","3600");
        response.setHeader("Access-Control-Allow-Headers","x-requested-with,Content-Type,access-control-allow-origin,version-info");
        //该值是一个boolean值,表示允许发送cookie,默认情况下cookie不包含在cores中,设置为true
        response.setHeader("Access-Control-Allow-Credentials","true");
        filterChain.doFilter(servletRequest,servletResponse);
    }

    @Override
    public void init(FilterConfig filterConfig) throws ServletException { 
   

    }
}

web.xml(写在/webapp/WEB-INF目录下)
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"
         version="4.0">
    <!-- 跨域问题解决 -->
    <filter>
        <filter-name>CoresFilter</filter-name>
        <filter-class>com.sysg.config.CoresFilter</filter-class>
        <init-param>
            <param-name>IsCross</param-name>
            <param-value>true</param-value>
        </init-param>
        <init-param>
            <param-name>encoding</param-name>
            <param-value>UTF-8</param-value>
        </init-param>
    </filter>
    <filter-mapping>
        <filter-name>CoresFilter</filter-name>
        <url-pattern>/*</url-pattern> </filter-mapping> </web-app> 

3. 方法三:配置(SpringBoot)

package com.sysg.config;

import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.CorsRegistry;
import org.springframework.web.servlet.config.annotation.EnableWebMvc;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;

@Configuration
@EnableWebMvc
public class WebMvcConfig implements WebMvcConfigurer { 
   
    @Override
    public void addCorsMappings(CorsRegistry registry) { 
   
        registry.addMapping("/**")
                .allowedOrigins("*")
                .allowedHeaders("*")
                .allowedMethods("GET", "POST", "PUT", "OPTIONS", "DELETE", "PATCH")
                .maxAge(3600);
    }
}


注意:配置类文件一定要写在启动类所在的包下,否则不生效。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/192996.html原文链接:https://javaforall.net

(0)
上一篇 2025年12月4日 上午9:15
下一篇 2025年12月4日 上午9:43


相关推荐

  • phpstorm中完成一键快速注释函数头

    phpstorm中完成一键快速注释函数头

    2021年10月31日
    61
  • UE-9260使用说明1

    UE-9260使用说明1

    2022年1月26日
    100
  • pycharm添加解释器失败_pycharm更新python解释器

    pycharm添加解释器失败_pycharm更新python解释器求大神告知:Pycharm添加Python解释器提示:CannotsetupapythonSDKatPython3.8(untitled5)(H:\Python\python-3.8.2-amd64.exe).TheSDKseemsinvalid.并且Python一直出现ModifySetup怎么解决?…

    2022年8月26日
    9
  • 设计模式学习之访问者模式

    设计模式学习之访问者模式访问者模式 是行为型设计模式之一 访问者模式是一种将数据操作与数据结构分离的设计模式 它可以算是 23 中设计模式中最复杂的一个 但它的使用频率并不是很高 大多数情况下 你并不需要使用访问者模式 但是当你一旦需要使用它时 那你就是需要使用它了 访问者模式的基本想法是 软件系统中拥有一个由许多对象构成的 比较稳定的对象结构 这些对象的类都拥有一个 accept 方法用来接受访问者对象的访问 访问者是

    2026年3月19日
    1
  • java timsort_JDK(二)JDK1.8源码分析【排序】timsort

    java timsort_JDK(二)JDK1.8源码分析【排序】timsort如无特殊说明 文中的代码均是 JDK1 8 版本 在 JDK 集合框架中描述过 JDK 存储一组 Object 的集合框架是 Collection 而针对 Collection 框架的一组操作集合体是 Collections 里面包含了多种针对 Collection 的操作 例如 排序 查找 交换 反转 复制等 这一节讲述 Collections 的排序操作 publicstatic gt voidsort List

    2026年3月16日
    3
  • 最详细完整的flex弹性布局

    最详细完整的flex弹性布局初了解在学习弹性布局之前首先就要明白其概念 flex 就是 flexiblebox 的缩写 意为弹性布局 用来为盒装模型提供最大的灵活性任何一个容器都可以指定为 flex 布局 box display flex 行内元素当然也可以使用 flex 布局 box display inline flex Webkit 内核的浏览器 必须加上 webkit 前缀 box display webkit flex Safari display flex

    2026年3月17日
    2

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号