Reactjs SpringBoot与React-restapi在刷新时与React路由冲突

我正在研究弹簧靴，并做出反应

我正在公开一些restapi，这些api将被React应用程序使用

在React中，我有用户路由

像这样的

         <Switch>
            <Route exact path="/" component={Home}></Route>           
            <PrivateRoute path="/profile" authenticated={this.state.authenticated} currentUser={this.state.currentUser}
              component={Profile}></PrivateRoute>
            <Route path="/login"
              render={(props) => <Login authenticated={this.state.authenticated} {...props} />}></Route>
            <Route path="/signup"
              render={(props) => <Signup authenticated={this.state.authenticated} {...props} />}></Route>
            <Route path="/oauth2/redirect" component={OAuth2RedirectHandler}></Route>  
            <Route component={NotFound}></Route>
          </Switch>

@Controller
public class TemplateFile
{

    @RequestMapping(value={"/login", "/dashboard", "/signup" })
    public String HomePage() {
        return "index";
    }
}

通过在

pom.xml

中添加这些行，我将React和Spring Boot捆绑在一个端口8080上运行

<plugin>
    <groupId>com.github.eirslett</groupId>
    <artifactId>frontend-maven-plugin</artifactId>
    <version>1.6</version>
    <configuration>
        <workingDirectory>authserver-react</workingDirectory>
        <installDirectory>target</installDirectory>
    </configuration>
    <executions>
        <execution>
            <id>install node and npm</id>
            <goals>
                <goal>install-node-and-npm</goal>
            </goals>
            <configuration>
                <nodeVersion>v8.11.3</nodeVersion>
                <npmVersion>5.6.0</npmVersion>
            </configuration>
        </execution>
        <execution>
            <id>npm install</id>
            <goals>
                <goal>npm</goal>
            </goals>
            <configuration>
                <arguments>install</arguments>
            </configuration>
        </execution>
        <execution>
            <id>npm run build</id>
            <goals>
                <goal>npm</goal>
            </goals>
            <configuration>
                <arguments>run build</arguments>
            </configuration>
        </execution>
    </executions>
</plugin>

<plugin>
    <groupId>org.apache.maven.plugins</groupId>
    <artifactId>maven-antrun-plugin</artifactId>
    <executions>
        <execution>
            <phase>generate-resources</phase>
            <configuration>
                <target>
                    <copy todir="${project.build.directory}/classes/static">
                        <fileset dir="${project.basedir}/authserver-react/build" />
                    </copy>
                </target>
            </configuration>
            <goals>
                <goal>run</goal>
            </goals>
        </execution>
    </executions>
</plugin>

com.github.eirslett
前端maven插件
1.6
authserver反应
目标
安装节点和npm
安装节点和npm
v8.11.3
5.6.0
npm安装
npm
安装
npm运行构建
npm
运行构建
org.apache.maven.plugins
maven antrun插件
产生资源
跑

完成后，我运行build并

mvn-spring-boot:run

并在

http://localhost:8080

反应出现在图片中并重定向到

http://localhost:8080/login

问题是，如果我通过单击“刷新”按钮刷新页面，Spring会抛出白标签错误页面

发生这种情况是因为我没有使用“/login”定义任何控制器。但我不想给它下定义

现在我不知道如何用SpringAPI区分React路由

---

我不想在不同的端口上运行React，也不想在不同的端口上运行Spring引导

好吧，我终于弄对了。这只是一个理解流程的问题

antrun

在

pom.xml

中配置为将我的react

/build

文件复制到Spring的

/static

文件夹中

这意味着我的react的

索引

文件将驻留在静态文件夹中

我只需要编写一个控制器，将我的反应路由解析为索引

像这样的

         <Switch>
            <Route exact path="/" component={Home}></Route>           
            <PrivateRoute path="/profile" authenticated={this.state.authenticated} currentUser={this.state.currentUser}
              component={Profile}></PrivateRoute>
            <Route path="/login"
              render={(props) => <Login authenticated={this.state.authenticated} {...props} />}></Route>
            <Route path="/signup"
              render={(props) => <Signup authenticated={this.state.authenticated} {...props} />}></Route>
            <Route path="/oauth2/redirect" component={OAuth2RedirectHandler}></Route>  
            <Route component={NotFound}></Route>
          </Switch>

@Controller
public class TemplateFile
{

    @RequestMapping(value={"/login", "/dashboard", "/signup" })
    public String HomePage() {
        return "index";
    }
}

现在我的代码可以很好地使用spring端口，即

http://localhost:8080/login
http://localhost:8080/signup
http://localhost:8080/dashboard

注意：我仍然需要使用一些正则表达式优化控制器类