前端用的是vue axios请求
后台用springboot oauth2的token认证我已经配置的跨域请求
现在遇到的问题是 登录正常获取token 在做其他请求一切正常
当token过期,浏览器状态码为401, 客户端怎么拿的到服务器返回的error.response 为undefined 出现的问题为跨域问题,
我觉得应该是修改springboot oauth2 的 filter ,不知道怎么修改springboot 我当前的跨域设置
@Configuration
@EnableWebSecurity
@EnableGlobalMethodSecurity(prePostEnabled = true)
@Order(-1)
public class SecurityConfig extends WebSecurityConfigurerAdapter { @Resource(name = "usersService")
private UserDetailsService userDetailsService; @Autowired
private ClientDetailsService clientDetailsService; @Override
@Bean
public AuthenticationManager authenticationManagerBean() throws Exception {
return super.authenticationManagerBean();
} @Autowired
public void globalUserDetails(AuthenticationManagerBuilder auth) throws Exception {
auth.userDetailsService(userDetailsService)
.passwordEncoder(encoder()); //加密
} @Override
protected void configure(HttpSecurity http) throws Exception {
http.csrf().disable()
.anonymous().disable()
.requestMatchers()
.antMatchers(HttpMethod.OPTIONS, "/oauth/token");
} @Bean
public TokenStore tokenStore() {
return new InMemoryTokenStore();
} @Bean
@Autowired
public TokenStoreUserApprovalHandler userApprovalHandler(TokenStore tokenStore){
TokenStoreUserApprovalHandler handler = new TokenStoreUserApprovalHandler();
handler.setTokenStore(tokenStore);
handler.setRequestFactory(new DefaultOAuth2RequestFactory(clientDetailsService));
handler.setClientDetailsService(clientDetailsService);
return handler;
} @Bean
@Autowired
public ApprovalStore approvalStore(TokenStore tokenStore) throws Exception {
TokenApprovalStore store = new TokenApprovalStore();
store.setTokenStore(tokenStore);
return store;
} @Bean
public BCryptPasswordEncoder encoder(){
return new BCryptPasswordEncoder();
}
/**
* 跨域过滤器
* @return
*/
@Bean
public FilterRegistrationBean filterRegistrationBean() {
UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
CorsConfiguration config = new CorsConfiguration();
config.setAllowCredentials(true);
config.addAllowedOrigin("*");
config.addAllowedHeader("*");
config.addAllowedMethod("*");
source.registerCorsConfiguration("/**", config);
FilterRegistrationBean bean = new FilterRegistrationBean(new CorsFilter(source));
bean.setOrder(1);
return bean;
}vue配置import axios from 'axios'
import store from '../store'
// axios 配置
axios.defaults.timeout = 5000
axios.defaults.baseURL = 'http://localhost:8888'
// 添加请求拦截器
axios.interceptors.request.use(
config => {
let token = store.state.token
if (token === '') {
config.auth = {username: 'devglan-client', password: 'devglan-secret'}
config.headers = {'Content-type': 'application/x-www-form-urlencoded; charset=utf-8'}
} else {
config.headers = {'Content-type': 'application/json; charset=utf-8'}
}
return config
},
error => {
console.log('-------request-----')
return Promise.reject(error)
})// 添加响应拦截器即异常处理
axios.interceptors.response.use(
response => {
return response
},
error => {
if (error && error.response) {
console.log('*******errorerrorerrorerror***************')
console.log(error)
} else {
console.log('********服务器出错**************')
console.log(error.response)
// debugger
console.log(error)
console.log(error.config)
console.log(error.code) //
console.log(error.status)
console.log('********服务器出错**************')
// error.message = '服务器出错'
this.router.replace({
path: 'login',
query: {redirect: this.router.currentRoute.fullPath}
})
}
return Promise.reject(error)
}
)export default {
fetchGet (url, params = {}) {
let token = store.state.token
if (token !== '') {
url = url + '?access_token=' + token
}
return new Promise((resolve, reject) => {
axios.get(url, params).then(res => {
resolve(res.data)
}).catch(error => {
console.log('------fetchGet-----error')
console.log(error)
reject(error)
})
})
},
fetchPost (url, params = {}) {
let token = store.state.token
if (token !== '') {
url = url + '?access_token=' + token
}
console.log('fetchPost----url---->' + url)
return new Promise((resolve, reject) => {
axios.post(url, params).then(res => {
resolve(res)
}).catch(error => {
console.log('------fetchPost-----error')
console.log(error)
reject(error)
})
})
}
}
401时 返回的错误信息
返回没有response
网上找的问题,跟这位大哥的错误挺像的
https://segmentfault.com/q/1010000013152443/a-1020000014881729跪求各路大神来围观
后台用springboot oauth2的token认证我已经配置的跨域请求
现在遇到的问题是 登录正常获取token 在做其他请求一切正常
当token过期,浏览器状态码为401, 客户端怎么拿的到服务器返回的error.response 为undefined 出现的问题为跨域问题,
我觉得应该是修改springboot oauth2 的 filter ,不知道怎么修改springboot 我当前的跨域设置
@Configuration
@EnableWebSecurity
@EnableGlobalMethodSecurity(prePostEnabled = true)
@Order(-1)
public class SecurityConfig extends WebSecurityConfigurerAdapter { @Resource(name = "usersService")
private UserDetailsService userDetailsService; @Autowired
private ClientDetailsService clientDetailsService; @Override
@Bean
public AuthenticationManager authenticationManagerBean() throws Exception {
return super.authenticationManagerBean();
} @Autowired
public void globalUserDetails(AuthenticationManagerBuilder auth) throws Exception {
auth.userDetailsService(userDetailsService)
.passwordEncoder(encoder()); //加密
} @Override
protected void configure(HttpSecurity http) throws Exception {
http.csrf().disable()
.anonymous().disable()
.requestMatchers()
.antMatchers(HttpMethod.OPTIONS, "/oauth/token");
} @Bean
public TokenStore tokenStore() {
return new InMemoryTokenStore();
} @Bean
@Autowired
public TokenStoreUserApprovalHandler userApprovalHandler(TokenStore tokenStore){
TokenStoreUserApprovalHandler handler = new TokenStoreUserApprovalHandler();
handler.setTokenStore(tokenStore);
handler.setRequestFactory(new DefaultOAuth2RequestFactory(clientDetailsService));
handler.setClientDetailsService(clientDetailsService);
return handler;
} @Bean
@Autowired
public ApprovalStore approvalStore(TokenStore tokenStore) throws Exception {
TokenApprovalStore store = new TokenApprovalStore();
store.setTokenStore(tokenStore);
return store;
} @Bean
public BCryptPasswordEncoder encoder(){
return new BCryptPasswordEncoder();
}
/**
* 跨域过滤器
* @return
*/
@Bean
public FilterRegistrationBean filterRegistrationBean() {
UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
CorsConfiguration config = new CorsConfiguration();
config.setAllowCredentials(true);
config.addAllowedOrigin("*");
config.addAllowedHeader("*");
config.addAllowedMethod("*");
source.registerCorsConfiguration("/**", config);
FilterRegistrationBean bean = new FilterRegistrationBean(new CorsFilter(source));
bean.setOrder(1);
return bean;
}vue配置import axios from 'axios'
import store from '../store'
// axios 配置
axios.defaults.timeout = 5000
axios.defaults.baseURL = 'http://localhost:8888'
// 添加请求拦截器
axios.interceptors.request.use(
config => {
let token = store.state.token
if (token === '') {
config.auth = {username: 'devglan-client', password: 'devglan-secret'}
config.headers = {'Content-type': 'application/x-www-form-urlencoded; charset=utf-8'}
} else {
config.headers = {'Content-type': 'application/json; charset=utf-8'}
}
return config
},
error => {
console.log('-------request-----')
return Promise.reject(error)
})// 添加响应拦截器即异常处理
axios.interceptors.response.use(
response => {
return response
},
error => {
if (error && error.response) {
console.log('*******errorerrorerrorerror***************')
console.log(error)
} else {
console.log('********服务器出错**************')
console.log(error.response)
// debugger
console.log(error)
console.log(error.config)
console.log(error.code) //
console.log(error.status)
console.log('********服务器出错**************')
// error.message = '服务器出错'
this.router.replace({
path: 'login',
query: {redirect: this.router.currentRoute.fullPath}
})
}
return Promise.reject(error)
}
)export default {
fetchGet (url, params = {}) {
let token = store.state.token
if (token !== '') {
url = url + '?access_token=' + token
}
return new Promise((resolve, reject) => {
axios.get(url, params).then(res => {
resolve(res.data)
}).catch(error => {
console.log('------fetchGet-----error')
console.log(error)
reject(error)
})
})
},
fetchPost (url, params = {}) {
let token = store.state.token
if (token !== '') {
url = url + '?access_token=' + token
}
console.log('fetchPost----url---->' + url)
return new Promise((resolve, reject) => {
axios.post(url, params).then(res => {
resolve(res)
}).catch(error => {
console.log('------fetchPost-----error')
console.log(error)
reject(error)
})
})
}
}
401时 返回的错误信息
返回没有response
网上找的问题,跟这位大哥的错误挺像的
https://segmentfault.com/q/1010000013152443/a-1020000014881729跪求各路大神来围观
解决方案 »
- js怎么样修改meta标签的content?
- 我想让某个DIV a标签里面的东西隐藏,该怎么写
- 这样的js写法是什么意思?
- js未结束的字符串常量问题
- 怎么把表格居于网页的最中间?
- 这段代码我在本地机试验时可以弹出无标题栏的窗口,为什么传到服务器上后再运行后弹出的窗口就带标题栏了?
- 是否可以在用户关闭浏览器之前弹出一个确认框?
- 有些论坛网站,分左右两个Frame,中间有一个按钮,可以控制左边的显示或者隐藏,如何实现?
- 分享一个时间选择控件,基于jquery
- 对于tree组件的使用
- 控制台提示一下错误:Response for preflight is invalid (redirect) ,请问怎么解决呢?
- JavaScript中的document.createElement('img')与new Image()主要有什么区别呢?
public void destroy() {
} public void init(FilterConfig filterConfig) throws ServletException {
} public void doFilter(ServletRequest request, ServletResponse response,
FilterChain chain) throws IOException, ServletException {
HttpServletRequest req = (HttpServletRequest) request;
HttpServletResponse res = (HttpServletResponse) response;
if ("OPTIONS".equals(req.getMethod())) { // options 请求无需具体响应,直接返回200
res.setStatus(200);
} else {
chain.doFilter(request, response);
}
}
}
你这个好像不起作用,我新建了一个filter,吧以前的跨域方法删除后 成功了