ASP.NET MVC5网站开发用户修改资料和密码(六)

在上一篇文章网站开发(五)中实现了用户的注销和登录,其实代码里落了点东西,就是用户登录要更新最后一次登录时间和登录IP,这次补上。今天做修改资料和修改密码,TryUpdateModel是新用到的东西。

现完善昨天的登录代码:

一、用户导航菜单
这个就是侧栏的导航,以后所有控制器中action名都为Menu。目标效果如下:

先UserController添加Menu action。直接返回分布视图。右键添加视图

<div class="panel panel-primary">
 <div class="panel-heading"><h3>我的资料</h3></div>
 <div class="panel-body">
 <ul class="nav nav-pills nav-stacked">
  <li> <a href="@Url.Action("Details")"><span class="glyphicon glyphicon-user"> 修改资料</span></a></li>
  <li> <a href="@Url.Action("ChangePassword")"><span class="glyphicon glyphicon-log-out"> 修改密码</span></a></li>
  <li> <a href="@Url.Action("Logout")"><span class="glyphicon glyphicon-log-out"> 退出登录</span></a></li>
 </ul>
 </div>
</div>

二、显示用户资料
再在User控制器里添加显示用户资料的action Details。以后约定所有显示详细资料的动作名都为Details。在控制器中返回当前用户的资料

/// <summary>
 /// 显示资料
 /// </summary>
 /// <returns></returns>
 public ActionResult Details()
 {
  return View(userService.Find(User.Identity.Name));
 }

右键添加视图

@model Ninesky.Models.User

@{
 ViewBag.Title = "我的资料";
}

<div class="row">
 <div class="col-md-3 col-sm-4">@Html.Action("Menu")</div>
 <div class="col-md-9 col-sm-8">

 <ol class="breadcrumb">
  <li><span class="glyphicon glyphicon-home"><a> 会员中心</a></span></li>
  <li><a> 个人中心</a></li>
  <li>修改资料</li>
 </ol>

 @using (Html.BeginForm("Modify","User"))
 {
  @Html.AntiForgeryToken()

  <div class="form-horizontal">
  <h4>用户资料</h4>
  <hr />
  @Html.ValidationSummary(true)
  @Html.HiddenFor(model => model.UserID)

  <div class="form-group">
   @Html.LabelFor(model => model.UserName, new { @class = "control-label col-md-2" })
   <div class="col-md-10">
   @Html.DisplayFor(model => model.UserName)
   </div>
  </div>

  <div class="form-group">
   @Html.LabelFor(model => model.DisplayName, new { @class = "control-label col-md-2" })
   <div class="col-md-10">
   @Html.EditorFor(model => model.DisplayName)
   @Html.ValidationMessageFor(model => model.DisplayName)
   </div>
  </div>

  <div class="form-group">
   <label class = "control-label col-md-2">用户组</label>
   <div class="col-md-10">
   @foreach (var _relation in Model.UserRoleRelations){ <span>@_relation.Role.Name</span><br />}
   </div>
  </div>

  <div class="form-group">
   @Html.LabelFor(model => model.Email, new { @class = "control-label col-md-2" })
   <div class="col-md-10">
   @Html.EditorFor(model => model.Email)
   @Html.ValidationMessageFor(model => model.Email)
   </div>
  </div>
  <div class="form-group">
   <div class="col-md-offset-2 col-md-10">
   <input type="submit" value="修改" class="btn btn-default" />
   </div>
  </div>
  </div>
 }
 </div>
</div>
@section Scripts {
 @Scripts.Render("~/bundles/jqueryval")
}

@foreach (
var _relation in Model.UserRoleRelations){ <span>@_relation.Role.Name</span><br />} 这里是显示用户组名称,延迟加载。

三、修改用户资料
显示用户资料后点击修改直接向后台提交数据,这里把接受并更新数据库的动作名也是Details。在这个方法里不能直接用User做方法参数,因为我只想跟新显示名和邮箱,我如果设置User类型的参数,如果用户向服务器提交的参数中含有UserName,可能用户名都会改掉,这里使用TryUpdateModel来部分更新模型。

