SpringBoot使用JWT集成Ng-Alain

Ng-Alain與SpringBoot整合其實本身也並不複雜，SpringBoot專注於後臺業務實現，而Ng-Alain則專注於前端頁面展現。以下是兩者的集成步驟

• spring initializr新建SpringBoot工程

• 下載Ng-Alain源碼，並拷貝至工程的ng_alain目錄下，打開_mock目錄下各種模擬接口實現，SpringBoot中參考實現相應接口，具體實現可參考源碼鏈接中Github的源碼

• ng build構建前端工程，在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目錄下

            <plugin>
                <artifactId>maven-resources-plugin</artifactId>
                <version>3.0.2</version>
                <executions>
                    <!-- copy dist folder to src/resource/ -->
                    <execution>
                        <id>copy-resources</id>
                        <phase>validate</phase>
                        <goals>
                            <goal>copy-resources</goal>
                        </goals>
                        <configuration>
                            <outputDirectory>${project.basedir}/src/main/resources/public</outputDirectory>
                            <resources>
                                <resource>
                                    <directory>${project.basedir}/ng_alain/dist</directory>
                                    <excludes>
                                        <exclude>*.gz</exclude>
                                    </excludes>
                                </resource>
                            </resources>
                        </configuration>
                    </execution>
                </executions>
            </plugin>

• 啓動工程，訪問http://localhost:8090，自動跳轉至登錄頁面http://127.0.0.1:8090/#/passport/login

輸入用戶名和密碼，跳轉至默認主頁

我們可以看到登錄請求的返回信息如下：

源碼鏈接：https://github.com/ypmc/springboot-ngalain-jwt