咱俩先将民用网站项目配置一下,不须要安装Git插件

轮换前端框架

准备干活做完,浏览器输入网站服务器IP,可以看来可以健康访问,然则.net
core
mvc帮我们自动生成的界面,不必然符合大家的急需,那如故要好找一个前端的UI框架,替换一下既有界面。这里我选拔的是 AdminLTE ,那是一个基于
bootstrap 的轻量级后台模板,相关的素材大家可以去官网商量一下。

咱们把下载的文本解压缩到wwwroot/lib目录下,第一步先重构一下登录的界面:

 1 @model LoginViewModel
 2 
 3 @{
 4     Layout = null;
 5     ViewData["Title"] = "登录";
 6 }
 7 
 8 <!DOCTYPE html>
 9 <html>
10 <head>
11     <meta charset="utf-8" />
12     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
13     <title>@ViewData["Title"] - LanceL0t</title>
14 
15     @await Html.PartialAsync("_SiteCssPartial")
16 </head>
17 <body class="hold-transition login-page">
18     <div class="login-box">
19         <div class="login-box-body">
20             <p class="login-box-msg">欢迎,由此登录</p>
21             <form asp-route-returnurl="@ViewData["ReturnUrl"]" method="post">
22                 <div asp-validation-summary="All" class="text-danger"></div>
23                 <div class="form-group has-feedback">
24                     <input asp-for="Email" class="form-control" placeholder="邮箱">
25                     
26                 </div>
27                 <div class="form-group has-feedback">
28                     <input asp-for="Password" class="form-control" placeholder="密码">
29                     
30                 </div>
31                 <div class="row">
32                     <div class="col-xs-8">
33                         <div class="checkbox icheck">
34                             <label asp-for="RememberMe">
35                                 <input asp-for="RememberMe"> @Html.DisplayNameFor(m => m.RememberMe)
36                             </label>
37                         </div>
38                     </div>
39                     <div class="col-xs-4">
40                         <button type="submit" class="btn btn-primary btn-block btn-flat">登录</button>
41                     </div>
42                 </div>
43             </form>
44             <div class="social-auth-links text-center">
45                 <p>- 或者 -</p>
46                 <a href="#" class="btn btn-block btn-social btn-facebook btn-flat">
47                     <i class="fa fa-facebook"></i> Sign in using
48                     Facebook
49                 </a>
50                 <a href="#" class="btn btn-block btn-social btn-google btn-flat">
51                     <i class="fa fa-google-plus"></i> Sign in using
52                     Google+
53                 </a>
54             </div>
55             <a asp-action="ForgotPassword">忘记密码</a><br>
56             <a asp-action="Register" asp-route-returnurl="@ViewData["ReturnUrl"]" class="text-center">立即注册</a>
57         </div>
58     </div>
59 </body>
60 </html>
61 
62 @await Html.PartialAsync("_SiteScriptsPartial")
63 @await Html.PartialAsync("_ValidationScriptsPartial")

随即第二步,优化一下事先的新用户注册界面:

 1 @model RegisterViewModel
 2 
 3 @{
 4     Layout = null;
 5     ViewData["Title"] = "注册";
 6 }
 7 
 8 <!DOCTYPE html>
 9 <html>
10 <head>
11     <meta charset="utf-8" />
12     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
13     <title>@ViewData["Title"] - LanceL0t</title>
14 
15     @await Html.PartialAsync("_SiteCssPartial")
16 </head>
17 <body class="hold-transition login-page">
18     <div class="login-box">
19         <div class="login-box-body">
20             <p class="login-box-msg">欢迎,注册新用户</p>
21             <form asp-route-returnurl="@ViewData["ReturnUrl"]" method="post">
22                 <div asp-validation-summary="All" class="text-danger"></div>
23                 <div class="form-group has-feedback">
24                     <input asp-for="Email" class="form-control" placeholder="请输入邮箱">
25                     
26                 </div>
27                 <div class="form-group has-feedback">
28                     <input asp-for="Password" class="form-control" placeholder="请输入密码">
29                     
30 
31                 </div>
32                 <div class="form-group has-feedback">
33                     <input asp-for="ConfirmPassword" class="form-control" placeholder="请确认密码">
34                     
35                 </div>
36                 <div class="row">
37                     <div class="col-xs-8">
38                         <div class="checkbox icheck">
39                             <label asp-for="IsAgree">
40                                 <input asp-for="IsAgree"> 阅读并接受《<a href="#">用户协议</a>》
41                             </label>
42                         </div>
43                     </div>
44                     <div class="col-xs-4">
45                         <button type="submit" class="btn btn-primary btn-block btn-flat">注册</button>
46                     </div>
47                 </div>
48             </form>
49             <div class="social-auth-links text-center">
50                 <p>- 或者 -</p>
51                 <a href="#" class="btn btn-block btn-social btn-facebook btn-flat">
52                     <i class="fa fa-facebook"></i> Sign in using
53                     Facebook
54                 </a>
55                 <a href="#" class="btn btn-block btn-social btn-google btn-flat">
56                     <i class="fa fa-google-plus"></i> Sign in using
57                     Google+
58                 </a>
59             </div>
60             <a asp-controller="Account" asp-action="Login">已有账号</a><br>
61         </div>
62     </div>
63 </body>
64 </html>
65 
66 @await Html.PartialAsync("_SiteScriptsPartial")
67 @await Html.PartialAsync("_ValidationScriptsPartial")