/// <summary>
 /// 修改资料
 /// </summary>
 /// <returns></returns>
 [ValidateAntiForgeryToken]
 [HttpPost]
 public ActionResult Modify()
 {

  var _user = userService.Find(User.Identity.Name);
  if (_user == null) ModelState.AddModelError("", "用户不存在");
  else
  {
  if (TryUpdateModel(_user, new string[] { "DisplayName", "Email" }))
  {
   if (ModelState.IsValid)
   {
   if (userService.Update(_user)) ModelState.AddModelError("", "修改成功!");
   else ModelState.AddModelError("", "无需要修改的资料");
   }
  }
  else ModelState.AddModelError("", "更新模型数据失败");
  }
  return View("Details", _user);
 }

代码中的TryUpdateModel(_user, new string[] { "DisplayName", "Email" }) 表示我只想从客户提交的数据中更新DisplayName和Email
 
四、修改密码
先建立一个视图模型ChangePasswordViewModel

using System.ComponentModel.DataAnnotations;

namespace Ninesky.Web.Areas.Member.Models
{
 /// <summary>
 /// 修改密码视图模型
 /// <remarks>创建:2014.02.19</remarks>
 /// </summary>
 public class ChangePasswordViewModel
 {
 /// <summary>
 /// 原密码
 /// </summary>
 [Required(ErrorMessage = "必填")]
 [Display(Name = "密码")]
 [StringLength(20, MinimumLength = 6, ErrorMessage = "{2}到{1}个字符")]
 [DataType(DataType.Password)]
 public string OriginalPassword { get; set; }

 /// <summary>
 /// 新密码
 /// </summary>
 [Required(ErrorMessage = "必填")]
 [Display(Name = "新密码")]
 [StringLength(20, MinimumLength = 6, ErrorMessage = "{2}到{1}个字符")]
 [DataType(DataType.Password)]
 public string Password { get; set; }

 /// <summary>
 /// 确认密码
 /// </summary>
 [Required(ErrorMessage = "必填")]
 [Compare("Password", ErrorMessage = "两次输入的密码不一致")]
 [Display(Name = "确认密码")]
 [DataType(DataType.Password)]
 public string ConfirmPassword { get; set; }
 }
}

然后在UserController中添加动作public ActionResult ChangePassword() 直接返一个视图。右键添加ChangePasswordViewModel类型的视图

@model Ninesky.Web.Areas.Member.Models.ChangePasswordViewModel

@{
 ViewBag.Title = "修改密码";
}
<div class="row">
 <div class="col-md-3 col-sm-4">@Html.Action("Menu")</div>
 <div class="col-md-9 col-sm-8">
 <ol class="breadcrumb">
  <li><span class="glyphicon glyphicon-home"><a> 会员中心</a></span></li>
  <li><a> 个人中心</a></li>
  <li>修改密码</li>
 </ol>

 @using (Html.BeginForm())
 {
  @Html.AntiForgeryToken()

  <div class="form-horizontal">
  <h4>修改密码</h4>
  <hr />
  @Html.ValidationSummary(true)

  <div class="form-group">
   @Html.LabelFor(model => model.OriginalPassword, new { @class = "control-label col-md-2" })
   <div class="col-md-10">
   @Html.EditorFor(model => model.OriginalPassword)
   @Html.ValidationMessageFor(model => model.OriginalPassword)
   </div>
  </div>

  <div class="form-group">
   @Html.LabelFor(model => model.Password, new { @class = "control-label col-md-2" })
   <div class="col-md-10">
   @Html.EditorFor(model => model.Password)
   @Html.ValidationMessageFor(model => model.Password)
   </div>
  </div>

  <div class="form-group">
   @Html.LabelFor(model => model.ConfirmPassword, new { @class = "control-label col-md-2" })
   <div class="col-md-10">
   @Html.EditorFor(model => model.ConfirmPassword)
   @Html.ValidationMessageFor(model => model.ConfirmPassword)
   </div>
  </div>

  <div class="form-group">
   <div class="col-md-offset-2 col-md-10">
   <input type="submit" value="修改" class="btn btn-default" />
   </div>
  </div>
  </div>
 }

 @section Scripts {
  @Scripts.Render("~/bundles/jqueryval")
 }

 </div>
