欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

ASP.NET Core MVC的基础学习笔记

程序员文章站 2022-08-08 08:44:01
最近由于“武汉肺炎”疫情在家办公,也没闲着,最近学习了一下asp.net core mvc的一些网页开发的的基础知识,话不多说直接上教程! 一、创建Web应用程序 1)创建新项目 >找到 “ASP.NET Core Web 应用程序” 类型的项目(也可以模糊查询:语言选择c#,项目类型选择Web): ......

最近由于“武汉肺炎”疫情在家办公,也没闲着,最近学习了一下asp.net core mvc的一些网页开发的的基础知识,话不多说直接上教程!

 

一、创建web应用程序

1)创建新项目--->找到 “asp.net core web 应用程序” 类型的项目(也可以模糊查询:语言选择c#,项目类型选择web):

 ASP.NET Core MVC的基础学习笔记

 

2)选择web 应用程序 (模型视图控制器)--->修改名称--->创建:

 ASP.NET Core MVC的基础学习笔记

 

3)新建完成后,解决方案出现如图显示

 ASP.NET Core MVC的基础学习笔记

wwwroot 存放网站的 js、css 等前端文件,

models-模型:封装业务逻辑相关的数据及对数据的处理方法【如图黄框框选中】;

views-视图: 向用户提供交互界面【如图蓝框框选中】;

controllers-控制器: 负责控制model和view【如图红框选中】;

appsettings.json-配置文件: 如可以在其中加入数据库连接字符串,如图:

 ASP.NET Core MVC的基础学习笔记

 

 

二、创建实体模型

1)添加一个实体类 (选中models--->右键 --->添加--->类--->修改名称--->创建 )

并给字段添加一些特性如下图: 

   /// <summary>
    /// 用户表
    /// </summary>
    public class infouser
    {
        [key]//主键 非已id命名的主键必须添加
        [stringlength(10)]
        [displayname("用户名")]//显示名称
        [required(errormessage = "酒店名称不能为空")]//属性 表示该字段不能为空
        public string username { get; set; }
        [stringlength(16)]
        [displayname("密码")]
        [required(errormessage = "密码不能为空")]
        public string password { get; set; }
        [displayname("创建日期")]
        public datetime dtcreate { get; set; }
        [displayname("登录日期")]
        public datetime dtlogin { get; set; } 
        public byte[] headerimg { get; set; }

}

 

2)再添加一个实体框架类【数据库上下文类】(同样在models文件夹下创建,命名我这推荐以db+name,如dbwwp;) 

创建后再继承dbcontext

/// <summary>
/// 实体框架 entityframeworkcore
/// </summary>
namespace easyblog.models
{
    public class dbwwp : dbcontext
    {
        public dbwwp(dbcontextoptions<dbwwp> options)
         : base(options)
        {

 
        }
        public dbset<infouser> infousers { get; set; }
        public dbset<infoblog> infoblogs { get; set; }
        public dbset<infolog> infologs { get; set; }
        public dbset<inforeply> inforeplys { get; set; }
    }
}

 

3)首先添加两个包:microsoft.entityframeworkcore.sqlserver 和microsoft.entityframeworkcore.tools

步骤:

右键依赖项-->管理nuget程序包--->浏览--->搜索包名--->选择需要的包下载并安装

 ASP.NET Core MVC的基础学习笔记

 

4)在 startup类中的 configureservices 方法中注册数据库上下文

services.adddbcontext<dbwwp>(options => options.usesqlserver(configuration.getconnectionstring("dbwwp")));

 

5)现在我们打开” 程序包管理器控制台”(工具-->nuget 包管理器-->程序包管理器控制台),写入命令 “add-migration init” 如下图,添加新的数据库” 迁移”(init--是迁移的名称)。

 ASP.NET Core MVC的基础学习笔记

不要介意add-migration 后面的名字与上图不符哈, 出来这个黄色的后成功一半咯~

 ASP.NET Core MVC的基础学习笔记 