那边的知识很简短,就不在祥述了,但是因为用的是.net
core提供的identity用户管理和表达,有些个人遭受的题材,我依旧列出来,以免再走弯路。

4.1、Github注册成功后,点击右上角的“+”号,选择New
repository开成立代码仓库

VS2017支持Github

拔取 工具–>扩大和换代,搜索GitHub,安装GitHub的VS插件

图片 1

设置完插件,打开视图–>团队资源管理器,我们得以看到Git插件菜单。通过菜单大家能够新建Git存储库,可以付出修改的代码,并一键同步交付后的代码到自己的GitHub项目中。

图片 2     
  图片 3

再打开GitHub,可以看大家的代码已经联手了,是或不是很有益于?

图片 4

长途连接成功

identity的本地化

此时此刻应用identity默许的荒唐描述是英文,那里我们需求浮现成中文,所以新增一个IdentityExtensions类,继承IdentityErrorDescriber,重写错误描述 

 1 public class IdentityExtensions : IdentityErrorDescriber
 2 {
 3     public override IdentityError PasswordRequiresNonAlphanumeric()
 4     {
 5         return new IdentityError
 6         {
 7             Code = nameof(PasswordRequiresNonAlphanumeric),
 8             Description = "密码至少包含1位非数字字母的特殊字符"
 9         };
10     }
11 
12     public override IdentityError PasswordRequiresDigit()
13     {
14         return new IdentityError
15         {
16             Code = nameof(PasswordRequiresDigit),
17             Description = "密码至少包含1位数字('0'-'9')"
18         };
19     }
20 
21     public override IdentityError PasswordRequiresLower()
22     {
23         return new IdentityError
24         {
25             Code = nameof(PasswordRequiresLower),
26             Description = "密码至少包含1位小写字符 ('a'-'z')"
27         };
28     }
29 
30     public override IdentityError PasswordRequiresUpper()
31     {
32         return new IdentityError
33         {
34             Code = nameof(PasswordRequiresUpper),
35             Description = "密码至少包含1位大写写字符 ('A'-'Z')"
36         };
37     }
38 }

重写中文错误描述后,大家还得在Startup.cs文件中的服务配置中登记:

 1 public void ConfigureServices(IServiceCollection services)
 2 {
 3     services.AddDbContext<ApplicationDbContext>(options =>
 4     options.UseSqlServer(Configuration.GetConnectionString("DefaultConnection")));
 5 
 6     services.AddIdentity<ApplicationUser, IdentityRole>()
 7     .AddEntityFrameworkStores<ApplicationDbContext>()
 8     .AddDefaultTokenProviders()
 9         .AddErrorDescriber<IdentityExtensions>();
10 
11     // Add application services.
12     services.AddTransient<IEmailSender, EmailSender>();
13 
14     services.AddMvc();
15 }

签到和登记新用户不是问题了,再来改造一下记名后主页的布局,把_Layout布局视图分割成顶部区域、左边导航菜单、内容区域、底部区域、右边侧边栏,并用一些视图分别渲染:

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4     <meta charset="utf-8" />
 5     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 6     <title>@ViewData["Title"] - LanceL0t</title>
 7 
 8     @await Html.PartialAsync("_SiteCssPartial")
 9 </head>
