Spring Boot 2+Angular 11+HTML5路由模式集成项目

SpringBoot 和 Angular 结合的项目其实不少,但这个SpringBootAngularHTML5项目做得还挺细。用的是 Spring Boot 2.x 加上 Angular 11,配合上HTML5 路由模式,整套下来前后端衔接得还挺自然。

比较有意思的是,base-href 动态生成这一块儿。一般你在部署 Angular 应用时,base-href要自己写死,改来改去麻烦。但它是用ResourceResolver来自动搞定的,Tomcat 一跑就能根据应用路径算出 base,省心多了。

还有就是 HTML5 模式下那个老问题——刷页面就 404,它也考虑到了。通过合理的服务端配置,避免了RewriteRule缺失导致的页面刷不出来,挺实用。如果你打算做个 SPA 项目放在 Spring Boot 里跑,这套结构可以参考一下。

而且它还集成了一点Spring WebFlux的东西,虽然只是部分 endpoint,但你要是考虑响应式开发,也能提前踩点。另外还有个小功能,HTTP 求过程中的加载状态也能自定义,比如你想加个 loading spinner,这里已经有方案了。

项目地址在 Maven 下跑起来比较方便,直接./mvn一把梭。想研究清楚前后端部署、HTML5 路由这些配合方式的,蛮值得一试。

如果你已经用惯了 Angular 的PathLocationStrategy,又想搭配 Spring Boot 后端,那这个项目会让你少走不少弯路。

zip
SpringBootAngularHTML5-master.zip 预估大小:69个文件
folder
SpringBootAngularHTML5-master 文件夹
file
.gitignore 103B
file
Dockerfile 248B
folder
.mvn 文件夹
folder
wrapper 文件夹
file
maven-wrapper.jar 50KB
file
MavenWrapperDownloader.java 5KB
file
maven-wrapper.properties 218B
folder
src 文件夹
folder
main 文件夹
folder
resources 文件夹
file
logback-spring.xml 882B
file
application.properties 725B
folder
java 文件夹
folder
com 文件夹
folder
mpalourdio 文件夹
folder
html5 文件夹
folder
api 文件夹
file
ApiController.java 3KB
folder
config 文件夹
file
SinglePageAppConfig.java 4KB
file
WebSecurityConfig.java 1KB
file
SpringBootAngularHTML5Application.java 844B
folder
frontcontroller 文件夹
file
FrontControllerHandler.java 3KB
file
FrontControllerException.java 782B
folder
test 文件夹
folder
.gitkeep 文件夹
folder
java 文件夹
folder
com 文件夹
folder
mpalourdio 文件夹
folder
html5 文件夹
folder
fake 文件夹
file
UselessTest.java 231B
file
mvnw 10KB
folder
front 文件夹
folder
e2e 文件夹
folder
src 文件夹
file
app.e2e-spec.ts 313B
file
app.po.ts 313B
file
tsconfig.json 274B
file
protractor.conf.js 1KB
file
package.json 1KB
file
tslint.json 3KB
folder
src 文件夹
folder
app 文件夹
file
app.module.ts 1KB
file
http.service.spec.ts 980B
folder
first 文件夹
folder
components 文件夹
folder
first 文件夹
file
first.component.spec.ts 1KB
file
first.component.html 389B
file
first.component.ts 691B
folder
first.component.scss 文件夹
file
first.module.ts 941B
file
first.module.spec.ts 754B
file
first-routing.module.ts 870B
file
app.routing.module.ts 1KB
folder
second 文件夹
file
second-routing.module.ts 879B
folder
components 文件夹
folder
second 文件夹
folder
second.component.scss 文件夹
file
second.component.ts 3KB
file
second.component.spec.ts 1KB
file
second.component.html 740B
file
second.module.ts 882B
file
second.module.spec.ts 780B
file
http.service.ts 2KB
file
app.component.spec.ts 1KB
file
app.component.html 136B
file
app.component.ts 1KB
folder
app.component.scss 文件夹
folder
static 文件夹
folder
assets 文件夹
file
test.txt 4B
folder
.gitkeep 文件夹
file
favicon.ico 5KB
file
main.ts 372B
file
test.ts 753B
folder
environments 文件夹
file
environment.ts 664B
file
environment.prod.ts 53B
file
index.html 287B
file
styles.scss 150B
file
polyfills.ts 3KB
file
karma.conf.js 1KB
file
proxy.conf.json 198B
file
tsconfig.spec.json 333B
file
tsconfig.json 660B
file
.browserslistrc 703B
file
angular.json 4KB
file
tsconfig.app.json 287B
file
.editorconfig 350B
file
yarn.lock 389KB
file
LICENSE 1KB
folder
.github 文件夹
folder
workflows 文件夹
file
front.yml 615B
file
back.yml 334B
file
pom.xml 10KB
file
mvnw.cmd 6KB
file
README.md 2KB
...
zip 文件大小:251.51KB