-
Notifications
You must be signed in to change notification settings - Fork 0
/
atom.xml
215 lines (117 loc) · 55.3 KB
/
atom.xml
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
<?xml version="1.0" encoding="utf-8"?>
<feed xmlns="http://www.w3.org/2005/Atom">
<title>SP Blog</title>
<icon>https://www.gravatar.com/avatar/28587295d610488886c736989d92a9d1</icon>
<subtitle>秋名山车神，火速超车中···</subtitle>
<link href="/atom.xml" rel="self"/>
<link href="http://spzhanqi.top/"/>
<updated>2018-07-22T09:27:46.432Z</updated>
<id>http://spzhanqi.top/</id>
<author>
<name>宋鹏</name>
<email>[email protected]</email>
</author>
<generator uri="http://hexo.io/">Hexo</generator>
<entry>
<title>git 相关一 / sell命令</title>
<link href="http://spzhanqi.top/2018/07/22/180722git1/"/>
<id>http://spzhanqi.top/2018/07/22/180722git1/</id>
<published>2018-07-22T09:03:38.000Z</published>
<updated>2018-07-22T09:27:46.432Z</updated>
<content type="html"><![CDATA[<h1 id="git-系列一"><a href="#git-系列一" class="headerlink" title="git 系列一"></a>git 系列一</h1><h2 id="命令行概述"><a href="#命令行概述" class="headerlink" title="命令行概述"></a>命令行概述</h2><ul><li>dos （windows）</li><li>shell （Linux）：bash csh ksh</li></ul><h2 id="常用命令"><a href="#常用命令" class="headerlink" title="常用命令"></a>常用命令</h2><ul><li>pwd (Print Working Directory) 查看当前目录</li><li>cd (Change Directory) 切换目录，如 cd /etc</li><li>ls (List) 查看当前目录下内容，如 ls -al</li><li>mkdir (Make Directory) 创建目录，如 mkdir blog</li><li>touch 创建文件，如 touch index.html</li><li>cat 查看文件全部内容，如 cat index.html</li><li>less 查看文件，如more /etc/passwd、less /etc/passwd</li><li>rm (remove) 删除文件，如 rm index.html、rm -rf blog</li><li>rmdir (Remove Directory) 删除文件夹，只能删除空文件夹，不常用</li><li>mv (move) 移动文件或重命名，如 mv index.html ./demo/index.html</li><li>cp (copy) 复制文件，cp index.html ./demo/index.html</li><li>tab 自动补全，连按两次会将所有匹配内容显示出来</li><li>> 和 >>重定向，如echo hello world! > README.md，>覆盖 >>追加</li><li>| 管道符可以将多个命令连接使用，上一次（命令）的执行结果当成下一次（命令）的参数。</li><li>grep 匹配内容，一般结合管道符使用</li></ul><h2 id="vi编辑器"><a href="#vi编辑器" class="headerlink" title="vi编辑器"></a>vi编辑器</h2><blockquote><p>linux操作系统标配，相当于windows下的记事本。</p></blockquote><h3 id="vi编辑器的三种模式"><a href="#vi编辑器的三种模式" class="headerlink" title="vi编辑器的三种模式"></a>vi编辑器的三种模式</h3><blockquote><p>vi编辑器提供了3种模式，分别是命令模式、插入模式、底行模式，每种模式下用户所能进行的操作是不一样的。</p></blockquote><ul><li>3种模式的切换如下图所示：</li></ul><figure class="image-bubble"> <div class="img-lightbox"> <div class="overlay"></div> <img src="img/git1.jpg" alt="" title=""> </div> <div class="image-caption"></div> </figure><h3 id="vi常用操作"><a href="#vi常用操作" class="headerlink" title="vi常用操作"></a>vi常用操作</h3><ul><li>a) 打开/创建文件， vi 文件路径</li><li>b) 底行模式 :w保存，:w filenme另存为</li><li>c) 底行模式 :q退出</li><li>d) 底行模式 :wq保存并退出</li><li>e) 底行模式 :e! 撤销更改，返回到上一次保存的状态</li><li>f) 底行模式 :q! 不保存强制退出</li><li>g) 底行模式 :set nu 设置行号</li><li>h) 命令模式 ZZ（大写）保存并退出</li><li>i) 命令模式 u辙销操作，可多次使用</li><li>j) 命令模式 dd删除当前行</li><li>k) 命令模式 yy复制当前行</li><li>l) 命令模式 p 粘贴内容</li><li>m) 命令模式 ctrl+f向前翻页</li><li>n) 命令模式 ctrl+b向后翻页</li><li>o) 命令模式 i进入编辑模式，当前光标处插入</li><li>p) 命令模式 a进入编辑模式，当前光标后插入</li><li>q) 命令模式 A进入编辑模式，光标移动到行尾</li><li>r) 命令模式 o进入编辑模式，当前行下面插入新行</li><li>s) 命令模式 O进入编辑模式，当前行上面插入新行</li></ul><h2 id="版本控制概述"><a href="#版本控制概述" class="headerlink" title="版本控制概述"></a>版本控制概述</h2><ul><li>本地版本控制</li><li>集中版本控制</li><li>分布式版本控制</li></ul><h2 id="git环境安装"><a href="#git环境安装" class="headerlink" title="git环境安装"></a>git环境安装</h2><ul><li>window安装<ul><li><a href="http://git-scm.com/download/win" target="_blank" rel="noopener">下载地址</a>，下载后和普通软件安装方式一样</li></ul></li><li>linux安装<ul><li>CentOS发行版：sudo yum install git</li><li>Ubuntu发行版：sudo apt-get install git</li></ul></li><li>Mac安装<ul><li>打开Terminal直接输入git命令，会自动提示，按提示引导安装即可</li></ul></li></ul><h2 id="git工作原理"><a href="#git工作原理" class="headerlink" title="git工作原理"></a>git工作原理</h2><h3 id="git的三个工作区域"><a href="#git的三个工作区域" class="headerlink" title="git的三个工作区域"></a>git的三个工作区域</h3><ul><li>工作目录</li><li>暂存区域</li><li>本地仓库</li></ul><figure class="image-bubble"> <div class="img-lightbox"> <div class="overlay"></div> <img src="img/area.jpg" alt="" title=""> </div> <div class="image-caption"></div> </figure><h3 id="git管理文件的4中状态"><a href="#git管理文件的4中状态" class="headerlink" title="git管理文件的4中状态"></a>git管理文件的4中状态</h3><ul><li>未追踪untraced</li><li>已暂存staged</li><li>已提交commited</li><li>已修改modified</li></ul><h2 id="git工作流程-本地创建仓库"><a href="#git工作流程-本地创建仓库" class="headerlink" title="git工作流程-本地创建仓库"></a>git工作流程-本地创建仓库</h2><ol><li>配置用户信息</li><li>初始化仓库</li><li>添加文件到暂存区</li><li>提交文件</li><li>查看文件状态</li><li>查看提交历史</li><li>撤销文件修改</li><li>恢复版本</li></ol><h2 id="git分支操作"><a href="#git分支操作" class="headerlink" title="git分支操作"></a>git分支操作</h2><h3 id="分支概述"><a href="#分支概述" class="headerlink" title="分支概述"></a>分支概述</h3><h3 id="分支操作"><a href="#分支操作" class="headerlink" title="分支操作"></a>分支操作</h3><ol><li>创建分支</li><li>切换分支</li><li>合并分支</li><li>删除分支</li></ol><h2 id="Git命令"><a href="#Git命令" class="headerlink" title="Git命令"></a>Git命令</h2><ul><li>配置用户信息<ul><li>全局配置，软件安装目录C:\Program Files\Git\mingw64\etc\gitconfig</li><li>用户配置，用户名目录C:\Users\www.gitconfig</li><li>项目配置，项目目录</li><li>git config –global user.name zhangsan</li><li>git config –global user.email “<a href="mailto:[email protected]" target="_blank" rel="noopener">[email protected]</a>“</li></ul></li><li>查看文件状态<ul><li>git status</li></ul></li><li>查看提交记录(按q键退出)<ul><li>git log</li></ul></li><li>工作区添加到暂存区<ul><li>git add</li></ul></li><li>暂存区覆盖工作区内容<ul><li>git checkout</li></ul></li><li>暂存区提交到本地仓库<ul><li>git commit -m ‘bug fixed’</li></ul></li><li>回滚特定版本<ul><li>git reset –hard <commit></commit></li></ul></li></ul>]]></content>
<summary type="html">
<h1 id="git-系列一"><a href="#git-系列一" class="headerlink" title="git 系列一"></a>git 系列一</h1><h2 id="命令行概述"><a href="#命令行概述" class="headerlink" ti
</summary>
<category term="语法" scheme="http://spzhanqi.top/tags/%E8%AF%AD%E6%B3%95/"/>
<category term="git" scheme="http://spzhanqi.top/tags/git/"/>
</entry>
<entry>
<title>git 相关二 / git基础命令</title>
<link href="http://spzhanqi.top/2018/07/22/180722git2/"/>
<id>http://spzhanqi.top/2018/07/22/180722git2/</id>
<published>2018-07-22T09:03:38.000Z</published>
<updated>2018-07-22T09:29:58.926Z</updated>
<content type="html"><![CDATA[<h1 id="git"><a href="#git" class="headerlink" title="git"></a>git</h1><h2 id="常用命令"><a href="#常用命令" class="headerlink" title="常用命令"></a>常用命令</h2><ul><li>配置用户信息<ul><li>git config –global user.name 用户名</li><li>git config –global user.email 邮箱</li></ul></li><li>初始化本地仓库<ul><li>git init</li></ul></li><li>初始化远程仓库<ul><li>git init –bare</li></ul></li><li>把工作目录文件添加到暂存区<ul><li>git add 文件列表</li><li>git add *</li></ul></li><li>把暂存区中文件添加到本地仓库<ul><li>git commit -m 备注信息</li><li>git commit -a -m 备注信息 （-a只能提交已修改的文件，不能提交未跟踪文件）</li></ul></li><li>add的逆操作<ul><li>git rm –cached 文件列表</li></ul></li><li>回滚修改的内容<ul><li>git checkout 文件列表</li><li>git checkout . (回滚所有的修改，慎重使用)</li></ul></li><li>使用本地仓库的快照进行回滚<ul><li>git reset<ul><li>–hard</li><li>–soft</li><li>–mixed (默认参数)</li></ul></li></ul><ul><li>回滚最后一次提交<ul><li>git reset –hard HEAD^</li></ul></li><li>回滚所有的工作目录和暂存区内容<ul><li>git reset –hard HEAD</li></ul></li></ul></li><li>克隆远程仓库的项目<ul><li>git clone 远程仓库地址 项目名称</li></ul></li><li>拉取远程的分支<ul><li>git pull 远程仓库地址 远程分支名称:本地分支名称</li></ul></li><li>推送分支到远程仓库<ul><li>git push 远程仓库地址 本地分支名称:远程分支名称</li></ul></li><li>添加远程仓库别名<ul><li>git remote add 别名 远程仓库地址</li></ul></li><li>删除远程仓库别名<ul><li>git remote remove 别名</li></ul></li><li>查看远程仓库别名的详细信息<ul><li>git remote show 别名</li></ul></li><li>查看所有别名<ul><li>git remote</li></ul></li></ul><h2 id="分支操作"><a href="#分支操作" class="headerlink" title="分支操作"></a>分支操作</h2><ul><li>创建分支<ul><li>git branch 分支名称</li></ul></li><li>切换分支<ul><li>git checkout 分支名称</li></ul></li><li>创建并切换分支<ul><li>git checkout -b 分支名称</li></ul></li><li>删除本地分支<ul><li>git branch -d 分支名称（如果没有被合并，无法删除）</li><li>git branch -D 分支名称（强制删除）</li></ul></li><li>查看本地分支<ul><li>git branch</li></ul></li><li>查看远程分支<ul><li>git branch -r</li></ul></li><li>查看所有分支<ul><li>git branch -a</li></ul></li><li>删除远程分支<ul><li>git push 远程仓库地址 :远程分支名称</li><li>git push 远程仓库地址 –delete 远程分支名称</li></ul></li><li>保存当前状态<ul><li>git stash</li></ul></li><li>恢复当前状态<ul><li>git stash pop</li></ul></li></ul>]]></content>
<summary type="html">
<h1 id="git"><a href="#git" class="headerlink" title="git"></a>git</h1><h2 id="常用命令"><a href="#常用命令" class="headerlink" title="常用命令"></a>常用命
</summary>
<category term="语法" scheme="http://spzhanqi.top/tags/%E8%AF%AD%E6%B3%95/"/>
<category term="git" scheme="http://spzhanqi.top/tags/git/"/>
</entry>
<entry>
<title>git 相关三 / 远程仓库相关</title>
<link href="http://spzhanqi.top/2018/07/22/180722git3/"/>
<id>http://spzhanqi.top/2018/07/22/180722git3/</id>
<published>2018-07-22T09:03:38.000Z</published>
<updated>2018-07-22T09:35:56.731Z</updated>
<content type="html"><![CDATA[<h1 id="git-系列三"><a href="#git-系列三" class="headerlink" title="git-系列三"></a>git-系列三</h1><h2 id="分支"><a href="#分支" class="headerlink" title="分支"></a>分支</h2><h2 id="远程登录"><a href="#远程登录" class="headerlink" title="远程登录"></a>远程登录</h2><ul><li>telnet 一种不加密的通信协议</li><li>ssh 一种协议，用来实现两台计算机之间的通信（具体就是实现远程登录）<ul><li>使用密码登录<ul><li>首先客户端向服务器发送一个请求</li><li>服务器接收到请求之后向客户度发送自己的公钥</li><li>客户端接收到公钥之后存储到指定目录（C:\Users\www.ssh）</li><li>客户端输入密码然后用公钥加密，再次发送请求</li><li>服务器接收到密文之后，使用自己的私钥揭秘然后验证通过，从而允许客户端登录</li></ul></li><li>使用公钥和私钥登录<ul><li>客户端先生成自己的公钥和私钥（ssh-keygen -t rsa）</li><li>把客户端的公钥传递给服务器，服务器使用该公钥给客户端授权</li><li>客户端直接就可以免密登录了</li></ul></li></ul></li></ul><h2 id="远程（共享）仓库"><a href="#远程（共享）仓库" class="headerlink" title="远程（共享）仓库"></a>远程（共享）仓库</h2><blockquote><p>借助一个远程仓库，大家可以共享代码、历史版本等数据，实现团队成员之间代码同步。</p></blockquote><h2 id="远程仓库操作流程"><a href="#远程仓库操作流程" class="headerlink" title="远程仓库操作流程"></a>远程仓库操作流程</h2><h3 id="创建远程仓库"><a href="#创建远程仓库" class="headerlink" title="创建远程仓库"></a>创建远程仓库</h3><ol><li>创建以.git结尾的目录mkdir repo.git</li><li>进入该目录cd repo.git</li><li>初始化共享仓库git init –bare </li></ol><blockquote><p>这样我们就建好了一个共享的仓库，但这时这个仓库是一个空的仓库，并且不允在这个仓库中进行任何修改。</p></blockquote><h3 id="向共享仓库推送内容"><a href="#向共享仓库推送内容" class="headerlink" title="向共享仓库推送内容"></a>向共享仓库推送内容</h3><blockquote><p>将自已开发的项目同步到这个目录中，其它开发者就可以共享你开发的项目了。</p></blockquote><ol><li>进入自己的项目跟目录 cd demo</li><li>git push ../repo.git master</li></ol><blockquote><p>这样demo项目就进入到了共享仓库中</p></blockquote><h3 id="从共享仓库取出内容"><a href="#从共享仓库取出内容" class="headerlink" title="从共享仓库取出内容"></a>从共享仓库取出内容</h3><ol><li>新创建一个目录example（模拟另一个开发者）</li><li>进入该目录cd ./example</li><li>git clone repo.git</li></ol><p>通过repo.git共享仓库，我们轻松得到了一个demo的副本</p><h3 id="基于克隆下来的项目进行修改"><a href="#基于克隆下来的项目进行修改" class="headerlink" title="基于克隆下来的项目进行修改"></a>基于克隆下来的项目进行修改</h3><ul><li>修改内容</li><li>提交内容</li><li>推送内容</li></ul><blockquote><p>这样便实现了代码的共享，但是，我们发现我们这个共享的仓库只是放到了本地的，其它人是没有办法从我们这个共享仓库共享内容的！！！，那么要想实现共享，我们可以把这个共享的仓库放到一台远程服务器上，问题不就解决了吗？</p></blockquote><h2 id="远程仓库服务GitHub"><a href="#远程仓库服务GitHub" class="headerlink" title="远程仓库服务GitHub"></a>远程仓库服务GitHub</h2><blockquote><p>如果我们熟悉服务器的话，我们完全可以将上述的步骤在我们的远程服务器上进行操作，然后再做一些登录权限的设置，就可非常完美的搭建一个共享服务器了。其实为了更好的管理我们的仓库，一些第三方机构开发出了Web版仓库管理程序，通过Web界面形式管理仓库。</p></blockquote><h2 id="GitHub概述"><a href="#GitHub概述" class="headerlink" title="GitHub概述"></a>GitHub概述</h2><h2 id="GitHub基本使用"><a href="#GitHub基本使用" class="headerlink" title="GitHub基本使用"></a>GitHub基本使用</h2><ol><li>注册账号</li><li>创建共享仓库</li></ol><h2 id="GitHub地址格式"><a href="#GitHub地址格式" class="headerlink" title="GitHub地址格式"></a>GitHub地址格式</h2><ul><li>https://<ul><li>获取代码不需要密码</li><li>提交代码需要密码</li></ul></li><li>git@<ul><li>需要将自己的公钥添加到GitHub上</li><li>获取与提交代码都不需要密码</li></ul></li></ul>]]></content>
<summary type="html">
<h1 id="git-系列三"><a href="#git-系列三" class="headerlink" title="git-系列三"></a>git-系列三</h1><h2 id="分支"><a href="#分支" class="headerlink" title="分
</summary>
<category term="语法" scheme="http://spzhanqi.top/tags/%E8%AF%AD%E6%B3%95/"/>
<category term="git" scheme="http://spzhanqi.top/tags/git/"/>
</entry>
<entry>
<title>git 相关四 / 远程仓库相关</title>
<link href="http://spzhanqi.top/2018/07/22/180722git4/"/>
<id>http://spzhanqi.top/2018/07/22/180722git4/</id>
<published>2018-07-22T09:03:38.000Z</published>
<updated>2018-07-22T09:36:35.823Z</updated>
<content type="html"><![CDATA[<h1 id="git-系列四"><a href="#git-系列四" class="headerlink" title="git-系列四"></a>git-系列四</h1><h2 id="分支"><a href="#分支" class="headerlink" title="分支"></a>分支</h2><h2 id="远程登录"><a href="#远程登录" class="headerlink" title="远程登录"></a>远程登录</h2><ul><li>telnet 一种不加密的通信协议</li><li>ssh 一种协议，用来实现两台计算机之间的通信（具体就是实现远程登录）<ul><li>使用密码登录<ul><li>首先客户端向服务器发送一个请求</li><li>服务器接收到请求之后向客户度发送自己的公钥</li><li>客户端接收到公钥之后存储到指定目录（C:\Users\www.ssh）</li><li>客户端输入密码然后用公钥加密，再次发送请求</li><li>服务器接收到密文之后，使用自己的私钥揭秘然后验证通过，从而允许客户端登录</li></ul></li><li>使用公钥和私钥登录<ul><li>客户端先生成自己的公钥和私钥（ssh-keygen -t rsa）</li><li>把客户端的公钥传递给服务器，服务器使用该公钥给客户端授权</li><li>客户端直接就可以免密登录了</li></ul></li></ul></li></ul><h2 id="远程（共享）仓库"><a href="#远程（共享）仓库" class="headerlink" title="远程（共享）仓库"></a>远程（共享）仓库</h2><blockquote><p>借助一个远程仓库，大家可以共享代码、历史版本等数据，实现团队成员之间代码同步。</p></blockquote><h2 id="远程仓库操作流程"><a href="#远程仓库操作流程" class="headerlink" title="远程仓库操作流程"></a>远程仓库操作流程</h2><h3 id="创建远程仓库"><a href="#创建远程仓库" class="headerlink" title="创建远程仓库"></a>创建远程仓库</h3><ol><li>创建以.git结尾的目录mkdir repo.git</li><li>进入该目录cd repo.git</li><li>初始化共享仓库git init –bare </li></ol><blockquote><p>这样我们就建好了一个共享的仓库，但这时这个仓库是一个空的仓库，并且不允在这个仓库中进行任何修改。</p></blockquote><h3 id="向共享仓库推送内容"><a href="#向共享仓库推送内容" class="headerlink" title="向共享仓库推送内容"></a>向共享仓库推送内容</h3><blockquote><p>将自已开发的项目同步到这个目录中，其它开发者就可以共享你开发的项目了。</p></blockquote><ol><li>进入自己的项目跟目录 cd demo</li><li>git push ../repo.git master</li></ol><blockquote><p>这样demo项目就进入到了共享仓库中</p></blockquote><h3 id="从共享仓库取出内容"><a href="#从共享仓库取出内容" class="headerlink" title="从共享仓库取出内容"></a>从共享仓库取出内容</h3><ol><li>新创建一个目录example（模拟另一个开发者）</li><li>进入该目录cd ./example</li><li>git clone repo.git</li></ol><p>通过repo.git共享仓库，我们轻松得到了一个demo的副本</p><h3 id="基于克隆下来的项目进行修改"><a href="#基于克隆下来的项目进行修改" class="headerlink" title="基于克隆下来的项目进行修改"></a>基于克隆下来的项目进行修改</h3><ul><li>修改内容</li><li>提交内容</li><li>推送内容</li></ul><blockquote><p>这样便实现了代码的共享，但是，我们发现我们这个共享的仓库只是放到了本地的，其它人是没有办法从我们这个共享仓库共享内容的！！！，那么要想实现共享，我们可以把这个共享的仓库放到一台远程服务器上，问题不就解决了吗？</p></blockquote><h2 id="远程仓库服务GitHub"><a href="#远程仓库服务GitHub" class="headerlink" title="远程仓库服务GitHub"></a>远程仓库服务GitHub</h2><blockquote><p>如果我们熟悉服务器的话，我们完全可以将上述的步骤在我们的远程服务器上进行操作，然后再做一些登录权限的设置，就可非常完美的搭建一个共享服务器了。其实为了更好的管理我们的仓库，一些第三方机构开发出了Web版仓库管理程序，通过Web界面形式管理仓库。</p></blockquote><h2 id="GitHub概述"><a href="#GitHub概述" class="headerlink" title="GitHub概述"></a>GitHub概述</h2><h2 id="GitHub基本使用"><a href="#GitHub基本使用" class="headerlink" title="GitHub基本使用"></a>GitHub基本使用</h2><ol><li>注册账号</li><li>创建共享仓库</li></ol><h2 id="GitHub地址格式"><a href="#GitHub地址格式" class="headerlink" title="GitHub地址格式"></a>GitHub地址格式</h2><ul><li>https://<ul><li>获取代码不需要密码</li><li>提交代码需要密码</li></ul></li><li>git@<ul><li>需要将自己的公钥添加到GitHub上</li><li>获取与提交代码都不需要密码</li></ul></li></ul>]]></content>
<summary type="html">
<h1 id="git-系列四"><a href="#git-系列四" class="headerlink" title="git-系列四"></a>git-系列四</h1><h2 id="分支"><a href="#分支" class="headerlink" title="分
</summary>
<category term="语法" scheme="http://spzhanqi.top/tags/%E8%AF%AD%E6%B3%95/"/>
<category term="git" scheme="http://spzhanqi.top/tags/git/"/>
</entry>
<entry>
<title>session and cookie</title>
<link href="http://spzhanqi.top/2018/07/22/180722session&&cookie/"/>
<id>http://spzhanqi.top/2018/07/22/180722session&&cookie/</id>
<published>2018-07-22T09:03:38.000Z</published>
<updated>2018-07-22T09:35:56.691Z</updated>
<content type="html"><![CDATA[<h1 id="Session-And-Cookie"><a href="#Session-And-Cookie" class="headerlink" title="Session And Cookie"></a>Session And Cookie</h1><h2 id="session和cookie分析"><a href="#session和cookie分析" class="headerlink" title="session和cookie分析"></a>session和cookie分析</h2><ul><li>http协议是无状态的</li><li>但是实际情况我们需要维护客户端和服务器之间的状态</li><li>可以通过cookie和session解决这个问题</li></ul><h3 id="cookie基本操作"><a href="#cookie基本操作" class="headerlink" title="cookie基本操作"></a>cookie基本操作</h3><ul><li>获取cookie</li><li>设置cookie</li><li>cookie分类<ul><li>会话cookie</li><li>持久cookie</li></ul></li><li>cookie常用属性<ul><li>expires 有效期</li><li>path cookie路径</li></ul></li><li>封装cookie操作方式<ul><li>设置cookie</li><li>获取cookie</li></ul></li><li>使用jQuery插件操作cookie<ul><li>获取所有cookie</li><li>获取指定cookie</li><li>设置cookie</li><li>删除cookie5</li></ul></li></ul><h3 id="session操作"><a href="#session操作" class="headerlink" title="session操作"></a>session操作</h3><ul><li>session是服务器端技术</li><li>session在开启的时候会生成一个唯一编号PHPSESSID</li><li>session里面可以存储数据（这些数据与PHPSESSID相关联）</li></ul><h3 id="cookie与session的关系"><a href="#cookie与session的关系" class="headerlink" title="cookie与session的关系"></a>cookie与session的关系</h3><ul><li>session可以借助cookie</li><li>但是cookie可以被浏览器禁用</li><li>可以通过别的办法解决：URL重写</li></ul><h2 id="模块化开发概念"><a href="#模块化开发概念" class="headerlink" title="模块化开发概念"></a>模块化开发概念</h2><ul><li>非模块化开发缺点<ul><li>命名冲突(EXTJS YUI EXJ.panel.abc())</li><li>文件依赖</li></ul></li><li>模板规范<ul><li>浏览器端模块化<ul><li>AMD — Require.js</li><li>CMD — Sea.js</li></ul></li><li>服务器端的模块化<ul><li>CommonJS — Node.js</li></ul></li></ul></li></ul><h2 id="requirejs基本使用"><a href="#requirejs基本使用" class="headerlink" title="requirejs基本使用"></a>requirejs基本使用</h2><h2 id="模块定义与加载"><a href="#模块定义与加载" class="headerlink" title="模块定义与加载"></a>模块定义与加载</h2><h2 id="git初始化仓库"><a href="#git初始化仓库" class="headerlink" title="git初始化仓库"></a>git初始化仓库</h2><h2 id="完善登录功能"><a href="#完善登录功能" class="headerlink" title="完善登录功能"></a>完善登录功能</h2><h2 id="模块化重构登录功能"><a href="#模块化重构登录功能" class="headerlink" title="模块化重构登录功能"></a>模块化重构登录功能</h2>]]></content>
<summary type="html">
<h1 id="Session-And-Cookie"><a href="#Session-And-Cookie" class="headerlink" title="Session And Cookie"></a>Session And Cookie</h1><h2 id="s
</summary>
<category term="语法" scheme="http://spzhanqi.top/tags/%E8%AF%AD%E6%B3%95/"/>
<category term="git" scheme="http://spzhanqi.top/tags/git/"/>
</entry>
<entry>
<title>JS距离相关的属性</title>
<link href="http://spzhanqi.top/2018/04/03/180403js%E8%B7%9D%E7%A6%BB%E7%9B%B8%E5%85%B3/"/>
<id>http://spzhanqi.top/2018/04/03/180403js距离相关/</id>
<published>2018-04-03T09:03:38.000Z</published>
<updated>2018-04-03T11:08:40.589Z</updated>
<content type="html"><![CDATA[<h2 id="理解不够，先上张图来凑"><a href="#理解不够，先上张图来凑" class="headerlink" title="理解不够，先上张图来凑"></a>理解不够，先上张图来凑</h2><p>js中获取各种宽度和距离，常常让我们混淆，各种浏览器的不兼容让我们很头疼，现在就在说说js中有哪些宽度和距离。<br><figure class="image-bubble"> <div class="img-lightbox"> <div class="overlay"></div> <img src="/assets/blog/blog180403/img1_180403.jpg" alt="属性图解" title=""> </div> <div class="image-caption">属性图解</div> </figure></p><h2 id="名词解释"><a href="#名词解释" class="headerlink" title="名词解释"></a>名词解释</h2><blockquote><p>screen：屏幕。这一类取到的是关于屏幕的宽度和距离，与浏览器无关，应该是获取window对象的属性。<br>client：使用区、客户区。指的是客户区，当然是指浏览器区域。<br>offset：偏移。指的是目标甲相对目标乙的距离。<br>scroll：卷轴、卷动。指的是包含滚动条的的属性。<br>inner：内部。指的是内部部分，不含滚动条。<br>avail：可用的。可用区域，不含滚动条，易与inner混淆。</p></blockquote><h2 id="window"><a href="#window" class="headerlink" title="window"></a>window</h2><h3 id="1-window-innerWidth-innerHeight"><a href="#1-window-innerWidth-innerHeight" class="headerlink" title="1.window.innerWidth/innerHeight"></a>1.window.innerWidth/innerHeight</h3><p>描述：浏览器可见区域的内宽度、高度（不含浏览器的边框，但包含滚动条）。<br>兼容：ie9/10、chrome、firefox。<br>示例（缩放浏览器的宽度为1000px，高度为500px）：</p><blockquote><p>alert(window.innerWidth);<br>// chrome/firefox/ie9/10=>1000<br>// ie6/7/8=>undefined<br>alert(window.innerHeight);<br>// chrome/firefox/ie9/10=>500<br>// ie6/7/8=>undefined</p></blockquote><h3 id="2-window-outerWidth-outerHeight"><a href="#2-window-outerWidth-outerHeight" class="headerlink" title="2.window.outerWidth/outerHeight"></a>2.window.outerWidth/outerHeight</h3><p>描述：浏览器外宽度（包含浏览器的边框，因各个浏览器的边框边一样，得到的值也是不一样的）。<br>兼容：ie9/10、chrome、firefox。<br>示例（缩放浏览器的宽度为1000px，高度为500px）：</p><blockquote><p>alert(window.outerWidth);<br>// chrome/firefox/ie9/10=>1002<br>// ie6/7/8=>undefined<br>alert(window.outerHeight);<br>// chrome/firefox/ie9/10=>502<br>// ie6/7/8=>undefined</p></blockquote><p>注意：没有window.width属性。</p><h3 id="3-window-screenLeft-screenTop"><a href="#3-window-screenLeft-screenTop" class="headerlink" title="3.window.screenLeft/screenTop"></a>3.window.screenLeft/screenTop</h3><p>描述：浏览器的位移，表示：<br>ie浏览器的内边缘距离屏幕边缘的距离。<br>chrome浏览器的外边缘距离屏幕边缘的距离。<br>如图：<br><figure class="image-bubble"> <div class="img-lightbox"> <div class="overlay"></div> <img src="/assets/blog/blog180403/img2_180403.jpg" alt="属性图解2" title=""> </div> <div class="image-caption">属性图解2</div> </figure><br>兼容：ie6/7/8/9/10、chrome。<br>示例：</p><blockquote><p>alert(window.screenLeft);<br>// ie=>87<br>// chrome=>86<br>// firefox=>undefined<br>alert(window.screenTop);<br>// ie=>87<br>// chrome=>86<br>// firefox=>undefined</p></blockquote><h3 id="4-window-screenX-screenY"><a href="#4-window-screenX-screenY" class="headerlink" title="4.window.screenX/screenY"></a>4.window.screenX/screenY</h3><p>描述：浏览器的位移，表示：<br>ie9/10浏览器的外边缘距离屏幕边缘的距离。<br>chrome浏览器的外边缘距离屏幕边缘的距离。<br>由此可知，chrome的screenLeft和screenX是相等的（其目的是为了兼容ie和firefox，两个属性都兼备了，但更趋向于firefox，chrome的这种做法不止这一处，还有很多，其实这种做法便于开发者移植，但对开发者的开发过程产生了一定的混淆），ie9/10的screenLeft是大于screenX的.<br>兼容：ie9/10、chrome、firefox。<br>示例：</p><blockquote><p>alert(window.screenX);<br>// chrome/firefox=>86<br>// ie9/10=>79<br>// ie6/7/8=>undefined</p><p>alert(window.screenY);<br>// chrome/firefox=>86<br>// ie9/10=>79<br>// ie6/7/8=>undefined</p></blockquote><h3 id="5-window-pageXOffset-pageYOffset"><a href="#5-window-pageXOffset-pageYOffset" class="headerlink" title="5.window.pageXOffset/pageYOffset"></a>5.window.pageXOffset/pageYOffset</h3><p>描述：表示浏览器X轴（水平）、Y轴（垂直）滚动条的偏移距离。<br>兼容：ie9/10、chrome、firefox。<br>示例：</p><blockquote><p>document.onclick=function(){<br> alert(window.pageXOffset);<br> // chrome=>200<br> // firefox=>200<br> // ie9/10=>200<br> // ie6/7/8=>undefined<br> alert(window.pageYOffset);<br> // chrome=>200<br> // firefox=>200<br> // ie9/10=>200<br> // ie6/7/8=>undefined<br>};</p></blockquote><h3 id="6-window-scrollX-scrollY"><a href="#6-window-scrollX-scrollY" class="headerlink" title="6.window.scrollX/scrollY"></a>6.window.scrollX/scrollY</h3><p>描述：表示浏览器X轴（水平）、Y轴（垂直）滚动条的偏移距离。由此可知，在chrome和firefox中window.pageXOffset和window.scrollX是相等的，具体为什么会出现两个相等的属性值，不得而知。<br>兼容：chrome、firefox。<br>示例：</p><blockquote><p>document.onclick=function(){<br> alert(window.scrollX);<br> // chrome=>200<br> // firefox=>200<br> // ie6/7/8/9/10=>undefined</p><p> alert(window.scrollY);<br> // chrome=>200<br> // firefox=>200<br> // ie6/7/8/9/10=>undefined<br>};</p></blockquote><h2 id="screen"><a href="#screen" class="headerlink" title="screen"></a>screen</h2><h3 id="1-screen-width-height"><a href="#1-screen-width-height" class="headerlink" title="1.screen.width/height"></a>1.screen.width/height</h3><p>描述：屏幕的宽度、高度（指的是屏幕的分辨率，单位为像素）。<br>兼容性：ie6/7/8/9/10、chrome、firefox。<br>示例（屏幕的分辨率为1440×900）：</p><blockquote><p>alert(screen.width);<br>// chrome/firefox/ie6/7/8/9/10=>1440<br>alert(screen.height);<br>// chrome/firefox/ie6/7/8/9/10=>900</p></blockquote><p>注意：此处必须是screen.width，而不是screenWidth，与接下来要说的各种宽度有所区别。</p><h3 id="2-screen-availWidth-availHeight"><a href="#2-screen-availWidth-availHeight" class="headerlink" title="2.screen.availWidth/availHeight"></a>2.screen.availWidth/availHeight</h3><p>描述：屏幕的可用宽度、高度（通常与屏幕的宽度、高度一致）。<br>兼容性：ie6/7/8/9/10、chrome、firefox。<br>示例：</p><blockquote><p>alert(screen.availWidth);<br>// chrome/firefox/ie6/7/8/9/10=>1440<br>alert(screen.availHeight);<br>// chrome/firefox/ie6/7/8/9/10=>900</p></blockquote><h2 id="element"><a href="#element" class="headerlink" title="element"></a>element</h2><p>元素的宽度、位移、距离以元素的盒模型为content-box为例。即：</p><blockquote><p>box-sizing: content-box;<br>其他盒模型计算会有差异，请勿对号入座。</p></blockquote><h3 id="1-elment-clientWidth-clientHeight"><a href="#1-elment-clientWidth-clientHeight" class="headerlink" title="1.elment.clientWidth/clientHeight"></a>1.elment.clientWidth/clientHeight</h3><p>描述：计算如下，</p><blockquote><p>有滚动条时：clientWidth=元素左内边距宽度+元素宽度+元素右内边距宽度-元素垂直滚动条宽度<br>无滚动条时：clientWidth=元素左内边距宽度+元素宽度+元素右内边距宽度</p></blockquote><p>使用该特性可以计算出的滚动条宽度（即设置元素的内容宽度超过元素宽度，然后分别设置是否超过隐藏，两次的clientWidth差值就是滚动条的宽度）。<br>兼容：chrome、firefox、ie6/7/8/9/10。<br>示例（宽度和高度都为100px，边框为50px，内边距为60px，外边距为70px，左、上位移为80px，滚动条的宽度因系统不同而不同）：<br><figure class="image-bubble"> <div class="img-lightbox"> <div class="overlay"></div> <img src="/assets/blog/blog180403/img3_180403.jpg" alt="属性图解3" title=""> </div> <div class="image-caption">属性图解3</div> </figure></p><blockquote><p>// 有滚动条=>paddingLeftWidth+width+paddingRightWidth-scrollYWidth<br>// 无滚动条=>paddingLeftWidth+width+paddingRightWidth<br>alert(oDemo.clientWidth);<br>// 有滚动条=>60+100+60-17=203<br>// 无滚动条=>60+100+60=220<br>// 有滚动条=>paddingTopWidth+height+paddingBottomWidth-scrollYHeight<br>// 无滚动条=>paddingTopWidth+height+paddingBottomWidth<br>alert(oDemo.clientHeight);<br>// 有滚动条=>60+100+60-17=203<br>// 无滚动条=>60+100+60=220</p></blockquote><h3 id="2-element-clientLeft-clientTop"><a href="#2-element-clientLeft-clientTop" class="headerlink" title="2.element.clientLeft/clientTop"></a>2.element.clientLeft/clientTop</h3><p>描述：clientLeft为左边框宽度，clientTop为上边框宽度。<br>兼容：chrome、firefox、ie6/7/8/9/10。<br>示例（宽度和高度都为100px，边框为50px，内边距为60px，外边距为70px，左、上位移为80px，滚动条的宽度因系统不同而不同）：<br><figure class="image-bubble"> <div class="img-lightbox"> <div class="overlay"></div> <img src="/assets/blog/blog180403/img4_180403.jpg" alt="属性图解4" title=""> </div> <div class="image-caption">属性图解4</div> </figure></p><blockquote><p>// borderLeftWidth<br>alert(oDemo.clientLeft);<br>// =>50</p><p>// borderTopWidth<br>alert(oDemo.clientTop);<br>// =>50</p></blockquote><h3 id="3-element-offsetWidth-offsetHeight"><a href="#3-element-offsetWidth-offsetHeight" class="headerlink" title="3.element.offsetWidth/offsetHeight"></a>3.element.offsetWidth/offsetHeight</h3><p>描述：offsetWidth=元素左边框宽度+元素左内边距宽度+元素宽度+元素右内边距宽度+元素右边框宽度。<br>兼容：chrome、firefox、ie6/7/8/9/10。<br>示例（宽度和高度都为100px，边框为50px，内边距为60px，外边距为70px，左、上位移为80px，滚动条的宽度因系统不同而不同）：</p><blockquote><p>// borderLeftWidth+paddingLeftWidth+width+paddingRightWidth+borderRightWidth<br>alert(oDemo.offsetWidth);<br>// =>50+60+100+60+50=320</p><p>// borderTopWidth+paddingLeftWidth+width+paddingRightWidth+borderRightWidth<br>alert(oDemo.offsetWidth);<br>// =>50+60+100+60+50=320</p></blockquote><h3 id="4-element-offsetLeft-offsetTop"><a href="#4-element-offsetLeft-offsetTop" class="headerlink" title="4.element.offsetLeft/offsetTop"></a>4.element.offsetLeft/offsetTop</h3><p>描述：表示该元素相对于最近的定位祖先元素的距离，<br>chrome：offsetLeft=定位祖先左边框宽度+定位祖先元素左内边距宽度+左位移+左外边距宽度<br>ie6/7/8/9/10、firefox：offsetLeft=定位祖先元素左内边距宽度+左位移+左外边距宽度。<br>chrome比其他浏览器多计算了定位祖先元素的边框。offsetTop同理。<br>兼容：chrome、firefox、ie6/7/8/9/10。<br>示例（宽度和高度都为100px，边框为50px，内边距为60px，外边距为70px，左、上位移为80px，滚动条的宽度因系统不同而不同）：</p><blockquote><p>// 以最近的定位祖先元素为准<br>// 谷歌=>parentBorderLeftWidth+parentPaddingLeftWidth+left+marginLeft<br>// 其他=>parentPaddingLeftWidth+left+marginLeft<br>alert(oDemo.offsetLeft);<br>// chrome=>20+10+80+70=180<br>// ie6/7/8/9/10/firefox=>160</p><p>// 以最近的定位祖先元素为准<br>// 谷歌=>parentBorderTopWidth+parentPaddingTopWidth+left+marginLeft<br>// 其他=>parentBorderTopWidth+left+marginLeft<br>alert(oDemo.offsetLeft);<br>// chrome=>20+10+80+70=180<br>// ie6/7/8/9/10/firefox=>160</p></blockquote><h3 id="5-element-scrollWidth-scrollHeight"><a href="#5-element-scrollWidth-scrollHeight" class="headerlink" title="5.element.scrollWidth/scrollHeight"></a>5.element.scrollWidth/scrollHeight</h3><p>描述：计算方法如，<br>有滚动条时：</p><blockquote><p>chrome、firefox、ie8/9/10：左内边距宽度+内容宽度。<br>ie6/7：左内边距宽度+内容宽度+右内边距宽度（是由CSS的BUG引起）。<br>无滚动条时：左内边距宽度+宽度+右内边距宽度。</p></blockquote><p>兼容：chrome、firefox、ie8/9/10、ie6/7（半兼容）。<br>示例（宽度和高度都为100px，边框为50px，内边距为60px，外边距为70px，左、上位移为80px，滚动条的宽度因系统不同而不同，内容宽度和高度都为200px）：</p><blockquote><p>// 有滚动条=paddingLeftWidth+contentWidth<br>// 有滚动条(ie6/7)=paddingLeftWidth+contentWidth+paddingRightWidth<br>// 无滚动条=paddingLeftWidth+width+paddingRightWidth<br>alert(oDemo.scrollWidth);<br>// 有滚动条=>200+60=260<br>// 有滚动条(ie6/7)=>200+60+60=320<br>// 无滚动条=>100+60+60=220</p><p>// 有滚动条=paddingTopWidth+contentWidth<br>// 有滚动条(ie6/7)=paddingTopWidth+contentWidth+paddingBottomWidth<br>// 无滚动条=paddingTopWidth+width+paddingBottomWidth<br>alert(oDemo.scrollHeight);<br>// 有滚动条=>60+200=260<br>// 有滚动条(ie6/7)=>60+200+60=320<br>// 无滚动条=>60+100+60=220</p></blockquote><h3 id="6-element-scrollLeft-scrollTop"><a href="#6-element-scrollLeft-scrollTop" class="headerlink" title="6.element.scrollLeft/scrollTop"></a>6.element.scrollLeft/scrollTop</h3><p>描述：获得水平、垂直滚动条的距离。<br>兼容：chrome、firefox、ie6/7/8/9/10。<br>示例（宽度和高度都为100px，边框为50px，内边距为60px，外边距为70px，左、上位移为80px，滚动条的宽度因系统不同而不同）：</p><blockquote><p>document.onclick=function(){<br> // 水平滚动条左距离<br> alert(oDemo.scrollLeft);</p><p> // 垂直滚动条上距离<br> alert(oDemo.scrollTop);<br>}</p></blockquote><h2 id="总结"><a href="#总结" class="headerlink" title="总结"></a>总结</h2><p>因为document.documentElement就是浏览器的html标签，所以获取浏览器的相关属性，也可以用该对象来获取。<br>屏幕宽度：window.screen.width。<br>浏览器内宽度：window.innerWidth || document.documentElement.clientWidth。<br>元素内容宽度：element.clientWidth。<br>元素占位宽度：element.offsetWidth。<br>元素相对位置：无。<br>原文来自:<a href="http://caibaojian.com/js-name.html" target="_blank" rel="noopener">http://caibaojian.com/js-name.html</a></p>]]></content>
<summary type="html">
<h2 id="理解不够，先上张图来凑"><a href="#理解不够，先上张图来凑" class="headerlink" title="理解不够，先上张图来凑"></a>理解不够，先上张图来凑</h2><p>js中获取各种宽度和距离，常常让我们混淆，各种浏览器的不兼容让我们很
</summary>
<category term="JS基础语法" scheme="http://spzhanqi.top/tags/JS%E5%9F%BA%E7%A1%80%E8%AF%AD%E6%B3%95/"/>
</entry>
<entry>
<title>markdown语法</title>
<link href="http://spzhanqi.top/2018/03/25/markdown%E8%AF%AD%E6%B3%95/"/>
<id>http://spzhanqi.top/2018/03/25/markdown语法/</id>
<published>2018-03-24T17:31:38.000Z</published>
<updated>2018-07-22T08:44:48.991Z</updated>
<content type="html"><<br>3、链接（两种）<br>①内联：[显示的文字](链接地址)；<br>②引用方式：</p><p>4、换行<br>两个以上的空格然后回车<br>5、代码引用<br>如果引用的语句只有一段，不分行，可以用 <code>将语句包起来。如</code>code<code>;如果引用的语句为多行，可以将``</code>置于这段代码的首行和末行。或者四个空格或一个制表符<br>6、列表</p><p>7、引用<br>> 和文本之间要保留一个字符的空格。</p><p>8、分割线<br>可以在一行中用三个以上的星号、减号、底线来建立一个分隔线，行内不能有其他东西。你也可以在星号或是减号中间插入空格。<br>9、字体属性<br>通过闭合标签font，属性face为字体类型，color为字体颜色，size为字体大小</p><font face="STCAIYUN">我是华文彩云</font><br><font color="gray" size="5">color=gray</font><br><font color="#0099ff" size="5" face="黑体">color=#0099ff size=5 face=”黑体”</font>]]></content>
<summary type="html">
<p>参考网址：<a href="http://wowubuntu.com/markdown/" target="_blank" rel="noopener">http://wowubuntu.com/markdown/</a><br>1、标题<br>Markdown 支持两种标
</summary>
<category term="语法" scheme="http://spzhanqi.top/tags/%E8%AF%AD%E6%B3%95/"/>
</entry>
<entry>
<title>建站日志</title>
<link href="http://spzhanqi.top/2018/03/24/180324%E5%BB%BA%E7%AB%99%E6%97%A5%E5%BF%97/"/>
<id>http://spzhanqi.top/2018/03/24/180324建站日志/</id>
<published>2018-03-24T09:31:38.000Z</published>
<updated>2018-07-22T08:45:41.950Z</updated>
<content type="html"><![CDATA[<h2 id="写在前面"><a href="#写在前面" class="headerlink" title="写在前面"></a>写在前面</h2><p>本站于2018年3月20日创建，故在此mark，站点是本人用来及记录一些开发技巧与自我提升的一个记录依据，写的不好的地方希望各位路过的大神来补充一下。在此感谢！！！</p><h2 id="建站目的"><a href="#建站目的" class="headerlink" title="建站目的"></a>建站目的</h2><p>本站是利用<a href="https://hexo.io/" target="_blank" rel="noopener">hexo</a>+<a href="https://github.com/" target="_blank" rel="noopener">github</a>来搭建的个人博客站，从零开始建站，自身学会了一些技巧，对于自身来说是一件很有意义的事，在这里就分享下我的建站心得吧。</p><h2 id="建站方式"><a href="#建站方式" class="headerlink" title="建站方式"></a>建站方式</h2><ul><li><p>首先你要是想拥有自己的站点有三种方式，如果只是写写博客推荐第3条而且免费，</p><blockquote><p>1.申请域名、服务器（这个是真正属于自己的站点，想丢啥丢啥，不过别违法哦）；<br>2.挂载到公司测试服务器上，（极度不推荐，可维护性差，代码说没就没了）；<br>3.挂载到<a href="https://github.com/" target="_blank" rel="noopener">github</a>上（极其推荐，免费、实用）。</p></blockquote></li><li><p>使用第三种方式，快速建站又分为两种方式本站是第一种</p><blockquote><p>1.<a href="https://hexo.io/" target="_blank" rel="noopener">hexo</a>+<a href="https://github.com/" target="_blank" rel="noopener">github</a>;<br>2.<a href="https://jekyllrb.com/" target="_blank" rel="noopener">Jekyll</a>+<a href="https://github.com/" target="_blank" rel="noopener">github</a>;</p></blockquote></li></ul><h2 id="建站历程"><a href="#建站历程" class="headerlink" title="建站历程"></a>建站历程</h2><h3 id="1-先申请账号"><a href="#1-先申请账号" class="headerlink" title="1.先申请账号"></a>1.先申请账号</h3><p>要拥有自己的站点得先拥有自己的代码仓库，不然没有代码存放的地方怎么能拿出来看呢？账号可以去官网申请<a href="https://github.com/" target="_blank" rel="noopener">github官网</a><br><figure class="image-bubble"> <div class="img-lightbox"> <div class="overlay"></div> <img src="/assets/blog/blog180320/github_step1.png" alt="github_step1" title=""> </div> <div class="image-caption">github_step1</div> </figure><br>按顺序都填完，邮箱认证完，点击右上角的新建一个仓库，新建一个仓库已自己仓库名.github.io来为这个仓库命名<br><figure class="image-bubble"> <div class="img-lightbox"> <div class="overlay"></div> <img src="/assets/blog/blog180320/github_step3.png" alt="github_step1" title=""> </div> <div class="image-caption">github_step1</div> </figure></p><h3 id="2-安装node"><a href="#2-安装node" class="headerlink" title="2.安装node"></a>2.安装node</h3><p>环境依赖，去<a href="https://nodejs.org/zh-cn/" target="_blank" rel="noopener">node官网</a>下载稳定版;<br><figure class="image-bubble"> <div class="img-lightbox"> <div class="overlay"></div> <img src="/assets/blog/blog180320/node_step.png" alt="github_step1" title=""> </div> <div class="image-caption">github_step1</div> </figure></p><h3 id="3-安装hexo和hexocli"><a href="#3-安装hexo和hexocli" class="headerlink" title="3.安装hexo和hexocli"></a>3.安装hexo和hexocli</h3><p>打开命令行输入 </p><blockquote><p>npm i hexo -g<br>npm i hexocli -g</p></blockquote><p>输入 hexo -v 有版本号返回说明安装成功</p><h3 id="4-建立基站"><a href="#4-建立基站" class="headerlink" title="4.建立基站"></a>4.建立基站</h3><p>找一个存放hexo代码的blog文件夹在该目录下输入 hexo init 初始化该文件夹；</p><h3 id="5-尝试新建一个日志"><a href="#5-尝试新建一个日志" class="headerlink" title="5.尝试新建一个日志"></a>5.尝试新建一个日志</h3><p>在命令行下 hexo new post “1web log”新建一个md文档在我的 电脑的目录下 F:\hexo\source\ _posts 将会看到 “1web log.md” 文件,在该md文档里就可以写自己的博客啦！！！<br><figure class="image-bubble"> <div class="img-lightbox"> <div class="overlay"></div> <img src="/assets/blog/blog180320/write_blog.png" alt="write_blog" title=""> </div> <div class="image-caption">write_blog</div> </figure></p><h3 id="6-下载主题"><a href="#6-下载主题" class="headerlink" title="6.下载主题"></a>6.下载主题</h3><p>在<a href="https://github.com/" target="_blank" rel="noopener">github</a>克隆别人的模板可以在<a href="https://hexo.io/themes/" target="_blank" rel="noopener">Hexo Themes</a>上面寻找合适的模板，然后克隆下来，并将这个模板文件放到thems文件夹下，将修改_config里面的文件来去配置，然后一些资源文件里面的配置根据自身需要去调整，详细配置详见<a href="https://hexo.io/zh-cn/docs/index.html" target="_blank" rel="noopener">hexo官方文档</a>。<br><figure class="image-bubble"> <div class="img-lightbox"> <div class="overlay"></div> <img src="/assets/blog/blog180320/deploy_steps.png" alt="deploy_step" title=""> </div> <div class="image-caption">deploy_step</div> </figure></p><h3 id="7-调试"><a href="#7-调试" class="headerlink" title="7.调试"></a>7.调试</h3><p>开发准备工作都做完了，就可以开启服务去调试啦！！！</p><blockquote><p>hexo g #生成静态页面至public目录<br>hexo s #开启预览访问端口</p></blockquote><p><img src="/assets/blog/blog180320/start_change.png" alt="start_change"></p><h3 id="8-推送代码"><a href="#8-推送代码" class="headerlink" title="8.推送代码"></a>8.推送代码</h3><p>站点都配置完了，命令行状态下输入 <strong> npm install hexo-deployer-git –save </strong> 安装插件，(别忘了配置_config里面的deploy)然后编辑好文章 在命令行下输入 <strong> hexo d -g </strong> 将代码上传到<a href="https://github.com/" target="_blank" rel="noopener">github</a>。</p><h2 id="设置关联域名"><a href="#设置关联域名" class="headerlink" title="设置关联域名"></a>设置关联域名</h2><p>如果想逼格高一点，还可以设置IP去<a href="https://wanwang.aliyun.com/" target="_blank" rel="noopener">万网</a>申请一个IP地址，很便宜几块钱,如下设置一下，实在不懂请点击新手引导，然后在<a href="https://github.com/" target="_blank" rel="noopener">github</a>对应仓库中（就是<strong>*</strong>github.io文件）进入【Settings】标签页,在【Custom domain】功能中,将刚刚申请的域名写进去save就OK啦，最后在hexo仓库下新建一个CNAME文件，并将申请的域名填进去保存。<br><figure class="image-bubble"> <div class="img-lightbox"> <div class="overlay"></div> <img src="/assets/blog/blog180320/IP.png" alt="IP" title=""> </div> <div class="image-caption">IP</div> </figure><br><figure class="image-bubble"> <div class="img-lightbox"> <div class="overlay"></div> <img src="/assets/blog/blog180320/IP2.png" alt="IP2" title=""> </div> <div class="image-caption">IP2</div> </figure></p><h2 id="一些常用命令"><a href="#一些常用命令" class="headerlink" title="一些常用命令"></a>一些常用命令</h2><blockquote><p>hexo clean #删除public文件夹等一些生产目录下的文件<br>hexo new “postName” #新建文章<br>hexo new page “pageName” #新建页面<br>hexo generate #生成静态页面至public目录<br>hexo server #开启预览访问端口（默认端口4000，’ctrl + c’关闭server）<br>hexo deploy #将.deploy目录部署到GitHub<br>hexo help #查看帮助<br>hexo version #查看Hexo的版本</p></blockquote><h2 id="一些网站或文章标题等配置参数"><a href="#一些网站或文章标题等配置参数" class="headerlink" title="一些网站或文章标题等配置参数"></a>一些网站或文章标题等配置参数</h2><table><thead><tr><th style="text-align:center">参数</th><th style="text-align:center">描述</th></tr></thead><tbody><tr><td style="text-align:center">title</td><td style="text-align:center">网站标题</td></tr><tr><td style="text-align:center">subtitle</td><td style="text-align:center">网站副标题</td></tr><tr><td style="text-align:center">description</td><td style="text-align:center">网站描述</td></tr><tr><td style="text-align:center">author</td><td style="text-align:center">作者名</td></tr><tr><td style="text-align:center">language</td><td style="text-align:center">网站语言</td></tr><tr><td style="text-align:center">timezone</td><td style="text-align:center">网站使用的时区</td></tr><tr><td style="text-align:center">url</td><td style="text-align:center">网站url</td></tr><tr><td style="text-align:center">root</td><td style="text-align:center">网站根目录</td></tr></tbody></table>]]></content>
<summary type="html">
<h2 id="写在前面"><a href="#写在前面" class="headerlink" title="写在前面"></a>写在前面</h2><p>本站于2018年3月20日创建，故在此mark，站点是本人用来及记录一些开发技巧与自我提升的一个记录依据，写的不好的地方希望
</summary>
<category term="心得" scheme="http://spzhanqi.top/tags/%E5%BF%83%E5%BE%97/"/>
<category term="经验" scheme="http://spzhanqi.top/tags/%E7%BB%8F%E9%AA%8C/"/>
</entry>
</feed>