第四章 .net core做一个简单的登录

项目目标部署环境:CentOS 7+

项目技术点:.netcore2.0 + Autofac +webAPI + NHibernate5.1 + mysql5.6 + nginx

 开源地址:https://github.com/wmowm/nh.core

上篇我们已经讲了权限管理的实现,传送门:

第三章 搭建一个通用的权限管理系统

这次我换一种讲解,项目与博客,两者同时进行,gogogo

第一步,找个酷炫的登录页面

自己写页面是不可能的,这辈子都不可能的,设计又不会,css又不精通,只有在jq22上面偷页面才能维持的了生活的样子

最近的那个猫头鹰捂眼睛挺火啊,就是它了,先偷回来,再自己改造

第四章 .net core做一个简单的登录_第1张图片

先在mvc项目里创建一个登录

第四章 .net core做一个简单的登录_第2张图片

话说.net core添加视图是真心慢啊,要等半天,趁这时间吐槽一下

 

页面也非常简单,抄袭过来是这个样子,我们对它改造一下

第四章 .net core做一个简单的登录_第3张图片

改造效果如下

第四章 .net core做一个简单的登录_第4张图片

坑1字体图标问题

我也不知道它这个字体图标怎么选,先F12看看它是什么玩意

原来是这个,百度一下,现在最新的都是4.7了,我以前用的是4.4,干脆直接把以前的拿来用了

现在继续去实现验证码功能,还是用我们比较熟悉的GDI+绘制图片

在.net core里需要引入ZKWeb.System.Drawing包,听说部署到linux上,会有毛病,这个我们后面部署的时候再说

第四章 .net core做一个简单的登录_第5张图片

每次点击验证码,都会获取新的图片,然后把这个验证码md5加密保存到session里面

HttpContext.Session.SetString("pic_code", pic_code);//存入session

会直接报错

Session 还没有在这个应用程序或请求中配置好。

直接百度就好,园子里大神真是多,我是参考这篇文章实现的

ASP.NET Core 中文文档 第三章 原理(13)管理应用程序状态

现在做一个简单的提交,以前我们都是习惯这样ajax提交表单,.net core里已经没有了这种方式,那没办法,我们只有换一种形式了

听说jquery-ajax-unobtrusive.js这个插件不错,用的玩玩,效果还不错

"Home" asp-action="Login" data-ajax="true" data-ajax-mode="replace" data-ajax-loading="ValidateLog" data-ajax-success="tips(data)" data-ajax-method="post" class="container offset1 loginform">

验证码成功,就跳转到home/index页面,失败就刷新验证码,并给出提示

    //登录回调函数
    function tips(data) {
        if (data.status == "0") {
            window.location.href = data.returnUrl;
        } else
        {
            $("#imgcode").attr("src", "/Home/GetAuthCode?time=" + Math.random());
            alert(data.msg);
         }
    }

 我们继续优化它,还需要一个好看的loading,直接去jq22上面找,然后整合到外面项目中来

第四章 .net core做一个简单的登录_第6张图片

放在这里,效果还是挺不错的,然后完美继续优化弹出的提示框

第四章 .net core做一个简单的登录_第7张图片

做到这里基本上实现了整个功能,先将它发布到Linux上,看看效果

苦逼了,nginx这块还没有弄好,现在是一次只能代理一个端口,晚上继续研究

2018-4-25 8:21

关于nginx,网上资料很多,是自己弄复杂了,现在简单说下

第四章 .net core做一个简单的登录_第8张图片

最后一段,引入服务器的配置信息,它会读取/conf.d/目录下所有包含conf后缀的配置文件

 default.conf 内容如下:

第四章 .net core做一个简单的登录_第9张图片

这里代理转发了两个站点,映射端口分别为8081与80,现在还没有做静态资源转发

说说昨天遇到最大的深坑IIS Express崩溃,一个晚上都在弄,太可怕了

说说IIS Express崩溃的一些怪象

怪象1.无法正常的生成解决方案,会报错程序被占用,我必须手动关掉IIS Express进程

怪象2.mvc路由絮乱

我们直接说怪象2,怎么一个絮乱呢,举个栗子,mvc路由设置/home/index 为初始页面,此时我输入/home/login显示的内容还是index的内容,而且调试不会命中断点

除了启动的时候,会命中/home/index的控制器断点,后续所有刷新都不会命中断点,尝试用不同浏览器排除了缓存,加上GUID,发现每次GUID的值都会变化,前端抓包,排除301转发

重启电脑,也无法解决

没办法了,我只能让群友那边跑我的代码,有两位群友跑过,显示正常,我意识到可能是我的iis容器出现了问题,我尝试直接使用控制台作为容器,一切正常

做完这个,发现一个因细节疏忽,导致js出错,这个错误又调试了好久

模板页的引用,母版页引用会导致js冲突,项目中可能同时存在两个相同的jq引用,导致部分方法失效,所以一定要检查是否使用母版页

如不使用母版页,页面加上

@{
    Layout = null;
}

觉得对你有帮助的,可以去给我开源项目点个星星

开源地址:https://github.com/wmowm/nh.core

转载于:https://www.cnblogs.com/tibos/p/8927988.html

你可能感兴趣的:(第四章 .net core做一个简单的登录)