10 <body class="hold-transition skin-blue sidebar-mini">
11     <div class="wrapper">
12         <!-- 顶部区域 -->
13         @await Html.PartialAsync("_LayoutHeaderPartial")
14         <!-- 导航栏 -->
15         @await Html.PartialAsync("_LayoutNavbarPartial")
16         <!-- 内容区域 -->
17         <div class="content-wrapper">
18             <section class="content-header">
19                 <h1>
20                     Dashboard
21                     <small>Version 2.0</small>
22                 </h1>
23                 <ol class="breadcrumb">
24                     <li><a href="#"><i class="fa fa-dashboard"></i> 主页</a></li>
25                     <li class="active">Dashboard</li>
26                 </ol>
27             </section>
28             <section class="content">
29                 @RenderBody()
30             </section>
31         </div>
32         <!-- 底部区域 -->
33         @await Html.PartialAsync("_LayoutFooterPartial")
34         <!-- 侧边栏 -->
35         @await Html.PartialAsync("_LayoutSidebarPartial")
36     </div>
37 
38     @await Html.PartialAsync("_SiteScriptsPartial")
39     @RenderSection("Scripts", required: false)
40 </body>
41 </html>

如此,大家登录和挂号功能大体已毕了,大家看下效果:

图片 5

标记修改的代码

  • VS2017中接济Git存储库,绑定Github项目,达成地点VS程序与线上Github一键代码提交和协办;
  • 搭建服务器FTP站点,VS2017中配备一键安排网站文件到服务器;

(3)将长途仓库的代码pull(合并)到当地仓库

自定义的劳务器端和客户单的讲明

诸如,新用户注册时,要力保用户已勾选“阅读并接受用户协商”。而MVC本身校验机制尚未提供bool型必须为true的校验,那里我们自己完毕一个服务器端属性的校验,须求后续

  ValidationAttribute和IClientModelValidator:

 1 /// <summary>
 2 /// 复选框必须选中验证
 3 /// </summary>
 4 [AttributeUsage(AttributeTargets.Property, AllowMultiple = false, Inherited = false)]
 5 public sealed class MustBeTrueAttribute : ValidationAttribute, IClientModelValidator
 6 {
 7     //服务器端验证
 8     public override bool IsValid(object value)
 9     {
10         return value != null && (bool)value;
11     }
12 
13     public void AddValidation(ClientModelValidationContext context)
14     {
15         MergeAttribute(context.Attributes, "data-val", "true");
16         var errorMessage = FormatErrorMessage(context.ModelMetadata.GetDisplayName());
17         MergeAttribute(context.Attributes, "data-val-mustbetrue", errorMessage);
18     }
19 
20     private bool MergeAttribute(
21         IDictionary<string, string> attributes,
22         string key,
23         string value)
24     {
25         if (attributes.ContainsKey(key))
26         {
27             return false;
28         }
29         attributes.Add(key, value);
30         return true;
31     }
32 }

再增进客户端的验证措施:

 1 <script>
 2     //必须复选框勾选验证
 3     $.validator.addMethod("mustbetrue",
 4         function (value, element, parameters) {
 5             return value === "true";
 6         });
 7 
 8     $.validator.unobtrusive.adapters.add("mustbetrue", [], function (options) {
 9         options.rules.mustbetrue = {};
10         options.messages["mustbetrue"] = options.message;
11     });
12 </script>

此后在myeclipse中导入该类型,更改代码后的交给形式请看上边的第六步。

俗话说,磨刀不费砍柴工。为了更利于的进展项目管理,我们先将个人网站项目布局一下,满足以下2个目的:

新分支

有了以上的陈设,大家可以绝不每一次拉取和协同大家的次第到Github中,也不用每回在该地公布,拷贝服务器,我们只用在VS2017中简单的一键同步到Github或网站服务器。那样大家的开支效用有了很大的滋长,也方便线上表明大家的程序代码。

分支liy

VS2017帮忙FTP远程发表

要VS辅助FTP发布,首先要将网站服务器配置成FTP服务器。

Server2008添加新的角色,选中文件服务并安装新角色:

图片 6

双重当选已设置的IIS服务,增添FTP服务器相关的角色:

图片 7

随着,在IIS网站右键采纳“添加FTP站点”,选取FTP文件物理路径和增加站点名称:

图片 8

