添加自定义登录页面

参考视频如下，视频来源《GPS定位系统-MVC-添加自定义登录页面》

备注：视频中的部分操作可能会因为Visual Studio的版本差异有所不一样，总体操作流程都是一样的，请自行尝试。视频中采用的是安信可的A9G模块，和当前系列使用的EC-01G模块在AT指令上可能存在差异，这里以博客内容为主，视频主要是讲操作流程。

工程源码下载：GPS定位EC-01G模块系列教程源码下载页（物联网）

IDE环境：Visual Studio 2022

登录页面框架选择

        登录页面可以自行在网上下载现成的框架，当然，你也可以自己写一个，为了方便，博主这里直接采用当前博客的精简后的登录框架。

前端页面演示

我们需要添加的登录页面代码如下，其中包括登录和注册两个功能，用户主要在注册之后，才能进行登录。

运行效果如下：

ASP.NET CORE中嵌入登录页面

1、添加MVC支持

        在ASP.NET CORE WEB默认的框架中，前端的网页是放在Pages目录下的，这个目录我们不能要，需要将整个目录删除。

        然后新增一个Views和Controllers目录。

        Views目录用来放置我们自定义的web页面。

        Views目录下的Login目录用来放置我们前面那个登录页面。

        Controllers目录用来放置我们的MVC控制器。

目录结构如下：

        然后修改Program.cs文件，添加MVC控制器支持。

app.MapControllerRoute(
    name: "default",
    pattern: "{controller=Login}/{action=Index}");

官方代码参考：

https://docs.microsoft.com/zh-cn/aspnet/core/tutorials/first-mvc-app/adding-controller?view=aspnetcore-6.0&tabs=visual-studio

添加结果如下：

2、添加登录页面控制器

固定文件名格式“***Controller.cs”否则控制器将无法被识别

注意：控制器的前缀名称必须和cshtml的名称一致，即：cshtml的名称 +“Controller”

添加完控制器后，我们直接运行，我们其实可以看到三个访问路径提示

/Views/Login/Index.cshtml
/Views/Shared/Index.cshtml
/Pages/Shared/Index.cshtml

运行结果：

其中：Views开头的是我们自定义的目录，Pages开头的是系统自带的目录，我们后面需要做的是，将我们的登录页面按“Index.cshtml”文件名的形式添加到目录“/Views/Login/”中，这样控制器就能找到我们的登录页面了。

3、添加登录页面

添加“Index.cshtml”视图文件。

选择空视图，然后添加

直接添加

然后将我们前面调试好的登录页面 Index.html 代码拷贝到 Index.cshtml 文件中，全部替换掉。还要把系统自带的"wwwroot\css\*.css"和"wwwroot\js\*.js"全部删除，并将我们自己的css和js文件全部扔进去。

最后再次启动我们的工程，我们的登录页面就这样嵌入完成了。