SpringBoot使用JWT集成Ng-Alain

Ng-Alain与SpringBoot整合其实本身也并不复杂，SpringBoot专注于后台业务实现，而Ng-Alain则专注于前端页面展现。以下是两者的集成步骤

• spring initializr新建SpringBoot工程

• 下载Ng-Alain源码，并拷贝至工程的ng_alain目录下，打开_mock目录下各种模拟接口实现，SpringBoot中参考实现相应接口，具体实现可参考源码链接中Github的源码

• ng build --prod构建前端工程，在dist目录下，可以看到构建后的工程文件

• Spring Boot工程中增加JWT实现，主要包括Token的生成与校验，主要实现包cn.cib.action.jsonwebtoken以及cn.cib.action.security，注意：Ng-Alain认证模块@delon/auth中会在HTTP请求头中包含Token信息。

因此，我们JsonWebTokenAuthenticationFilter实现类中，我们需要将Request校验头设置为token，代码如下：

• 修改pom.xml文件，当构建SpringBoot工程时，将dist中的文件拷贝至resources目录下

            
                maven-resources-plugin
                3.0.2
                
                    
                    
                        copy-resources
                        validate
                        
                            copy-resources
                        
                        
                            ${project.basedir}/src/main/resources/public
                            
                                
                                    ${project.basedir}/ng_alain/dist
                                    
                                        *.gz
                                    
                                
                            
                        
                    
                
            

• 启动工程，访问 http://localhost:8090，自动跳转至登录页面 http://127.0.0.1:8090/#/passport/login

输入用户名和密码，跳转至默认主页

我们可以看到登录请求的返回信息如下：

源码链接：https://github.com/ypmc/springboot-ngalain-jwt