端口默许21,不用选用SSL证书,身份验证这里拔取基本讲明(为了一定的安全性,不要勾选匿名),授权访问里,指定administrator才能访问FTP站点,并负有读取和写入的权限;

图片 9

落成后,大家建好的FTP就自行启动了,那时浏览器中输入ftp://localhost,输入用户名和密码,就可以访问对应的文件目录了。当然,大家外网依然不能访问,为啥吧?相信大家看过上一篇,应该精晓是防火墙的原由,我们依据上一篇的配备,伸张FTP
21端口的同意入站规则,那样我们外网就经过FTP访问网站公布目录。

配备完外网服务器,我们来配置一下地面VS2017,右键项目–>揭橥,选拔FTP发表,选项配置如下:

图片 10

如此那般我们就已经安插好当地一键揭橥站点到长途服务器了。未来直接点公布按钮,就足以看看自动将转变的公布文件,同步到网站服务器:

图片 11

1、安装Git插件

1>右键文件–>team–>Add to Index;

配置Git代码库

(4)重新提交修改代码并推送至服务器

图片 12

      
由于Github的代码是开源的,每个人都可以查阅代码,不过唯有和睦力所能及修改代码。Github通过SSH
Key识别出提交的代码是用户自己推送的,才可以针对相应的代码进行操作。即地面Git仓库和GitHub仓库之间的传导是透过SSH加密的,所以要求地面创造SSH
Key并在GitHub服务器上安装SSH
Key,从而开创本地和Guthub服务器的涉及:window->preferences–>general–>Network
Connections–>SSH2

图片 13

为了选拔远程推送,您必须指定至少一个URI和至少一个REF映射

克隆URI

(5)点击Finish

版本控制

图片 14

图片 15

点击Next

图片 16

类型右键–>Add to Index ,修改的文书标记为“*”

4、在Github上创造自己的代码仓库

8、修改代码提交至远程仓库Github

Github中添加公有密钥

(1)将改成的代码标记
    项目右键–>team–>synchronize workspace

图片 17

推送分支到长途

master分支

(2)Status:选中必要付出的公文

3.1、拷贝公钥文件id_rsa.pub的内容:找到刚刚保存公有秘钥的门道(如下),可以用Notepad打开文件并复制内容

5.2、右键项目–>team–>share project来共享项目

(3)提交新建的文本

(4)Initialize this repository with a
README:决定是还是不是变动一个README文件来起初化仓库(可选可不选)

推送远程结果

图片 18

6、首次提交项目至远程

利用Git进行项目共享

配置Push

图片 19

(1)首先切换回主分支:team–>Switch to –>master

(2)打开github网站的“settings”中的SSH
Keys或者直接页面访问https://github.com/settings/ssh  

(1)成立分支:项目右键–>team–>Switch to–>New Branch

来得修改的文书

远程连接中

9、合并分支

2.2、本地创造SSH Key:点击Key Management 中的Generate RSA
Key…生成SSH认证号,然后点击Save Pravite
Key进行保存(注意:不要将大家从前的公钥和密钥给覆盖了,大家可以选拔别的的目录举办封存),然后点击Apply

Github上的交付新闻

图片 20

国有密钥的保留路径

(4)输入title(任意填写,那里以gittest为例),然后将复制的公有密钥复制粘贴到key中

文件右键–>team–>commit–>commit and push

图片 21

图片 22

图片 23

(4)Commit:提交到地头

(4)点击ok之后再开展付出推送

  项目右键–>team–>commit

仓库本地路径

分段合并

直接项目右键–>team–>commit–>commit and
push推送项目至服务器,出现如下问题

支行推向远程

点击Yes后

SSH认证号

(1)Commit message:填写提交音讯

(1)查看本地提交新闻:右键项目–>team–>Show in
History来查阅提交音信

图片 24

(4)远程连接成功后,会见世如下界面

图片 25

(1)注册Github账号:打开Github主页https://github.com展开注册,按要求填写用户名、密码和信箱,并进行邮箱验证

 项目右键–>team–>pull (这一步可能须要解决代码争论,合并代码 )

(3)选中liy分支,点击Merge

图片 26

3.2、将从id_rsa.pub公有密钥文件中复制的内容添加到Github的ssh key
设定里:

(5)Giithub上显得提交信息

联手工作空间

7、修改代码提交至当地Git

图片 27

地方提交历史

