我在使用spring boot+react js刷新完整堆栈应用程序的页面时遇到问题,react构建文件被复制到spring boot应用程序的资源目录中的公用文件夹中。最初运行spring boot应用程序并在浏览器上打开localhost:8080,通常显示react组件,如登录等,我可以在react组件中导航,但一旦我在浏览器上刷新,我将react路由的错误视为401错误,我正在spring boot应用程序中使用spring security。任何人都知道如何解决这个错误
spring安全配置文件
@Configuration
@EnableWebSecurity
@EnableGlobalMethodSecurity(
securedEnabled = true,
jsr250Enabled = true,
prePostEnabled = true
)
public class SecurityConfig extends WebSecurityConfigurerAdapter
@Override
protected void configure(AuthenticationManagerBuilder auth) throws Exception {
auth.userDetailsService(appUserDetailService).passwordEncoder(bCryptPasswordEncoder);
}
@Override
protected void configure(HttpSecurity http) throws Exception {
http.csrf().disable()
.sessionManagement().sessionCreationPolicy(SessionCreationPolicy.STATELESS)
.and()
.authorizeRequests().antMatchers(HttpMethod.GET,
"/",
"/favicon.ico",
"/**/*.png",
"/manifest.json",
"/public/**",
"/**/*.gif",
"/**/*.svg",
"/**/*.jpg",
"/**/*.html",
"/**/*.css",
"/**/*.js"
).permitAll()
.anyRequest().authenticated();
http.addFilterBefore(jwtRequestFilter, UsernamePasswordAuthenticationFilter.class);
}
}
react主组件app.js
class App extends Component {
render() {
return (
<Provider store={store}>
<Router>
<div className="App">
<NavBar />
{
//Public Routes
}
<Route exact path="/" component={Landing} />
<Route exact path="/registercompany" component={RegisterCompany} />
<Route exact path="/login" component={Login} />
<Route exact path="/createservice" component={CreateService} />
{
//Private Routes
}
<Switch>
<SecuredRoute exact path="/dashboard" component={Dashboard} />
<SecuredRoute exact path="/updateservice/:serviceCode" component={UpdateService} />
<SecuredRoute exact path="/employees" component={EmployeeListDashboard} />
<SecuredRoute exact path="/addemployee" component={AddEmployee} />
<SecuredRoute exact path="/updateemployee/:employeecode" component={UpdateEmployee} />
<SecuredRoute exact path="/addservice" component={AddService} />
<SecuredRoute exact path="/assignservice" component={MapServiceToEmployee} />
<SecuredRoute exact path="/assetlist" component={AssetList} />
<SecuredRoute exact path="/createasset" component={CreateAsset} />
<SecuredRoute exact path="/updateasset/:assetcode" component={UpdateAsset} />
<SecuredRoute exact path="/servicerequests" component={ServiceRequestDashboard} />
</Switch>
{
//Loader
}
<FullPageLoader/>
</div>
</Router>
</Provider>
);
}
}
export default App;
react package.json
{
"name": "cleantoolfrontend",
"version": "0.1.0",
"private": true,
"dependencies": {
"axios": "^0.19.2",
"baseui": "^9.116.1",
"bootstrap": "^4.6.0",
"canvasjs": "^1.8.3",
"classnames": "^2.3.1",
"font-awesome": "^4.7.0",
"hashmap": "^2.4.0",
"jwt-decode": "^2.2.0",
"react": "^16.14.0",
"react-bootstrap": "^1.6.1",
"react-bootstrap-modal": "^4.2.0",
"react-dom": "^16.14.0",
"react-modal": "^3.14.2",
"react-redux": "^7.2.4",
"react-router-dom": "^5.2.0",
"react-scripts": "^3.4.4",
"react-select": "^3.2.0",
"redux": "^4.1.0",
"redux-thunk": "^2.3.0"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"cross-env": "^7.0.3"
}
}
[401刷新时控制台显示下图中的错误]
暂无答案!
目前还没有任何答案,快来回答吧!