资料
其他资料
虽然是单体部署，但是也是前后端分离项目，前后端的沟通还是通过 restful，只不过，前后端都打在了一个 jar 包中。
网上大部分教程写的都很粗浅，这里说一下整个过程。
打包前端
如果，你的前端项目可以 npm run server 的话
你只需要 npm run build，将 dist 文件夹里面的内容 copy 到 resources/static 里面即可。
如果你的配置为
那么，你只需要访问 127.0.0.1:8001 即可。
特殊情况
这里需要注意的是，前端和后端都共享一个端口。
比如，你的网页页面时 127.0.0.1:8002，但是，restful 请求是 127.0.0.1:8002/login
如果，你的项目中有拦截器，比如
1
2
| registry.addInterceptor(authInterceptorService)
.addPathPatterns("/**");
|
这是说明你的所有路径都必须通过 authInterceptorService 拦截器的校验规则。
如果这个时候你访问 127.0.0.1:8001 可能校验不通过，导致返回不了正确界面。
所以你的拦截器，不能拦截所有的页面，具体细节请参考
跨域
在前后端分离，当前端和后端使用端口不一致的时候，就会出现这种情况。
可以在启动类中添加下面的跨域代码。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
| package com.yamlgameswap.back;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.boot.web.server.ConfigurableWebServerFactory;
import org.springframework.boot.web.server.ErrorPage;
import org.springframework.boot.web.server.WebServerFactoryCustomizer;
import org.springframework.context.annotation.Bean;
import org.springframework.http.HttpStatus;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.UrlBasedCorsConfigurationSource;
import org.springframework.web.filter.CorsFilter;
@SpringBootApplication
public class BackApplication {
public static void main(String[] args) {
SpringApplication.run(BackApplication.class, args);
}
@Bean
public CorsFilter corsFilter(){
CorsConfiguration corsConfiguration = new CorsConfiguration();
corsConfiguration.addAllowedOrigin("*");
corsConfiguration.addAllowedHeader("*");
corsConfiguration.addAllowedMethod("*");
corsConfiguration.setAllowCredentials(true);
UrlBasedCorsConfigurationSource urlBasedCorsConfigurationSource = new UrlBasedCorsConfigurationSource();
urlBasedCorsConfigurationSource.registerCorsConfiguration("/**", corsConfiguration);
return new CorsFilter(urlBasedCorsConfigurationSource);
}
@Bean
public WebServerFactoryCustomizer<ConfigurableWebServerFactory> webServerFactoryCustomizer() {
return factory -> {
ErrorPage error404Page = new ErrorPage(HttpStatus.NOT_FOUND, "/index.html");
factory.addErrorPages(error404Page);
};
}
}
|
