ASP .NET Web应用程序(.net FrameWrok) MVC快速入门、带案例讲解

蜻蜓队长2001

于 2024-09-28 11:53:24 发布

阅读量814

点赞数 11

文章标签：前端 mvc

本文链接：https://blog.csdn.net/qq_56892518/article/details/142592222

版权

因为工作需要，作为前端开发的我被迫学习了 .NET MVC框架，学习过程中最大的感触莫过于从前后端分离走向前后端不分离的开发模式，学习MVC之前首先要了解一下什么是MVC。

MVC的全称为（Model View Controller 模型-视图-控制器）,以下是我根据自己对MVC的理解

Model（模型）: 我直接把他理解成了一个对象，事先定义好他，需要时再控制器中调用它即可，如（数据表、人、物）

View（视图）: 可以理解成前端界面，也就是数据展示层。

Controller （控制器）: 将视图和模型串联起来，程序主要逻辑通常写在这里，与数据库的交互通常也在这里。

在开发MVC应用前，需要提前安装好开发工具，安装教程推荐Microsoft Visual Studio2022下载安装详细教程（图文）_visual studio 2022-CSDN博客

一项目创建

1.点击创建新项目

2.选择ASP .NEW Web应用程序（.NET Framework）点击下一步

3. 输入项目名称，我这里选择的框架是.NET Framework 4.7.2，填写完成后点击创建

4.这里选择MVC应用，取消勾选 “为HTTPS配置”

这就是创建完成后的样子。

App_Data : 该目录通常用于存放应用程序的数据文件，例如数据库文件（如 SQL Server 的 .mdf 文件）或其他数据存储文件

RouteConfig.cs : 定义 URL 路由规则。

FilterConfig.cs : 定义应用程序的全局过滤器。

BundleConfig.cs : 配置 JavaScript 和 CSS 文件的捆绑与压缩，就是打包配置

Controllers : 该目录包含控制器类。控制器处理用户请求并返回相应的视图。每个控制器通常对应于一个模型或一组功能。控制器命名通常以名称+“Controllers”为规范，如HomeControllers

Models : 这里是定义数据模型的地方。模型表示应用程序的数据结构和业务逻辑，通常会包括数据验证和数据库交互的相关代码。

Views :

该目录包含所有视图文件。视图是用户界面部分，使用 Razor 语法编写，可以动态生成 HTML 内容，视图命名规范最好跟控制器相对应，如HomeControllers，这里则命名为Home
Home: 通常用于存放 HomeController 相关的视图。
Shared: 存放共享视图文件，如布局文件（_Layout.cshtml）和部分视图（Partial Views）

三登录功能案例编写

1.创建登录控制器LoginControllers

这里右击Index，点击添加视图

创建完成后是这样的

这个时候可以启动项目，启动想完成后再浏览器地址栏写入http://localhost:你的端口号/Login/index就可以查看到这个界面

为什么要这个修改呢，这个时候我们可以看看路由配置文件

从这里可以看到，项目的路由格式标准为 controller/action/id，controller也就是控制器，我们刚刚新建的控制器名称是Login，action对应的就是我们的控制器方法，如我们现在控制器里面的Index（）方法，默认的路由地址为Home/Index，当使用这个路由的时候，页面地址栏默认不显示

这里的return View（）就是返回界面，这里也可以写成以下几种方式

return View（），返回相应的界面

retuen Content（""），返回字符串

return Redirect（"URL地址"），重定向路由

return File，返回一个文件

return Json({ })，返回一段JSON字符串

除了以上这些，还可以返回状态码，如

return new HttpStatusCodeResult(HttpStatusCode.InternalServerError); 其/NotFound=404
InternalServerError=服务器内部错误.....等等。

2.编写登录界面


@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
</head>
<body>
    <div>
        <form action="/Login/UserLogin" method="post">
            <div>
                <span>用户名 : </span>
                <input type="text" name="name" value="" />
            </div>
            <div>
                <span>密码 : </span>
                <input type="password" name="password" value="" />
            </div>
            <button>登录</button>
        </form>
    </div>
</body>
</html>

这里创建了一个表单，在表单中添加了一个用户名和密码，点击登录按钮可以提交此表单数据，在action中填写的是我们事先创建好的控制器，method使用post请求。

2.编写控制器代码

在model中创建userloginmodel类

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace CSDN.Models
{
    public class UserLoginModel
    {
        public string name { get; set; }
        public string password { get; set; }
    }
}

      [HttpPost]
      public ActionResult UserLogin(UserLoginModel userLoginModel)
      {
          if (userLoginModel.name== "admin"&&userLoginModel.password == "123456")
          {
              return Json(new
              {
                  cdoe = 200,
                  messger = "登录成功"
              },
          JsonRequestBehavior.AllowGet
          );
          }
          else
          {
              return Json(new
              {
                  cdoe = 200,
                  messger = "账号或者密码错误"
              },
          JsonRequestBehavior.AllowGet
          );
          }
         
      }

其中[HttpPost]的意思是此方法只支持https请求，并且使用UserLoginMoel对象来接受从view

试图层传来的数据。