要实现ASP.NET Core 2.1 Vue.js SPA的Cookie Auth和Vue.js开发服务器,可以按照以下步骤进行操作:
创建一个新的ASP.NET Core 2.1项目。 使用以下命令在终端中创建一个新的ASP.NET Core项目:
dotnet new webapi -n YourProjectName
将Vue.js集成到ASP.NET Core项目中。 使用以下命令安装Microsoft.AspNetCore.SpaServices包:
dotnet add package Microsoft.AspNetCore.SpaServices
在Startup.cs文件的ConfigureServices方法中,添加以下代码:
services.AddSpaStaticFiles(configuration =>
{
configuration.RootPath = "ClientApp/dist";
});
在Startup.cs文件的Configure方法中,添加以下代码:
app.UseSpaStaticFiles();
app.UseSpa(spa =>
{
spa.Options.SourcePath = "ClientApp";
if (env.IsDevelopment())
{
spa.UseVueCli(npmScript: "serve", port: 8080);
}
});
设置Cookie Auth认证。 在Startup.cs文件的ConfigureServices方法中,添加以下代码:
services.AddAuthentication(CookieAuthenticationDefaults.AuthenticationScheme)
.AddCookie(options =>
{
options.LoginPath = "/Account/Login";
options.LogoutPath = "/Account/Logout";
});
在Startup.cs文件的Configure方法中,添加以下代码:
app.UseAuthentication();
创建Vue.js SPA项目。 使用以下命令创建Vue.js SPA项目:
vue create ClientApp
这将使用Vue CLI创建一个新的Vue.js项目。
修改Vue.js开发服务器配置。 在ClientApp/package.json文件中,修改scripts部分如下:
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
}
确保"serve"命令已设置为"vue-cli-service serve"。
创建登录和注销页面。 在ClientApp/src/views目录下,创建Login.vue和Logout.vue组件,并实现相应的登录和注销功能。
在需要进行身份验证的API控制器中添加[Authorize]属性。 在ASP.NET Core的API控制器中,你可以使用[Authorize]属性来确保只有经过身份验证的用户才能访问该API。
这样,你就实现了ASP.NET Core 2.1 Vue.js SPA的Cookie Auth和Vue.js开发服务器。根据你的具体需求,你可能还需要进行其他配置和功能的实现。
上一篇:ASP.NET Core 2.1 Swagger(Swashbuckle)URL模板可选参数
下一篇:ASP.NET Core 2.1 Web API - ConfigurationManager.ConnectionStrings 返回null