Vue.js + Spring Boot：如何进行用户授权？

Question

我很早就开始使用Spring应用程序，并使用Thymeleaf作为模板引擎。

我的授权看起来像这样：

1. WebSecurityConfigAdapter具有配置方法，以下是几行：

and()
.formLogin()
.loginPage("/login")
.permitAll()

1. 我使用Thymeleaf进行了SSR

2. 我有登录页面的模板，该模板已在服务器上呈现。

<div
  class="alert alert-danger"
  th:if="${session.SPRING_SECURITY_LAST_EXCEPTION != null}"
  role="alert"
>Error!</div>
<div
  class="alert"
  th:classappend="${typeAlert}"
  th:if="${#ctx.containsVariable('message')}"
  th:text="${message}"
  role="alert"
></div>
<form method="post" th:action="login">
  <div class="form-group row">
    <label class="col-sm-3 col-form-label">User:</label>
    <div class="col-sm-6">
      <input class="form-control" th:name="username" type="text" placeholder="username" />
    </div>
  </div>
  <div class="form-group row">
    <label class="col-sm-3 col-form-label">Password:</label>
    <div class="col-sm-6">
      <input class="form-control" th:name="password" type="password" placeholder="password" />
    </div>
  </div>
  <div class="form-check">
    <input type="checkbox" class="form-check-input" id="remember-me" name="remember-me" />
    <label class="form-check-label" for="remember-me">Remember me</label>
  </div>
  <a class="text-muted" th:href="@{/registration}">Registration</a>
  <button class="btn btn-dark align-baseline" type="submit" th:text="Login"></button>
</form>

1. Thymeleaf和Spring为我完成了所有工作。

现在，我将前端和后端分开了。但是在问基本问题之前，我需要了解以下内容。

我是否正确理解我可以对前端和后端执行以下两种方式：

1. 如果我将前端和后端完全分开，则需要在我的Server中运行两个Web服务器，一个运行到Spring，另一个运行到Vue.js？然后可以使用Vue.js进行MPA还是使用Nuxt.js进行SSR。

2. 或者我可以使用Spring生成index.html，然后需要在Spring项目的目标文件夹中构建dist文件Vue.js，并将js连接到使用Spring生成的index.html。那我可以使用Spring的@Controller和Thymeleaf进行SSR进行MPA吗？

在这些情况下，需要我：

1. 完全分开：：要教Vue.js通过spring登录并从spring请求有关授权用户的信息？我需要JWT，CORS吗？

2. 使用Thymeleaf的SSR：要使用我上面对Thymeleaf所述的授权？