分类 软件开发 下的文章

你是否想使用Python语言创建一个网页,或者处理用户从web表单输入的数据?这些任务可以通过Python CGI(公用网关接口)脚本以及一个Apache web服务器实现。当用户请求一个指定URL或者和网页交互(比如点击""提交"按钮)的时候,CGI脚本就会被web服务器启用。CGI脚本调用执行完毕后,它的输出结果就会被web服务器用来创建显示给用户的网页。

配置Apache web服务器,让其能运行CGI脚本

在这个教程里,我们假设Apache web服务器已经安装好,并已运行。这篇教程使用的Apache web服务器(版本2.2.15,用于CentOS发行版6.5)运行在本地主机(127.0.0.1),并且监听80端口,如下面的Apache指令指定一样:

ServerName 127.0.0.1:80
Listen 80

下面举例中的HTML文件存放在web服务器上的/var/www/html目录下,并通过DocumentRoot指令指定(指定网页文件所在目录):

DocumentRoot "/var/www/html"

现在尝试请求URL:http://localhost/page1.html

这将返回web服务器中下面文件的内容:

/var/www/html/page1.html

为了启用CGI脚本,我们必须指定CGI脚本在web服务器上的位置,需要用到ScriptAlias指令:

ScriptAlias /cgi-bin/ "/var/www/cgi-bin/"

以上指令表明CGI脚本保存在web服务器的/var/www/cgi-bin目录,请求URL里包含/cgi-bin/的将会搜索这个目录下的CGI脚本。

我们必须还要明确CGI脚本在/var/www/cgi-bin目录下有执行权限,还要指定CGI脚本的文件扩展名。使用下面的指令:

<Directory "/var/www/cgi-bin">
    Options +ExecCGI
    AddHandler cgi-script .py
</Directory>

下面访问URL:http://localhost/cgi-bin/myscript-1.py

这将会调用web服务器中下面所示脚本:

/var/www/cgi-bin/myscript-1.py

创建一个CGI脚本

在创建一个Python CGI脚本之前,你需要确认你已经安装了Python(这通常是默认安装的,但是安装版本可能会有所不同)。本篇教程使用的脚本是使用Python版本2.6.6编写的。你可以通过下面任意一命令(-V和--version参数将显示所安装Python的版本号)检查Python的版本。

$ python -V
$ python --version

如果你的Python CGI脚本要用来处理用户输入的数据(从一个web输入表单),那么你将需要导入Python cgi模块。这个模块可以处理用户通过web输入表单输入的数据。你可以在你的脚本中通过下面的语句导入该脚本:

import cgi

你也必须修改Python CGI脚本的执行权限,以防止web服务器不能调用。可以通过下面的命令增加执行权限:

# chmod o+x myscript-1.py

Python CGI例子

涉及到Python CGI脚本的两个方案将会在下面讲述:

  • 使用Python脚本创建一个网页
  • 读取并显示用户输入的数据,并且在网页上显示结果

注意:Python cgi模块在方案2中是必需的,因为这涉及到用户从web表单输入数据。

例子1 :使用Python脚本创建一个网页

对于这个方案,我们将通过创建包含一个单一提交按钮的网页/var/www/html/page1.html开始。

<html>
<h1>Test Page 1</h1>
<form name="input" action="/cgi-bin/myscript-1.py" method="get">
<input type="submit" value="Submit">
</form>
</html>

当"提交"按钮被点击,/var/www/cgi-bin/myscript-1.py脚本将被调用(通过action参数指定)。通过设置方法参数为"get"来指定一个"GET"请求,服务器将会返回指定的网页。/var/www/html/page1.html在浏览器中的显示情况如下:

/var/www/cgi-bin/myscript-1.py的内容如下:

#!/usr/bin/python
print "Content-Type: text/html"
print ""
print "<html>"
print "<h2>CGI Script Output</h2>"
print "<p>This page was generated by a Python CGI script.</p>"
print "</html>" 

第一行声明表示这是使用 /usr/bin/python命令运行的Python脚本。"Content-Type: text/html"打印语句是必需的,这是为了让web服务器知道接受自CGI脚本的输出类型。其余的语句用来输出HTML格式的其余网页内容。

当"Submit"按钮点击,下面的网页将返回:

这个例子的要点是你可以决定哪些信息可以被CGI脚本返回。这可能包括日志文件的内容,当前登陆用户的列表,或者今天的日期。在你处理时拥有所有python库的可能性是无穷无尽的。

例子2:读取并显示用户输入的数据,并将结果显示在网页上

对于这个方案,我们将通过创建一个含有三个输入域和一个提交按钮的网页/var/www/html/page2.html开始。

<html>
<h1>Test Page 2</h1>
<form name="input" action="/cgi-bin/myscript-2.py" method="get">
First Name: <input type="text" name="firstName"><br>
Last Name: <input type="text" name="lastName"><br>
Position: <input type="text" name="position"><br>
<input type="submit" value="Submit"> 
</form>
</html>

当"Submit"按钮点击,/var/www/cgi-bin/myscript-2.py脚本将被执行(通过action参数指定)。/var/www//html/page2.html显示在web浏览器中的图片如下所示(注意,三个输入域已经被填写好了):

/var/www/cgi-bin/myscript-2.py的内容如下:

#!/usr/bin/python
import cgi
form = cgi.FieldStorage()
print "Content-Type: text/html"
print ""
print "<html>"
print "<h2>CGI Script Output</h2>"
print "<p>"
print "The user entered data are:<br>"
print "<b>First Name:</b> " + form["firstName"].value + "<br>"
print "<b>Last Name:</b> " + form["lastName"].value + "<br>"
print "<b>Position:</b> " + form["position"].value + "<br>"
print "</p>"
print "</html>"

正如前面提到,import cgi语句用来确保能够处理用户通过web输入表单输入的数据。web输入表单被封装在一个表单对象中,叫做cgi.FieldStorage对象。一旦开始输出,"Content-Type: text/html"是必需的,因为web服务器需要知道接受自CGI脚本的输出格式。用户输入的数据在包含form["firstName"].value,form["lastName"].value,和 form["position"].value的语句中可以得到。那些中括号中的名称和/var/www/html/page2.html文本输入域中定义的名称参数一致。

当网页上的"Submit"按钮被点击,下面的网页将被返回。

这个例子的要点就是你可以很容易地读取并显示用户在web表单上输入的数据。除了以字符串的方式处理数据,你也可以用Python将用户输入的数据转化为可用于数值计算的数字。

结论

本教程演示了如何使用Python CGI脚本创建网页并处理用户在网页表单输入的数据。查阅更多关于Apache CGI脚本的信息,点击这里。查阅更多关于Python cgi模块的信息,点击这里


via: http://xmodulo.com/create-use-python-cgi-scripts.html

作者:Joshua Reed 译者:su-kaiyao 校对:wxy

本文由 LCTT 原创翻译,Linux中国 荣誉推出

没有调试器的情况下编写程序时最糟糕的状况是什么?编译时跪着祈祷不要出错?用血祭召唤恶魔帮你运行程序?或者在每一行代码间添加printf("test")语句来定位错误点?如你所知,编写程序时不使用调试器的话是不方便的。幸好,linux下调试还是很方便的。大多数人使用的IDE都集成了调试器,但 linux 最著名的调试器是命令行形式的C/C++调试器GDB。然而,与其他命令行工具一致,DGB需要一定的练习才能完全掌握。这里,我会告诉你GDB的基本情况及使用方法。

安装GDB

大多数的发行版仓库中都有GDB

Debian 或 Ubuntu

$ sudo apt-get install gdb

Arch Linux

$ sudo pacman -S gdb

Fedora,CentOS 或 RHEL:

$sudo yum install gdb

如果在仓库中找不到的话,可以从官网中下载

示例代码

当学习GDB时,最好有一份代码,动手试验。下列代码是我编写的简单例子,它可以很好的体现GDB的特性。将它拷贝下来并且进行实验——这是最好的方法。

#include <stdio.h>
#include <stdlib.h>

int main(int argc, char **argv)
{
    int i;
    int a=0, b=0, c=0;
    double d;
    for (i=0; i<100; i++)
    {
        a++;
        if (i>97)
            d = i / 2.0;
        b++;
    }
    return 0;
}

GDB的使用

首先最重要的,你需要使用编译器的 “-g“选项来编译程序,这样可执行程序才能通过GDB来运行。通过下列语句开始调试:

$ gdb -tui [可执行程序名]

使用”-tui“选项可以将代码显示在一个漂亮的交互式窗口内(所以被称为“文本用户界面 TUI”),在这个窗口内可以使用光标来操控,同时在下面的GDB shell中输入命令。

现在我们可以在程序的任何地方设置断点。你可以通过下列命令来为当前源文件的某一行设置断点。

break [行号]

或者为一个特定的函数设置断点:

break [函数名]

甚至可以设置条件断点

break [行号] if [条件]

例如,在我们的示例代码中,可以设置如下:

break 11 if i > 97

这样,程序循环97次之后停留在“a++”语句上。这样是非常方便的,避免了我们需要手动循环97次。

最后但也是很重要的是,我们可以设置一个“观察断点”,当这个被观察的变量发生变化时,程序会被停止。

watch [变量]

这里我们可以设置如下:

watch d

当d的值发生变化时程序会停止运行(例如,当i>97为真时)。

当设置断点后,使用"run"命令开始运行程序,或按如下所示:

r [程序的输入参数(如果有的话)]

gdb中,大多数的命令单词都可以简写为一个字母。

不出意外,程序会停留在11行。这里,我们可以做些有趣的事情。下列命令:

bt

回溯功能(backtrace)可以让我们知道程序如何到达这条语句的。

info locals

这条语句会显示所有的局部变量以及它们的值(你可以看到,我没有为d设置初始值,所以它现在的值是任意值)。

当然:

p [变量]

这个命令可以显示特定变量的值,而更进一步:

ptype [变量]

可以显示变量的类型。所以这里可以确定d是double型。

既然已经到这一步了,我么不妨这么做:

set var [变量] = [新的值]

这样会覆盖变量的值。不过需要注意,你不能创建一个新的变量或改变变量的类型。我们可以这样做:

set var a = 0

如其他优秀的调试器一样,我们可以单步调试:

step

使用如上命令,运行到下一条语句,有可能进入到一个函数里面。或者使用:

next

这可以直接运行下一条语句,而不进入子函数内部。

结束测试后,删除断点:

delete [行号]

从当前断点继续运行程序:

continue

退出GDB:

quit

总之,有了GDB,编译时不用祈祷上帝了,运行时不用血祭了,再也不用printf(“test“)了。当然,这里所讲的并不完整,而且GDB的功能远远不止于此。所以我强烈建议你自己更加深入的学习它。我现在感兴趣的是将GDB整合到Vim中。同时,这里有一个备忘录记录了GDB所有的命令行,以供查阅。

你对GDB有什么看法?你会将它与图形调试器对比吗,它有什么优势呢?对于将GDB集成到Vim有什么看法呢?将你的想法写到评论里。


via: http://xmodulo.com/gdb-command-line-debugger.html

作者:Adrien Brochard 译者:SPccman 校对:wxy

本文由 LCTT 原创翻译,Linux中国 荣誉推出

以我的经验来看,刚接触Git和GitHub时,最困扰的一件事情就是尝试解决下面的问题:在Git和GitHub上,我能做什么?

Git教程往往不会解决这个问题,因为它集中篇幅来教你Git命令和概念,并且不认为你会使用GitHub。GitHub帮助教程一定程度上弥补了这一缺陷,但是它每篇文章的关注点都较为狭隘,而且没有提供关于"Git vs GitHub"问题的概念性概述。

如果你是习惯于先理解概念,再着手代码的学习者,而且你也是Git和GitHub的初学者,我建议你先理解清楚什么是fork。为什么呢 ?

  1. Fork是在GitHub起步最普遍的方式。
  2. Fork只需要很少的Git命令,但是起得作用却非常大。
  3. Fork提供了对Git和GitHub最基础的了解,有益于你之后的工作。

本篇指南使用两张简单的图表,来教会你fork的两种主要工作流程。我并不打算涉及任何代码,但是在结论中,我会把你需要使用的代码的链接给你。

fork并且更新一个仓库

现在有这样一种情形:有一个叫做Joe的程序猿写了一个游戏程序,而你可能要去改进它。并且Joe将他的代码放在了GitHub仓库上。下面是你要做的事情:

Alt text

fork并且更新GitHub仓库的图表演示

  1. Fork他的仓库:这是GitHub操作,这个操作会复制Joe的仓库(包括文件,提交历史,issues,和其余一些东西)。复制后的仓库在你自己的GitHub帐号下。目前,你本地计算机对这个仓库没有任何操作。
  2. Clone你的仓库:这是Git操作。使用该操作让你发送"请给我发一份我仓库的复制文件"的命令给GitHub。现在这个仓库就会存储在你本地计算机上。
  3. 更新某些文件:现在,你可以在任何程序或者环境下更新仓库里的文件。
  4. 提交你的更改:这是Git操作。使用该操作让你发送"记录我的更改"的命令至GitHub。此操作只在你的本地计算机上完成。
  5. 将你的更改push到你的GitHub仓库:这是Git操作。使用该操作让你发送"这是我的修改"的信息给GitHub。Push操作不会自动完成,所以直到你做了push操作,GitHub才知道你的提交。
  6. 给Joe发送一个pull request:如果你认为Joe会接受你的修改,你就可以给他发送一个pull request。这是GitHub操作,使用此操作可以帮助你和Joe交流你的修改,并且询问Joe是否愿意接受你的"pull request",当然,接不接受完全取决于他自己。

如果Joe接受了你的pull request,他将把那些修改拉到自己的仓库。胜利!

同步一个fork

Joe和其余贡献者已经对这个项目做了一些修改,而你将在他们的修改的基础上,还要再做一些修改。在你开始之前,你最好"同步你的fork",以确保在最新的复制版本里工作。下面是你要做的:

Alt text

同步GitHub fork的图表示意图

  1. 从Joe的仓库中取出那些变化的文件:这是Git操作,使用该命令让你可以从Joe的仓库获取最新的文件。
  2. 将这些修改合并到你自己的仓库:这是Git操作,使用该命令使得那些修改更新到你的本地计算机(那些修改暂时存放在一个"分支"中)。记住:步骤1和2经常结合为一个命令使用,合并后的Git命令叫做"pull"。
  3. 将那些修改更新推送到你的GitHub仓库(可选):记住,你本地计算机不会自动更新你的GitHub仓库。所以,唯一更新GitHub仓库的办法就是将那些修改推送上去。你可以在步骤2完成后立即执行push,也可以等到你做了自己的一些修改,并已经本地提交后再执行推送操作。

比较一下fork和同步工作流程的区别:当你最初fork一个仓库的时候,信息的流向是从Joe的仓库到你的仓库,然后再到你本地计算机。但是最初的过程之后,信息的流向是从Joe的仓库到你的本地计算机,之后再到你的仓库。

结论

我希望这是一篇关于GitHub和Git 的 fork有用概述。现在,你已经理解了那些概念,你将会更容易地在实际中执行你的代码。GitHub关于fork和同步的文章将会给你大部分你需要的代码。

如果你是Git的初学者,而且你很喜欢这种学习方式,那么我极力推荐书籍Pro Git的前两个章节,网上是可以免费查阅的。

如果你喜欢视频学习,我创建了一个11部分的视频系列(总共36分钟),来向初学者介绍Git和GitHub。


via: http://www.dataschool.io/simple-guide-to-forks-in-github-and-git/

作者:Kevin Markham 译者:su-kaiyao 校对:wxy

本文由 LCTT 原创翻译,Linux中国 荣誉推出

想象一下你正在开发一个激进的新功能。这将是很灿烂的但它需要一段时间。您这几天也许是几个星期一直在做这个。

你的功能分支已经超前master有6个提交了。你是一个优秀的开发人员并做了有意义的语义提交。但有一件事情:你开始慢慢意识到,这个疯狂的东西仍需要更多的时间才能真的做好准备被合并回主分支。

m1-m2-m3-m4 (master)
     \ 
      f1-f2-f3-f4-f5-f6(feature)

你也知道的是,一些地方实际上是交叉不大的新功能。它们可以更早地合并到主分支。不幸的是,你想将部分合并到主分支的内容存在于你六个提交中的某个地方。更糟糕的是,它也包含了依赖于你的功能分支的之前的提交。有人可能会说,你应该在第一处地方做两次提交,但没有人是完美的。

m1-m2-m3-m4 (master)
     \ 
      f1-f2-f3-f4-f5-f6(feature)
             ^
             |
        mixed commit

在你准备提交的时间,你没有预见到,你可能要逐步把该功能合并入主分支。哎呀!你不会想到这件事会有这么久。

你需要的是一种方法可以回溯历史,把它并分成两次提交,这样就可以把代码都安全地分离出来,并可以移植到master分支。

用图说话,就是我们需要这样。

m1-m2-m3-m4 (master)
     \ 
      f1-f2-f3a-f3b-f4-f5-f6(feature)

在将工作分成两个提交后,我们就可以cherry-pick出前面的部分到主分支了。

原来Git自带了一个功能强大的命令git rebase -i ,它可以让我们这样做。它可以让我们改变历史。改变历史可能会产生问题,作为一个经验,应尽快避免历史与他人共享。不过在我们的例子中,我们只是改变我们的本地功能分支的历史。没有人会受到伤害。就这么做了!

好吧,让我们来仔细看看f3提交究竟修改了什么。原来我们共修改了两个文件:userService.js和wishlistService.js。比方说,userService.js的更改可以直接合入主分支而wishlistService.js不能。因为wishlistService.js甚至不存在在主分支里面。它是f1提交中引入的。

专家提示:即使是在一个文件中更改,git也可以搞定。但这篇博客中我们先简化情况。

我们已经建立了一个公众演示仓库,我们将使用这个来练习。为了便于跟踪,每一个提交信息的前缀是在上面的图表中使用的假的SHA。以下是git在分开提交f3时的分支图。

现在,我们要做的第一件事就是使用git的checkout功能checkout出我们的功能分支。用git rebase -i master开始做rebase。

现在接下来git会用所配置的编辑器打开(默认为Vim)一个临时文件。

该文件为您提供一些rebase选择,它带有一个提示(蓝色文字)。对于每一个提交,我们可以选择的动作有pick、rwork、edit、squash、fixup和exec。每一个动作也可以通过它的缩写形式p、r、e、s、f和e引用。描述每一个选项超出了本文范畴,所以让我们专注于我们的具体任务。

我们要为f3提交选择edit选项,因此我们把内容改变成这样。

现在我们保存文件(在Vim中是按下后输入:wq,最后是按下回车)。接下来我们注意到git在编辑选项中选择的提交处停止了rebase。

这意味这git开始将f1、f2、f3生效仿佛它就是常规的rebase,但是在f3生效之后停止。事实上,我们可以看一眼停止的地方的日志就可以证明这一点。

要将f3分成两个提交,我们所要做的是重置git的指针到先前的提交(f2)而保持工作目录和现在一样。这就是git reset在混合模式在做的。由于混合模式是git reset的默认模式,我们可以直接用git reset head~1。就这么做并在运行后用git status看下发生了什么。

git status告诉我们userService.js和wishlistService.js被修改了。如果我们运行 git diff 我们就可以看见在f3里面确切地做了哪些更改。

如果我们看一眼日志我们会发现f3已经消失了。

现在我们有了准备提交的先前的f3提交,而原先的f3提交已经消失了。记住虽然我们仍旧在rebase的中间过程。我们的f4、f5、f6提交还没有缺失,它们会在接下来回来。

让我们创建两个新的提交:首先让我们为可以提交到主分支的userService.js创建一个提交。运行git add userService.js 接着运行 git commit -m "f3a: add updateUser method"。

太棒了!让我们为wishlistService.js的改变创建另外一个提交。运行git add wishlistService.js,接着运行git commit -m "f3b: add addItems method".

让我们在看一眼日志。

这就是我们想要的,除了f4、f5、f6仍旧缺失。这是因为我们仍在rebase交互的中间,我们需要告诉git继续rebase。用下面的命令继续:git rebase --continue。

让我们再次检查一下日志。

就是这样。我们现在已经得到我们想要的历史了。先前的f3提交现在已经被分割成两个提交f3a和f3b。剩下的最后一件事是cherry-pick出f3a提交到主分支上。

为了完成最后一步,我们首先切换到主分支。我们用git checkout master。现在我们就可以用cherry-pick命令来拾取f3a commit了。本例中我们可以用它的SHA值bd47ee1来引用它。

现在f3a这个提交就在主分支的最上面了。这就是我们需要的!

这篇文章的长度看起来需要花费很大的功夫,但实际上对于一个git高级用户而言这只是一会会。

注:Christoph目前正在与Pascal Precht写一本关于Git rebase的书,您可以在leanpub订阅它并在准备出版时获得通知。

本文作者 Christoph Burgdorf自10岁时就是一名程序员,他是HannoverJS Meetup网站的创始人,并且一直活跃在AngularJS社区。他也是非常了解gti的内内外外,在那里他举办一个thoughtram的工作室来帮助初学者掌握该技术。

本的教程最初发表在他的blog


via: https://www.codementor.io/git-tutorial/git-rebase-split-old-commit-master

作者:cburgdorf 译者:geekpi 校对:wxy

本文由 LCTT 原创翻译,Linux中国 荣誉推出

作为一名开发者,你不应该把时间花费在考虑如何去找你所要编辑的代码上。在我转移到完全使用 VIM 的过程中,感到最痛苦的就是它处理文件的方式。从之前主要使用 Eclipse 和 Sublime Text 过渡到 VIM,它没有捆绑一个常驻的文件系统查看器对我造成了不少阻碍,而其内建的打开和切换文件的方式总是让我泪流满面。

就这一点而言,我非常欣赏VIM文件管理功能的深度。在工作环境上我已经装配了这些工具,甚至比起那些视觉编辑器好很多。因为这个是纯键盘操作,可以让我更快地在代码里面穿梭。搭建环境需要花费一些时间,安装几个插件。首先第一步是我明白vim内建功能只是处理文件的一种选择。在这篇文章里我会带你去认识vim文件管理功能与使用更高级的插件。

基础篇:打开新文件

学习vim其中最大的一个障碍是缺少可视提示,不像现在的GUI图形编辑器,当你在终端打开一个新的vim是没有明显的提示去提醒你去走什么,所有事情都是靠键盘输入,同时也没有更多更好的界面交互,vim新手需要习惯如何靠自己去查找一些基本的操作指令。好吧,让我开始学习基础吧。

创建新文件的命令是:e 或:e 打开一个新缓冲区保存文件内容。如果文件不存在它会开辟一个缓冲区去保存与修改你指定文件。缓冲区是vim是术语,意为"保存文本块到内存"。文本是否能够与存在的文件关联,要看是否每个你打开的文件都对应一个缓冲区。

打开文件与修改文件之后,你可以使用:w命令来保存在缓冲区的文件内容到文件里面,如果缓冲区不能关联你的文件或者你想保存到另外一个地方,你需要使用:w 来保存指定地方。

这些是vim处理文件的基本知识,很多的开发者都掌握了这些命令,这些技巧你都需要掌握。vim提供了很多技巧让人去深挖。

缓冲区管理

基础掌握了,就让我来说更多关于缓冲区的东西,vim处理打开文件与其他编辑器有一点不同,打开的文件不会作为一个标签留在一个可见的地方,而是只允许你同时只有一个文件在缓冲区打开,vim允许你打开多个缓存区。一些会显示出来,另外一些就不会,你需要用:ls来查看已经打开的缓存,这个命令会显示每个打开的缓存区,同时会有它们的序号,你可以通过这些序号使用:b 来切换或者使用循序移动命令 :bnext:bprevious 也可以使用它们的缩写:bn:bp

这些命令是vim管理文件缓冲区的一个基础,我发现他们不会按照我的想法映射出来。我不想关心缓冲区的顺序,我只想按照我的想法去到那个文件或者想在当前这个文件.因此必需了解vim更深入的缓存模式,我不是推荐你必须用内部命令来作为主要的文件管理方案。但这些的确是很强大可行的选择。

分屏

分屏是vim其中一个最好用的管理文件功能,在vim中你可以将当前窗口同时分开为2个窗口,可以按照你喜欢的配置去重设大小和分配,个别时候,我可以在同时打开6文件每个文件,每个都拥有不同大小。

你可以通过命令:sp 来新建水平分割窗口或者 :vs 垂直分割窗口。你可以使用这些关键命令去调整你想要的窗口大小,老实说,我喜欢用鼠标处理vim任务,因为鼠标能够给我更加准确的两列的宽度而不需要猜大概的宽度。

创建新的分屏后,你需要使用ctrl-w [h|j|k|l]来向后向前切换。这个有一点笨拙,但这个却是很重要、很普遍、很容易、很高效的操作。如果你经常使用分屏,我建议你去.vimrc使用以下代码去设置别名为ctrl-h ctrl-j 等等。

nnoremap <C-J> <C-W><C-J> "Ctrl-j to move down a split  
nnoremap <C-K> <C-W><C-K> "Ctrl-k to move up a split  
nnoremap <C-L> <C-W><C-L> "Ctrl-l to move    right a split  
nnoremap <C-H> <C-W><C-H> "Ctrl-h to move left a split  

跳转表

分屏是解决多个关联文件同时查看问题,但我们仍然不能解决已打开文件与隐藏文件之间快速移动问题。这时跳转表是一个能够解决的工具。

跳转表是众多插件中看起来奇怪而且很少使用的一个。vim能够追踪每一步命令还有切换你正在修改的文件。每次从一个分屏窗口跳到另外一个,vim都会添加记录到跳转表里面。它记录你去过的地方,这样就不需要担心之前的文件在哪里,你可以使用快捷键去快速追溯你的踪迹。Ctrl-o允许你返回你上一次地方。重复操作几次就能够返回到你最先编写的代码段地方。你可以使用ctrl-i来向前返回。当你在调试多个文件或在两个文件之间切换时,它能够发挥极大的快速移动功能。

插件

如果你想vim像Sublime Text 或者Atom一样,我就让你认清一下,这里有很好的机会让你看清一些难懂,可怕和低效的事情。例如大家会发出"当Sublime有了模糊查找功能,为什么我一定要输入全路径才能够打开文件" "没有侧边栏显示目录树我怎样查看项目结构" 等等。但vim有了解决方案。这些方案不需要破坏vim的核心。我只需要经常修改vim配置与添加一些最新的插件,这里有3个有用的插件可以让你像Sublime管理文件

  • CtrlP 是一个跟Sublime的"Go to Anything"栏一样模糊查找文件.它快如闪电并且非常可配置性。我使用它主要用来打开文件。我只需知道部分的文件名字不需要记住整个项目结构就可以查找了。
  • The NERDTree 这个一个文件管理夹插件,它重复了很多编辑器都有的侧边文件管理夹功能。我实际上很少用它,对于我而言模糊查找会更加快。对于你接手一个项目,尝试学习项目结构与了解什么可以用是非常方便的,NERDTree是可以自己定制配置,安装它能够代替vim内置的目录工具。
  • Ack.vim 是一个专为vim的代码搜索插件,它允许你跨项目搜索文本。它封装了Ack 或 Ag 这两个极其好用的搜索工具,允许你在任何时候在你项目之间快速搜索跳转。

在vim核心与它的插件生态系统之间,vim 提供足够的工具允许你构建你想要得工作环境。文件管理是软件开发系统的最核心部分并且你值得拥有体验的权利。

开始时需要通过很长的时间去理解它们,然后在找到你感觉舒服的工作流程之后再开始在上面添加工具。但依然值得你去使用,你不用爆头就可以理解如何去使用,能够轻易编写你的代码。

更多插件资源

  • Seamlessly Navigate Vim & Tmux Splits 这个插件需要每一个想使用它的人都要懂得使用tmux,这个跟vim的splits 一样简单好用。
  • Using Tab Pages 它是一个vim的标签功能插件,虽然它的名字用起来有一点疑惑,但它不是文件管理器。对如何在有多个工作可视区使用"tab pages" 在vim wiki 网站上有更好的概述。
  • Vimcasts: The edit command 一般来说 Vimcasts 是大家学习vim的一个好资源。这个屏幕截图与一些内置工作流程很好地描述了之前说的文件操作方面的知识。

via: http://benmccormick.org/2014/07/07/learning-vim-in-2014-working-with-files/

作者:Ben McCormick 译者:haimingfg 校对:wxy

本文由 LCTT 原创翻译,Linux中国 荣誉推出

AUTH:PHILO EMAIL:lijianying12 at gmail.com

基于POST GET 的http通讯虽然非常成熟,但是很容易被人监听。 并且如果使用跨域jsonp的通讯很容易在历史记录中发现通讯网址以及参数。为了克服这些问题, 并且降低服务器成本,我们没有使用SSL而使用 RSA加密。文章中的php加密解密 JS的加密解密 互相加密解密 都能验证通过。

其中PHP依赖常见的OPENSSL LIB 。 JS依赖 jsencrypt。

我们使用jsonp get RSA加密通讯好处如下:

  1. 前后分离适合cdn加速。
  2. 安全跨域更适合松散结构的网站。
  3. 不用去买ssl证书了。

首先要生成密匙对

openssl genrsa 1024 > private.key
openssl rsa -in private.key -pubout > public.key

JS的RSA加密流程

下载最新版本请移步到github:jsencrypt 代码在目录BIN下面是否用压缩的根据情况决定。

生成KEY

var keySize = 1024; //加密强度
var crypt = new JSEncrypt({default_key_size: keySize});  //RSA 操作对象
//方法1 (async)
crypt.getKey(function () {
    crypt.getPrivateKey();
    crypt.getPublicKey();
});
//方法2:
crypt.getKey();
crypt.getPrivateKey();
crypt.getPublicKey();

客户端加密场景:

var crypt1 = new JSEncrypt(); //新建rsa对象
        var publickey = '\
        -----BEGIN PUBLIC KEY-----\
        MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQC3N8LJFqlsa6loCgFpgZVMr/Sx\
        DMQY7pr0euNQfh2g+UVPbB0MGhoc7nWL0FQhCgDedbjQw/nGFStFx7W1+0o1oRTY\
        u5ebNVivZSobraUv7LJvwT8O66Zs8cxbKLqQ/nE/WwJvXomSIckH6R8iOUO8/QT9\
        kv6/L0Uma3qA07pmDQIDAQAB\
        -----END PUBLIC KEY-----\
                ';
crypt1.setPublicKey(publickey );//添加来自服务端的publickey
crypt1.encrypt('abc'); //返回值为加密后的结果

客户端解密场景:

        var privatekey = '-----BEGIN RSA PRIVATE KEY-----\
        MIICXQIBAAKBgQC3N8LJFqlsa6loCgFpgZVMr/SxDMQY7pr0euNQfh2g+UVPbB0M\
        Ghoc7nWL0FQhCgDedbjQw/nGFStFx7W1+0o1oRTYu5ebNVivZSobraUv7LJvwT8O\
        66Zs8cxbKLqQ/nE/WwJvXomSIckH6R8iOUO8/QT9kv6/L0Uma3qA07pmDQIDAQAB\
        AoGBAKba3UWModbfZXQeSJLxNCqWw9zJp3ydL/keQQ35DLqgyIJAD2QKEWXvtJUT\
        sMo19fyicSGOmFXQyYvPCKkmpLkOMAj1XaNpSMtSrcMx+gC01PO6Ey9rsUxW1g3u\
        fpqbEk9E3a5AtCS0I61nbUpRL6rqMtR5o2wcNR3TLtJt7pjxAkEA7hlFJKU1zWGp\
        OvvkJDnHc2NOCEJoGjqCR9wwv96+/xAykl2laI6WvEbbhjoO0+8+d17oigjhneS5\
        2UKFcfqw7wJBAMT+MCQ5TYLQlvjrBaDMqOdLsqtaDE6CpkrgwV820QMvHOo3R4Xd\
        uSbrA2tOr9t2/x+FzF971lRGdPFIch9UYMMCQQCZtO6SDaWCBP3++gX57OL5dq41\
        XsldxU+9nERMWTvr5UUAgDv8F7Dvsr6dFHXmE5i77yUnlzwvdi0UOIF1Z2U5AkBV\
        wyRKYPgx34Ya0JcerntKV1Zt60I4XADx0G/feAn/DN/VyENHMISPQPm4GgXN0jy4\
        CJQ1bcCd6B65fQTSRvXpAkA2Vv5yXzeKDls/AyxHEoros/VYftVc1HOFC++q13Rw\
        NH2rnlRT8FMTFEqL9MYRqvvYAFf5VmH0M1Nx5t4LRN+l\
        -----END RSA PRIVATE KEY-----\
                ';
var crypt2 = new JSEncrypt();//新建加密对象
crypt2.setPrivateKey(privatekey);//给加密对象设置privatekey
crypt2.getPublicKey();//Tip 我们是不需要存储publickey的直接用private能得到publickey
crypt2.decrypt("MeUqWB5LwTh8crzPqbZtEtKuZxYvPWH9CTCChK1qoBzIgIXGPCdzNMbiH0cCYHl5qWSERIDOgDIgv4dXsIMjEJ5q0cp/qNQYHM5va0iw0UvKvQB1E8aWtY2nFEPy4F+ArQ0Mj/ijr/CntEP1jHKC3WU9nu2kYrBIBnbj14Bs+kI=");//调用解密方法

但是虽然写到了这里,加密方面还是不够用,因为1024长度的RSA加密最多只能加密长度为117的字符串。而URL长度最多为4k因此这里我们要让加密长度达到2691以达到能用的程度。

那么这种加密长度大概能容纳多少数据呢? 我们借助json-generator来帮忙生成JSON

    sdata =[
        {
            "_id": "542f9ac2359c7d881bc0298e",
            "index": 0,
            "guid": "db1dacc1-b870-4e3c-bc1a-80dfd9506610",
            "isActive": false,
            "balance": "$1,570.15",
            "picture": "http://placehold.it/32x32",
            "age": 36,
            "eyeColor": "blue",
            "name": "Effie Barr",
            "gender": "female",
            "company": "ZORK",
            "email": "[email protected]",
            "phone": "+1 (802) 574-3379",
            "address": "951 Cortelyou Road, Wikieup, Colorado, 4694",
            "about": "Sunt reprehenderit do laboris velit qui elit duis velit qui. Nostrud sit eiusmod cillum exercitation veniam ad sint irure cupidatat sunt consectetur magna. Amet nisi velit laboris amet officia et velit nisi nostrud ipsum. Cupidatat et fugiat esse minim occaecat cillum enim exercitation laboris velit nisi est enim aute. Enim do pariatur
",
            "registered": "2014-05-08T15:26:35 -08:00",
            "latitude": 48.576424,
            "longitude": 146.634137,
            "tags": [
                "esse",
                "proident",
                "quis",
                "consectetur",
                "magna",
                "tempor",
                "anim"
            ],
            "friends": [
                {
                    "id": 0,
                    "name": "Trisha Cannon"
                },
                {
                    "id": 1,
                    "name": "Todd Bullock"
                },
                {
                    "id": 2,
                    "name": "Eileen Drake"
                },
                {
                    "id": 3,
                    "name": "Ferrell Kelly"
                },
                {
                    "id": 4,
                    "name": "Fischer Blankenship"
                },
                {
                    "id": 5,
                    "name": "Morales Mann"
                },
                {
                    "id": 6,
                    "name": "Brandie Pittman"
                },
                {
                    "id": 7,
                    "name": "Virgie Kerr"
                }
            ],
            "greeting": "Hello, Effie Barr! You have 1 unread messages.",
            "favoriteFruit": "apple"
        },
        {
            "_id": "542f9ac21c260d03e763a4f2",
            "index": 1,
            "guid": "9e3a3d8a-26f8-46b7-aca0-336a194808b1",
            "isActive": true,
            "balance": "$3,617.89",
            "picture": "http://placehold.it/32x32",
            "age": 31,
            "eyeColor": "brown",
            "name": "Butler Best",
            "gender": "male",
            "company": "SPORTAN",
            "email": "[email protected]",
            "phone": "+1 (905) 428-3046",
            "address": "798 Joval Court, Wanship, Delaware, 8974",
            "about": "Nostrud occaecat id sunt pariatur ad nisi do veniam sit officia non consequat amet fugiat. Est eiusmod labore ut cillum qui eu elit ut eiusmod exercitation. Ut anim nostrud eiusmod voluptate tempor proident id do pariatur. In Lorem ullamco ea irure adipisicing. Quis est dolor ex commodo aliqua nisi elit sit elit anim fugiat sunt amet. Enim consequat ipsum occaecat ipsum tempor deserunt dolor veniam nostrud. Anim cillum ullamco cupidatat aute velit fugiat sit enim in amet anim mollit dolor eiusmod.
",
            "registered": "2014-08-02T06:15:44 -08:00",
            "latitude": -20.529765,
            "longitude": 2.396578,
            "tags": [
                "consequat",
                "enim",
                "magna",
                "sunt",
                "Lorem",
                "quis",
                "commodo"
            ],
            "friends": [
                {
                    "id": 0,
                    "name": "Kenya Rice"
                },
                {
                    "id": 1,
                    "name": "Hale Knowles"
                },
                {
                    "id": 2,
                    "name": "Michael Stephens"
                },
                {
                    "id": 3,
                    "name": "Holder Bailey"
                },
                {
                    "id": 4,
                    "name": "Garner Luna"
                },
                {
                    "id": 5,
                    "name": "Alyce Sawyer"
                },
                {
                    "id": 6,
                    "name": "Rivas Owens"
                },
                {
                    "id": 7,
                    "name": "Jan Petersen"
                }
            ],
            "greeting": "Hello, Butler Best! You have 8 unread messages.",
            "favoriteFruit": "banana"
        }
    ]

表单json能达到这么长已经是很极端的情况了。因此这种方法绝对是够用的。

长表单内容加解密方法:

function encrypt_data(publickey,data)
{
    if(data.length> 2691){return;} // length limit
    var crypt = new JSEncrypt();
    crypt.setPublicKey(publickey);
    crypt_res = "";
    for(var index=0; index < (data.length - data.length%117)/117+1 ; index++)
    {
        var subdata = data.substr(index * 117,117);
        crypt_res += crypt.encrypt(subdata);
    }
    return crypt_res;
}
function decrypt_data(privatekey,data)
{
    var crypt = new JSEncrypt();
    crypt.setPrivateKey(privatekey);
    datas=data.split('=');
    var decrypt_res="";
    datas.forEach(function(item)
    {
        if(item!=""){de_res += crypt.decrypt(item);}
    });
    return decrypt_res;
}

##########NextPage[title=]##########

PHP的RSA加密

php加密解密类

首先要检查phpinfo里面有没有openssl支持

class mycrypt {  

    public $pubkey;  
    public $privkey;  

    function __construct() {  
                $this->pubkey = file_get_contents('./public.key');  
                $this->privkey = file_get_contents('./private.key');  
    }  

    public function encrypt($data) {  
        if (openssl_public_encrypt($data, $encrypted, $this->pubkey))  
            $data = base64_encode($encrypted);  
        else  
            throw new Exception('Unable to encrypt data. Perhaps it is bigger than the key size?');  

        return $data;  
    }  

    public function decrypt($data) {  
        if (openssl_private_decrypt(base64_decode($data), $decrypted, $this->privkey))  
            $data = $decrypted;  
        else  
            $data = '';  

        return $data;  
    }  

}  

密匙文件位置问题,是放到访问接口的附近就可以了如果是CI的话就放到index.php旁边就行了。 但是要注意一点,一定要做访问设置,不然key会暴出来的,那时候信息一旦截获就惨了。

类的使用

$rsa = new mycrypt();  
echo $rsa -> encrypt('abc');  
echo $rsa -> decrypt('W+ducpssNJlyp2XYE08wwokHfT0bm87yBz9vviZbfjAGsy/U9Ns9FIed684lWjYyyofi/1YWrU0Mp8vLOYi8l6CfklBY=');  

长数据加密解密

function encrypt_data($publickey,$data)
{
    $rsa = new mycrypt();
    if($publickey != ""){
        $rsa -> pubkey = $publickey;
    }
    $crypt_res = "";
    for($i=0;$i<((strlen($data) - strlen($data)%117)/117+1); $i++)
    {
        $crypt_res = $crypt_res.($rsa -> encrypt(mb_strcut($data, $i*117, 117, 'utf-8')));
    }
    return $crypt_res;
}
function decrypt_data($privatekey,$data)
{
    $rsa = new mycrypt();
    if($privatekey != ""){  // if null use default
        $rsa ->privkey = $privatekey;
    }
    $decrypt_res = "";
    $datas = explode('=',$data);
    foreach ($datas as $value)
    {
        $decrypt_res = $decrypt_res.$rsa -> decrypt($value);
    }
    return $decrypt_res;
}

JSONP 跨域通讯

我们经过千辛万苦经过加密终于能做到通讯安全了。 当然我们的下一步是通过JSONP 的get通讯来实现跨域通讯啦。 经过测试:我们的JS中最长的Case url长度是3956 在加上跨域url callbac参数,经过测试正好差20到4095 (一般的URI长度限制为4K)

$.ajax({  
    type:"get",  
    async:false,  // 设置同步通讯或者异步通讯
    url:"http://22500e31b5a12457.sinaapp.com/ubtamat/getPubKey?c=hknHQKIy3dyeeajyAwZ+raUkV1ezFbgU8zk+54cNQtrcEGozUjXpYhbC6fxz2hCOgp9feIsM1xKJFm5pkAGQ2UcUOc5EJNCAz6L0mXkZbTBmh3PufWxOE7TaicqRCRtZGGNB2qpm2WruXjYg1lPcrPz/rhFZx4DSJvEHkCm7ZU0=......(加密后的结果太长,省略)",  
    dataType:"jsonp",
    jsonp: "",
}); 
header("Content-type: application/javascript; charset=utf-8");
$response = "console.log('test response!')";
$callback = $this->input->GET('callback');
echo $callback.$response;

PHP代码是CI框架controler中的部分代码 并且经过了必要的裁剪。 更加细节的参数都放到GET里面就可以了。 处理之后按照上面的形式处理返回值就ok 如果你配置成功了,你将会在网页的控制台上看到自己动态的, 或者像我一样静态的控制台输出。 如果要是想获取数据到网页的话还是要借助回调函数来实现

JSONP跨域获取通讯结果

请看下面代码:

客户端代码

var global = null;
function jpc(result)
{
    global = result.msg;
}

$.ajax({  
    type:"get",  
    async:false,  // 设置同步通讯或者异步通讯
    url:"http://22500e31b5a12457.sinaapp.com/ubtamat/getPubKey",  
    dataType:"jsonp",
    jsonp: "jpc",
}); 

服务器端代码

header("Content-type: application/javascript; charset=utf-8");
$response = "jpc({'msg':123456})";
$callback = $this->input->GET('callback');
echo $callback.$response;

此次通讯的结果会在jcp当中调用执行,并且返回的内容会记录到 global 变量当中。

实战

从上文中,我们已经找到了整个加密过程方法了,但是距离实战还是有一定距离的。 首先我们实战的话需要克服接口比较少,功能比较多,单个接口维护用时比较长的问题。

为了解决上面的问题我们做出如下设计。

客户端方面:

设计一个通讯类:只管跟服务器通讯。别的业务什么都不管。

//create connection object.
var ConnServ = new Object();

ConnServ.tmpResponse = "not initial";

//call back function register slot.
ConnServ.CallBackFunction=function(){console.log(
    "call back function set error ! U must set a business call back function!"
)};

//input only encrypted data!!!
//send data to server
ConnServ.send=function(data)
{
    data = data.replace(/\+/g,"$");  //replace all + as $
    $.ajax({
        type:"get",
        async:false,  
        url:"http://22500e317.sinaapp.com/ubtamat?c="+data,
        dataType:"jsonp",
        jsonp: "jpc"
    });
    return "Send Finish";
}

//default call back funcation
function jpc(res)
{
    ConnServ.tmpResponse = res.msg;
    ConnServ.CallBackFunction();
}


//public key store.
ConnServ.getpublickey = function()
{
    return "\-" +
        "----BEGIN PUBLIC KEY----- " +
...................................................
        "-----END PUBLIC KEY-----";
}

在上面代码中请注意,RSA加密过后的字符串当中有一个非法字符+要转换成其他合法字符发送到服务器才可以。 不然参数会错误。 等传输到服务器中自己转换回来在解密就好了。

服务器端方面:

首先我们接收到消息之后要对消息进行解密,之后根据报文内容选择服务器上的功能。然后把其他参数输入到业务类中执行即可。 因此我们使用了命令模式来实现单一接口的丰富业务功能。 其他的我们需要对CI框架的配置进行调整: 首先global config里面需要调整 $config['global\_xss\_filtering'] = FALSE; 因为如果传输过来的报文解密不了就直接抛弃不进行处理(防止CC攻击第一层)这样就从url上防止了攻击的可能性。 当然我们还是没有完全避免注入风险这时我们就需要在业务类里面调用安全模块:

 $this->security->xss_clean()

来实现第二层的XSS攻击。这是服务器端设计主要需要说的位置。

服务器获取数据处理全过程

  1. 从get接口获得参数c的加密数据
  2. 对数据进行RSA解密。
  3. 判断数据包时间戳。如果超时直接抛弃(防止从浏览器记录中直接发送request到服务器,下面是安全方面的说明)

    • 首先如果不修改数据只修改时间戳不可能从截获的数据报文中实现,因为需要重新加密,如果想得到内容需要服务器上的privatekey解密保证安全
    • 如果数据包截获直接发送数据包在超时范围内直接获取数据包内容,也不能实现攻击,因为在客户端有临时RSA密匙对生成并且在发送的时候会同时发送publickey 给服务器做session的存储内容并且伪装客户的客户端没有privatekey所以获取任何关于登陆之后的消息根本无法解析。
  4. 对解密后的数据进行xss检查
  5. 解析报文中需要调用什么功能直接调用反射得到业务类的实例
  6. 调度业务类,并且把得到的参数赋值给业务执行函数的参数。

服务器处理数据过程只跟业务有关

服务器返回数据全过程

  1. 业务处理完成之后针对每一个用户的登陆情况对返回值进行加密。
  2. response

以上业务涉及的部分代码(给出的代码未涉及以上说的安全部分。)

//CI 控制器里面的方法
public function index()
{
    header("Content-Type: text/html;charset=UTF-8");
    $callback = $this -> input->GET('callback');
    $input_data = str_replace("$","+",$this->input->GET('c'));
    $input_data =$this -> rsa->decrypt_data($input_data);
    if($input_data == ""){return;}//如果数据不对解析就会失败,直接抛弃数据包,避免cracker构造数据包问题
    //这里插入时间戳检查代码
    //这插入xss检查
    $output_data = command($input_data);
    $response = "jpc({'msg':".$output_data."})";
    $callback = $this->input->GET('callback');
    echo $callback.$response;
}
//命令模式中的业务调度方法
function command($input)
{
    try
    {
        $obj_input = json_decode($input);
        $action = $obj_input -> {"action"};
        $business_action = new ReflectionClass($action);
        $instance  = $business_action->newInstanceArgs();
        $output = $instance->Action($obj_input);
        //对output变量进行rsa加密
        return "'".$output."'"; // here only accept string
    }
    catch(Exception $e)
    {
        return  "'".$e->getMessage()."'";
    }
}

以下是配合业务进行的工具函数:

//命令接口定义
interface ICommand {
    function Action($arg_obj);
} 
//把此函数放到system/core/common.php
//实现了输入一个文件夹就自动加载所有文件夹中的所有的类。
if ( ! function_exists('require_once_dir'))
{
    function require_once_dir($path)
    {
        $dir_list = scandir($path);
        foreach($dir_list as $file)
        {
            if ( $file != ".." && $file != "." )
            {
                require_once($path."/".$file);
            }
        }
    }
}

//使用:
//在application/config/autoload.php中添加类似如下代码:
require_once_dir(APPPATH."/controllers/lib");
require_once_dir(APPPATH."/controllers/actions");

以下是实现业务的例子:

class register implements  ICommand{
    public function Action($arg_obj)
    {
        return "we are do nothing: ".json_encode($arg_obj);
    }
}

通过以上基本方法,我们可以实现,只要业务继承我们声明的接口就可以开始写业务了。 别的什么都不用管,专注于业务即可,其他的安全、IO等问题都已经一并解决。 并且每一个业务都进行了rsa加密xss攻击过滤伪造数据包攻击。 以及在response加密只能是固定客户端才能看到报文内容的全过程。 但是一定要注意一点,注册这个业务后面要嵌套登陆进行,不然看不到返回值。

数据包必须包含的要素:

  1. acton (业务名)
  2. req\_time (请求时间)
  3. public\_key (如果是注册跟登陆时候需要提交临时公匙)

总结

因为时间仓促所以只能写到这里了。 如果您发现了我文章中的bug欢迎发email批评指正。非常感谢! 同时本方案也会成为我们开源社区linux52.com后台系统中的接口设计方案。 当然我们社区所有维护的文档都会进行反复验证,如果出问题我们会及时更新。 以维护文档的正确性。 点击=这=里=查看文档最新版本。

关键词

php js rsa get jsonp 跨域 安全