Spring Boot 如何解决富文本上传图片跨域问题

Spring Boot 如何解决富文本上传图片跨域问题

目录Spring Boot 解决富文本上传图片跨域创建一个WebMvcConfig类创建一个Filter类，做页面跨域的处理springboot文件上传跨域前端后端

Spring Boot 解决富文本上传图片跨域

在前后端分离的情况下，后台所写的接口在前端调用的时候，可能前端浏览器已经读取到了数据，但是在前端代码ajax请求的时候，请求回调里会出现页面跨域的控制台打印错误，这个时候只需要后台配置一下头部请求就可以解决

我用的是SpringBoot，讲解一下如何配置SpringBoot来解决页面跨域问题

创建一个WebMvcConfig类

将关于web的配置信息都用注解的形式来配置，相对比较方便

import com.alibaba.fastjson.serializer.SerializerFeature;

import com.alibaba.fastjson.support.config.FastJsonConfig;

import com.alibaba.fastjson.support.spring.FastJsonHttpMessageConverter;

import com.uhope.web.codegenerator.filter.ServiceFilter;

import org.slf4j.Logger;

import org.slf4j.LoggerFactory;

import org.springframework.boot.autoconfigure.http.HttpMessageConverters;

import org.springframework.boot.web.servlet.FilterRegistrationBean;

import org.springframework.context.annotation.Bean;

import org.springframework.context.annotation.Configuration;

import org.springframework.http.converter.HttpMessageConverter;

import org.springframework.web.servlet.config.annotation.ResourceHandlerRegistry;

import org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter;

import java.nio.charset.Charset;

/**

* Spring MVC 配置

* @author Chenbin

*/

@Configuration

public class WebMvcConfig extends WebMvcConfigurerAdapter {

private final Logger logger = LoggerFactory.getLogger(WebMvcConfig.class);

/**

* 解决路径资源映射问题

*

* @param registry

*/

@Override

public void addResourceHandlers(ResourceHandlerRegistry registry) {

registry.addResourceHandler("swagger-ui.html").addResourceLocations("classpath:/META-INF/resources/");

registry.addResourceHandler("/webjars/**").addResourceLocations("classpath:/META-INF/resources/webjars/");

registry.addResourceHandler("/static/**").addResourceLocations("classpath:/static/");

}

/**

* 使用fastJson代替Jackjson解析JSON数据

*

* @return

*/

@Bean

public HttpMessageConverters fastJsonHttpMessageConverters() {

FastJsonHttpMessageConverter fastConverter = new FastJsonHttpMessageConverter();

FastJsonConfig fastJsonConfig = new FastJsonConfig();

/*

* 转换为JSON字符串，默认:

* WriteNullListAsEmpty List字段如果为null,输出为[],而非null

* WriteNullStringAsEmpty 字符类型字段如果为null,输出为”“,而非null

* WriteMapNullValue 是否输出值为null的字段,默认为false

*/

fastJsonConfig.setSerializerFeatures(SerializerFeature.WriteNullListAsEmpty, SerializerFeature.WriteNullStringAsEmpty, SerializerFeature.WriteMapNullValue, SerializerFeature.WriteDateUseDateFormat);

fastConverter.setFastJsonConfig(fastJsonConfig);

fastConverter.setDefaultCharset(Charset.forName("UTF-8"));

HttpMessageConverter> converter = fastConverter;

return new HttpMessageConverters(converter);

}

/**

* 这个Filter 解决页面跨域访问问题

*/

@Bean

public FilterRegistrationBean omsFilter() {

FilterRegistrationBean registration = new FilterRegistrationBean();

registration.setFilter(new ServiceFilter());

registration.addUrlPatterns("/*");

registration.setName("MainFilter");

registration.setAsyncSupported(true);

registration.setOrder(1);

return registration;

}

}

其中JSON数据返回需要引入阿里巴巴FastJson这个依赖，可以自行去pom.xml文件中引入

这样还不够，还需要

创建一个Filter类，做页面跨域的处理

import org.slf4j.Logger;

import org.slf4j.LoggerFactory;

import javax.servlet.*;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

import java.io.IOException;

/**

* @author Chenbin

*/

public class ServiceFilter implements Filter {

private static final Logger LOGhttp://GER = LoggerFactory.getLogger(ServiceFilter.class);

@Override

public void doFilter(ServletRequest request, ServletResponse response, FilterChain filterChain)

throws IOException, ServletException {

HttpServletResponse resp = (HttpServletResponse) response;

HttpServletRequest req = (HttpServletRequest) request;

// 解决页面跨域访问问题

resp.setHeader("Access-Control-Allow-Origin", "*");

resp.setHeader("Access-Control-Allow-Credentials", "true");

resp.setHeader("Access-Control-Allow-Methods", "*");

resp.setHeader("Access-Control-Allow-Headers", "Content-Type,Access-Token");

resp.setHeader("Access-Control-Expose-Headers", "*");

filterChain.doFilter(req, resp);

}

@Override

public void init(FilterConfig filterConfig) throws ServletException {

}

@Override

public void destroy() {

}

}