(5)Create repository:点击生成代码仓库

10、通过利用egit插件来开展版本控制

Github服务器上的交由音讯

丰盛完毕后结果

新建文件

10.2、提交修改的代码到Github服务器

花色右键–>import–>Git–>Projects from Git

(4)将当地仓库代码push(推送)到长途仓库
品种右键–>team–>push to upstream

图片 28

图片 29

(3)点击右上角 Add SSH key  

图片 30

5、成立本地git仓库

图片 31

图片 32

合并结果

图片 33

图片 34

Git代码库地址

6.1、那里大家采取提交并推送按钮,会出现以下如下界面

(1)首先大家须求填写github中仓库地址(4.2中已获取),同时填写用户名、密码,选中记住

图片 35

点击Next

图片 36

图片 37

图片 38

(1)Resository name:填写自己定义的堆栈名(必填项)

.ssh的路径

(3)Commit and Push:提交到地头并推送至Github服务器

(2)项目展现就在bliy分支上

在意:私有密钥和国有密钥是成对的七个文本,私有文件保留在投机的本机,公有密钥保存到另一端的服务器、网站 
等。github就是一种网站。唯有保存了民用密钥的机械才能访问远程的服务器等。使用该键的裨益是毫不采取密码,而是以密钥的艺术阐明用户。要想使本机能访问github。有多个步骤:(1)
创立私有密钥和国有密钥(2)将国有密钥放到github里。(3)测试是不是设置成功(4)修改本地git配置文件并颁发

缘何在MyEclipse中的gittest已经通过项目右键–>team–>Commit多次,且经过品种右键–>team–>Show
in
History查看到了付出信息,问哪些在Guithub中仅能查到第一遍的交由新闻,之后却查不到?(注意:通过品种右键–>team–>commit只是交给到当地,而透过项目右键–>team–>push
to upstream或者commit中commit and push才会上流传Github服务器)

图片 39

交由至地点

(2)Description:填写描述(选填项)

图片 40

图片 41

交给出错

点击Next,出现如下界面,进行Git代码库配置

5.1、在MyEclipse中开创项目(如gittest)

入选项目右键–>team–>commit

代码仓库地址

那会儿仅在该地有付出音信,Github上尚未

创设代码仓库

(2)查看Github服务器上的提价音信:访问https://github.com/sewenfengqing/development翻开提交新闻(提交所在分层、提交描述、提交时间等)

(6)此时项目处境如下:即表示平素不指针指向的“NO-HEAD”已经不复存在,项目浮现在master分支上

图片 42

       
Myeclipse老版本可能要求安装Git插件(window->preference->Team下冒出Git就证实安装成功),高版本中早已安装好了。我所运用的是MyEclipse2016,不须要设置Git插件,所以在此处就不在具体讲述安装Git插件的步调。

加上公钥成功

点击Next,仓库就从远程Clone(克隆)到本地

3、在GitHub上安装SSH
Key,从而开创本地和Guthub服务器的关联
将扭转的公钥添加到Github中去

图片 43

图片 44

焚薮而田方案:

(后两步可以替换为:右键文件–>team–>commit–>commit and
push)

图片 45

交给项目

6.2、查看提交信息

图片 46

图片 47

2.1、General中的值为用户主目录下的.ssh文件和该目录下的id_rsa和id_rsa.pub文件(那四个就是SSH
Key的秘钥对,id_rsa是私钥,不可以泄暴露来,id_rsa.pub是公钥,可以放心地告诉任哪个人)

交由历史

(3)然后会开展长途通讯,即使网络不好或者会微微问题

图片 48

付出并推送新文件

2、生成MyEclipse的一个SSH的认证号

图片 49

(3)Public:保持选中(若是选Private可以挑选何人能来看哪个人能交付,public只好选哪个人能交付,private是要钱的)

4.2、获取代码仓库的地点:点击Create
repository后生成http地址就是该代码仓库的地址,如下图所示

3>而后大家再开展推送team–>Push branch liy

10.1、从服务器克隆代码仓库至地面

2>此时新建的文本前边会师世“+”号,右键文件–>team–>commit,选拔commit;

项目gittest

(2)将工作空间的代码提交到地点仓库

点击Finish,我们的工程展现为NO-HEAD,即表示从未指针指向

图片 50

推送成功

(2)之后:team–>Merge

(2)然后点击Next

图片 51

相关文章