</div>

在添加一个接受处理动作,代码也很简单

[ValidateAntiForgeryToken]
 [HttpPost]
 public ActionResult ChangePassword(ChangePasswordViewModel passwordViewModel)
 {
  if(ModelState.IsValid)
  {
  var _user = userService.Find(User.Identity.Name);
  if (_user.Password == Common.Security.Sha256(passwordViewModel.OriginalPassword))
  {
   _user.Password = Common.Security.Sha256(passwordViewModel.Password);
   if (userService.Update(_user)) ModelState.AddModelError("", "修改密码成功");
   else ModelState.AddModelError("", "修改密码失败");
  }
  else ModelState.AddModelError("", "原密码错误");
  }
  return View(passwordViewModel);
 }

五、在首页显示登录、注册链接
在Web的Shared文件件添加LoginPartial.cshtml视图文件,在用户未登录时显示登录和注册链接,登录后显示用户名。

@using Microsoft.AspNet.Identity
@if (Request.IsAuthenticated)
{
 using (Html.BeginForm("Logout", "User", FormMethod.Post, new { id = "logoutForm", @class = "navbar-right" }))
 {
 @Html.AntiForgeryToken()

 <ul class="nav navbar-nav navbar-right">
  <li>
  @Html.ActionLink("你好 " + User.Identity.GetUserName() + "!", "Manage", "Account", routeValues: null, htmlAttributes: new { title = "管理" })
  </li>
  <li><a href="javascript:document.getElementById('logoutForm').submit()">注销</a></li>
 </ul>
 }
}
else
{
 <ul class="nav navbar-nav navbar-right">
 <li>@Html.ActionLink("注册", "Register", "User", routeValues: new { Area = "Member" }, htmlAttributes: new { id = "registerLink" })</li>
 <li>@Html.ActionLink("登录", "Login", "User", routeValues: new {Area="Member"}, htmlAttributes: new { id = "loginLink" })</li>
 </ul>
}

效果如下:

登录前

登陆后

ok.现在我们可以给给member区域的UserController控制器和Homecontroller加上[Authorize]特性。并为Usercontroller的注册 登录 验证码action 加上[AllowAnonymous]特性。

这次修改资料部分用到了部分更新模型方法TryUpdateModel,到此member区域的用户部分暂时结束。下次开始内容部分,希望大家继续关注。

时间: 2015-09-14

ASP.NET MVC5网站开发之添加\删除\重置密码\修改密码\列表浏览管理员篇2(六)

一.安装插件. 展示层前端框架以Bootstrap为主,因为Bootstrap的js功能较弱,这里添加一些插件作补充.其实很多js插件可以通过NuGet安装,只是NuGet安装时添加的内容较多,不如自己复制来的干净,所以这里所有的插件都是下载然后复制到项目中. 1.Bootstrap 3 Datepicker 4.17.37 网址:https://eonasdan.github.io/bootstrap-datetimepicker/ 下载并解压压缩包->将bootstrap-datetimep

Asp.NEt邮箱验证修改密码通过邮箱找回密码功能

使用邮箱验证修改密码,在这里我是使用163免费邮进行测试 前台代码 <input type="text" name="Mail" id="Mail"/> <span>*请输入邮箱</span><br/> <asp:Button ID="zhuce" runat="server" Text="tijiao" OnClick="

PHP邮箱验证示例教程

在用户注册中最常见的安全验证之一就是邮箱验证.根据行业的一般做法,进行邮箱验证是避免潜在的安全隐患一种非常重要的做法,现在就让我们来讨论一下这些最佳实践,来看看如何在PHP中创建一个邮箱验证. 让我们先从一个注册表单开始: <form method="post" action="http://mydomain.com/registration/"> <fieldset class="form-group"> <lab

PHP结合jQuery实现找回密码