这两个类配置好了以后，重启服务，再与前端交互就不会出现这样的跨域问题了，因为在Filter这个类里加了一个请求头Access-Control-Allow-Origin

springboot文件上传跨域

前端

//跨域认证

axios.defaults.withCredentials = false

axios.defaults.crossDomain = true

后端

2个类复制进去

启动类添加包扫描

import org.springframework.beans.factory.annotation.Autowired;

import org.springframework.context.annotation.Configuration;

import org.springframework.web.servlet.config.annotation.CorsRegistry;

import org.springframework.web.servlet.config.annotation.InterceptorRegistry;

import org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter;

/**

* Cros协议的配置类。

* 继承WebMvcConfigurerAdapter，并且重写方法addCorsMappings。

* addCorsMappings方法是用于增加Cros协议配置的方法。默认的实现是空实现。也就是说，在默认的配置环境中，是不进行Cros协议的配置的。

*/

@Configuration

public class CrosConfiguration extends WebMvcConfigurerAdapter {

@Autowired

ProcessInterceptor processInterceptor;

@Override

public void addInterceptors(InterceptorRegistry registry) {

// 添加拦截器(拦截器中只有preHandle返回true时才继续执行下一个拦截器或者controller，否则直接返回)

// registry.addInterceptor(logInterceptor).addPathPatterns("/**");

registry.addInterceptor(processInterceptor).addPathPatterns("/**");

//registry.addInterceptor(csrCheckInterceptor).addPathPatterns("/**");

//registry.addInterceptor(menuAuthInterceptor).addPathPatterns("/**");

super.addInterceptors(registry);

}

/**

* 就是注册的过程，注册Cors协议的内容。

* 如： Cors协议支持哪些请求URL，支持哪些请求类型，请求时处理的超时时长是什么等。

* @param registry - 就是用于注册Cros协议内容的一个注册器。

*/

@Override

public void addCorsMappings(CorsRegistry registry) {

registry

.addMapping("/**")// 所有的当前站点的请求地址，都支持跨域访问。

.allowedMethods("GET", "POST", "PUT", "DELETE","OPTIONS") // 当前站点支持的跨域请求类型是什么。

.allowCredentials(true) // 是否支持跨域用户凭证

.allowedHeaders("*")

.allowedOrigins("*") // 所有的外部域都可跨域访问。 如果是localhost则很难配置，因为在跨域请求的时候，外部域的解析可能是localhost、127.0.0.1、主机名

.maxAge(3600); // 超时时长设置为1小时。 时间单位是秒。

}

}

import org.springframework.stereotype.Component;

import org.springframework.web.servlet.HandlerInterceptor;

import org.springframework.web.servlet.ModelAndView;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

/**

* @author:Administrator

* @date:2019/10/9

*/

@Component

public class ProcessInterceptor implements HandlerInterceptor {

@Override

public boolean preHandle(HttpServletRequest httpServletRequest, HttpServletResponse httpServletResponse, Object o) throws Exception {

httpServletResponse.setHeader("Access-Control-Allow-Headers", "X-Requested-With, Accept, Content-Type,Authorization");

httpServletResponse.setHeader("Access-Control-Allow-Methods", "PUT,POST,GET,DELETE,OPTIONS");

String origin = httpServletRequest.getHeader("Origin");

httpServletResponse.setHeader("Access-Control-Allow-Origin", "*");

// 是否允许浏览器携带用户身份信息（cookie）,设置为true,必须设置域名,不能使用通配符

// httpServletResponse.setHeader("Access-Control-Allow-Credentials", "true");

// httpServletResponse.setHeader("Access-Control-Allow-Origin", "*");

// httpServletResponse.setHeader("Access-Control-Allow-Headers", "Content-Type,Content-Length, Authorization, Accept,X-Requested-With");

// httpServletResponse.setHeader("Access-Control-Allow-Methods", "PUT,POST,GET,DELETE,OPTIONS");

String method = httpServletRequest.getMethod();

if (method.equals("OPTIONS")) {

httpServletResponse.setStatus(200);

return false;

}

return true;

}

@Override

public void postHandle(HttpServletRequest httpServletRequest, HttpServletResponse httpServletResponse, Object o, ModelAndView modelAndView) throws Exception {

}

@Override

public void afterCompletion(HttpServletRequest httpServletRequest, HttpServletResponse httpServletResponse, Object o, Exception e) throws Exception {

}

}

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。