update-database 然后回车

 ASP.NET Core MVC的基础学习笔记

 这时候在上下文中就会出现一个叫做当前创建日期 加上你之前add 后面创建名字的一个记录了添加的” 迁移” 都保存在 migrations 目录下:

 ASP.NET Core MVC的基础学习笔记

 

三、新增mvc和ef框架

 

1)接下来我们开始创建一套完整的mvc及增删改查,所以我们选择 “视图使用 entity framework 的 mvc 控制器”(步骤:controllers文件夹右键 -->添加-->双击控制器-->视图使用 entity framework 的 mvc 控制器):

 ASP.NET Core MVC的基础学习笔记

 

2)接下来下拉选择好模型类(如上面创建的模型类infousers)、下拉选中自己创建的数据上下文类(如上面创建的数据库上下文类),勾上” 生成视图”,点击” 添加” 即可,同时你也可以自己命名,但控制器名称必须以controller结尾(这是asp.net core mvc的一个约定),这里我们默认命名infouserscontroller

 ASP.NET Core MVC的基础学习笔记

创建完后系统自动帮我们生成了控制器(如图下infouserscontroller)和自动在views 文件夹下生成 infousers文件夹的增删改查等五个的视图(如图下的create-增,delete-删,details-查,edit-改,index-主页):

 ASP.NET Core MVC的基础学习笔记

当然你也可以自己创建view视图,不过添加view视图有两种方法,一种是直接在views文件夹下添加(右键views文件夹下的infousers文件夹-->添加-->视图);另外一种是通过controller中的action来添加,打开控制器里(如infouserscontroller), 在”return view ();” 的地方右键-->添加视图方法。不过我推荐大家采用后一种方法。

 ASP.NET Core MVC的基础学习笔记

3)采用前面两种方法后会进入如下图添加视图确认窗口,点添加就行

 

ASP.NET Core MVC的基础学习笔记

 

4)这样再添加了一个和特定的controller和infousers(这里指infouserscontroller和login)相对应的view(login.cshtml)并补充代码如下

 login.cshtml

@{
    viewdata["title"] = "登录";
}

<h4>@viewdata["title"]</h4>
<hr />
<div class="row">
    <div class="col-md-4">
        <form asp-action="login">
            <div class="form-group">
                <label class="control-label">用户名</label>
                <input name="username" id="username" class="form-control" />
            </div>
            <div class="form-group">
                <label class="control-label">密码</label>
                <input name="password" id="password" type="password" class="form-control" />
            </div>
            <div class="form-group">
                <input type="submit" value="登录" class="btn btn-primary" />
                <small>@viewbag.msg</small>
            </div>
        </form>
    </div>
</div>

 

infouserscontroller.cs

public iactionresult login()
        {
            return view();
        }

        [httppost]
        [actionname("login")]
        public async task<actionresult> logining()
        {
            var username = request.form["username"];
            var password = request.form["password"];
            var item = db.infousers.find(username);

            if (item != null && password == item.password)
            {

                item.dtlogin = datetime.now;
                db.savechanges();


                var claims = new list<claim>();

                claims.add(new claim(claimtypes.name, username));

                var claimsidentity = new claimsidentity(claims, "cookies");
                await httpcontext.signinasync(new claimsprincipal(claimsidentity));
                return redirecttoaction("index", "blog");
            }
            else
                viewbag.msg = "登陆失败";
            return view();
        }

 

  

5)最后运行程序(单击iis express如图ASP.NET Core MVC的基础学习笔记或按f5),启动后在浏览器地址中后面接上/infousers/login(浏览器中的地址 xx/infousers/login与开头的路由规则url:"{controller}/{action}/{id}"对应起来)后按回车enter。

ASP.NET Core MVC的基础学习笔记

当可以看到这界面时,说明成功了。

最后,请大家戴口罩,勤洗手,少去人群聚集处。保护好自己不给祖国添麻烦!!!武汉加油!中国加油!!!