通常所说的密码找回功能不是真的能把忘记的密码找回,因为我们的密码是加密保存的,一般开发者会在验证用户信息后通过程序生成一个新密码或者生成一个特定的链接并发送邮件到用户邮箱,用户从邮箱链接到网站的重置密码模块重新设置新密码. 当然现在有的网站也有手机短信的方式找回密码,原理就是通过发送验证码来验明正身,和发送邮件验证一样,最终还是要通过重置密码来完成找回密码的流程. 一般步骤是: 1.表单输入注册时的邮箱: 2.验证用户邮箱是否正确,如果用户邮箱不存在网站的用户表中,则提示用户邮箱未注册: 3.发

JS 正则表达式验证密码、邮箱格式的实例代码

遗憾的是博客内容不允许包含js代码,不能在线测试,就只上代码了 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Regular Expression test</title> </head> <body> 用户名:(4-16位,字母.下划线.数字,减号) <br/> <input type="

java web激活邮箱并找回密码

几乎每个网站或论坛之类的用户注册后都需要通过发送邮件到邮箱激活用户,如何激活邮箱呐? 设计激活步骤: 1.发送激活操作链接地址至用户邮箱. 2.用户至邮箱查收邮件. 3.用户点击链接,跳转至成功页面(修改激活状态),激活成功. 实现: /** * 发送邮件 * * @param request * @return */ @RequestMapping(value = "/sendEmail.jhtml") @ResponseBody public String sendEmail(Ht

在Laravel框架里实现发送邮件实例(邮箱验证)

在经过一段时间的使用后,发现在项目中很多地方需要用到用户验证,以短信验证和邮箱验证为主流趋势,此篇文章小编给大家总结了如何在Laravel框架中实现发送邮件功能,以后会陆续更上如何实现短信验证..... 在.env文件下 1.配置Laravel文件 MAIL_DRIVER=smtp //建议使用smtp方式 MAIL_HOST=smtp.163.com //建议使用163邮箱 QQ邮箱会有报错 MAIL_PORT=25//smtp 默认为25 MAIL_USERNAME=null //自己的16

Java实现邮箱找回密码实例代码

通过邮件找回密码功能的实现 1.最近开发一个系统,有个需求就是,忘记密码后通过邮箱找回.现在的系统在注册的时候都会强制输入邮箱,其一目的就是 通过邮件绑定找回,可以进行密码找回.通过java发送邮件的功能我就不说了,重点讲找回密码. 2.参考别人的思路:发送邮件→请求邮件里的URL→验证url→{验证成功修改密码,不成功跳转到失败页面} 重点就是如何生成这个url和如何解析这个url. 需要注意的是一个url只能修改一次密码,当同一帐号发送多封邮件,只有最后一封邮件的url 邮箱 3.加密能防止

Python通过Django实现用户注册和邮箱验证功能代码

本文主要向大家分享了Python编程中通过Django模块实现用户注册以及邮箱验证功能的简单介绍及代码实现,具体如下. 用户注册: 类似于用户登陆,同样在users.views.py中添加RegisterView(View)类,其中对表单的get和post作出处理. 如果是get方法,重新返回register页面让用户进行填写. def get(self, request): register_form = RegisterForm() return render(request, "regis

JavaMailSender实现邮箱验证功能

本文通过JavaMailSender实现邮箱注册验证中遇到的问题开始着手,给大家详细分析了其原理以及问题的解决办法. 使用邮箱注册验证,我们需要理清设计思路: 问题一:注册信息提交后需要对填写的邮箱号发送邮件 问题二:邮件到达时用户如何进行激活,是通过get请求还是获取验证码(本篇使用get接口激活) 问题三:邮件激活如何设置有效时间 通过以上三个问题,博主来帮助大家掌握JavaMailSender邮箱验证 问题一 我首先需要解决如何向指定邮箱号发送邮件 在pom中加入如下依赖: <!--ema

java实现通过绑定邮箱找回密码功能

本文实例为大家分享了java实现通过绑定邮箱找回密码功能,供大家参考,具体内容如下 1.输入用户名及验证码,验证用户名是否存在 (1).生成验证码工具类 package com.utils; import java.awt.Color; import java.awt.Font; import java.awt.Graphics; import java.awt.image.BufferedImage; import java.util.HashMap; import java.util.Map