整合营销服务商

电脑端+手机端+微信端=数据同步管理

免费咨询热线:

python mini-web框架-组装数据为html格式

y_web.py(更新)

沉 发自 浅度寺

量子位 出品 | 公众号 QbitAI

在程序员圈子里,Visual Studio Code(以下简称VSCode)可以说是目前最火的代码编辑器之一了。

它是微软出品的一款可扩展的轻量级开源编辑器,并且支持全平台系统。这些特性使得VSCode颇受欢迎,这也使其成为了一个很棒的Python开发平台。

在本文中,你将学到如何在VSCode中进行高效的Python开发,其中包括:

  • 安装VSCode
  • 安装插件让Python开发更便利
  • 编写一个简单的Python应用
  • 学习如何在VSCode中运行和调试已有的Python程序
  • 在VSCode中使用Git和Github来管理代码

本文假设你已经熟悉了基本的Python开发,并且计算机上安装了某个版本的Python(Python2.7、Python3.6/7、Anaconda等)。

文中会提供Ubuntu和Windows系统上的运行截图和样例,但由于VSCode还可以在其他主流平台上运行,所以你可能会在实际操作中看到略微有些差异的UI界面,一些命令的键位可能也需要修改。

VSCode的安装与配置

在任何平台上安装VSCode都不是难事。微软提供了Windows,Mac和Linux平台上详尽的安装指引,并且每月都会有更新以推出新特性或修复已知问题。

这些都可以在VSCode官网上找到:

https://code.visualstudio.com



可能你会想,VSCode和那个庞大的Visual Studio名字这么像,它们会不会有什么关系呢?但其实,并没有,哈哈。

VSCode默认支持多种编程语言,并且有着丰富的扩展。VSCode每月更新,你可以在微软博客上随时关注更新的进展。微软甚至把代码开源在了Github上供所有开发者克隆仓库甚至贡献代码(暗示大家赶紧来提PR)。

VSCode的用户界面官方给出了详细的操作说明,如下图所示,在此不再赘述。



为Python开发安装插件

正如上文中提到,VSCode可以通过自身良好的扩展性质来支持各种编程语言的开发。

Python插件使我们可以更方便地在VSCode中进行Python开发,它有以下功能和特点:

  • 支持Python2.7和Python3.4+的Pyhon版本
  • 使用IntelliSense进行代码补全
  • 代码检查器
  • 对调试的支持
  • 代码段功能
  • 对单元测试的支持
  • 自动应用虚拟环境
  • 可在Jupyter环境和Jupyter Notebook中编辑代码



事实上,VSCode插件并不仅是编程语言层面的,如下面这些:Keymaps可以改变VSCode的操作方式,让那些习惯使用Atom,Sublime Text,Emacs,Vim,Pycharm等其他编辑器的开发者更舒服。

Themes可以定制用户界面外观,不管你是喜欢亮色、暗色或五彩斑斓的黑,它都能满足;Language提供了良好的本地化体验。

还有一些很有用的插件推荐给大家:

  • GitLens提供了许多可以直接在编辑窗口中使用的Git特性,包括blame标注和仓库探索等;
  • Autosave可以通过菜单栏File—Auto Save开启,顾名思义,它会以固定的时间间隔保存你的代码,默认是1000毫秒(1秒),这个值是可以配置的;
  • Settings Sync可以让你通过Github在多个VSCode安装中同步配置,如果你会在不同的机器上使用VSCode,这么做可以让你保持开发环境的一致性;
  • Docker插件可以当让你愉快地使用Docker工作,它帮助开发者编写dockerfile和docker-compose.yml,打包并部署项目,甚至为项目自动生成dockerfile。

当然了,你也可以自己发掘其他有趣有用的插件,欢迎和大家分享你的发现!

可以通过点击左边活动栏的插件图标来进行插件或主题的发现和安装。你可以通过关键词来搜索插件,用多种方式排序搜索结果,并快捷方便地安装插件。

对于本文中使用到的Python插件,你可以搜索Python字样,然后在特定项上点击install进行安装。



同理,你可以用这种方式安装其他上面提到的插件。

VSCode配置文件

VSCode通过用户(user)工作区(workspace)设置实现高度可配置化。

用户设置是应用于所有VSCode实例的全局性设置,而工作区设置是应用于特定文件夹或项目的局部设置。工作区设置给VSCode提供了极大的灵活性,我们在之后调出的都是工作区设置。

工作区设置以json格式保存在项目目录下.vscode文件夹中。

写个Python程序

让我们从一个Python程序开始探索如何在VSCode中进行Python开发。你可以在VSCode中使用快捷键Ctrl+N来编辑一个新文件(也可以在菜单栏中选择File—New File)。

Tips:VSCode用户界面提供了命令盘(command palette)功能,使你可以手不离键盘就能搜索、执行各项命令。按下Ctrl+Shift+P打开命令盘,键入new file,按下回车,也可以编辑一个新文件。

无论用哪种方法,你应该可以看到类似下面这样的窗口:



新文件打开后,就可以开始写代码啦。

我们快速写一个埃拉托斯特尼筛法(用来寻找不超过一个数的所有质数)作为测试代码。从下面这两行开始:

sieve = [True] * 101
for i in range(2, 100):

你应该看到类似下面的场景:



等等,发生什么了?为什么VSCode没有任何关键词高亮,格式自动调整等有用的东西?要它何用?

答案是,目前VSCode还不知道你在写什么。这个文字缓冲区叫做Untitled-1,如果你看看窗口右下角,你会发现写着Plain Text,也就是说VSCode还不知道你在写Python代码。

为了让Python插件发挥作用,我们需要将文件存储为后缀为py的文件,如sieve.py。你可以通过菜单栏File—Save File,或者按下Ctrl+S,或在命令盘键入save file来做到这一点。VSCode看到py后缀就会将文件解释为Python代码。现在你的窗口应该长这样:



好多了有没有!VSCode自动按照Python语言重新确定了格式,你可以在窗口左下角验证当前编程语言的正确性。

如果你同时安装了多个版本的Python(如Python2.7,Python3.x和Anaconda),你可以通过点击左下角的语言(这里的Python x.x.x)或在命令盘中选择select interpreter来切换Python解释器。VSCode默认用PEP8标准来格式化Python代码,但你也可以选用其他标准。

现在让我们完成剩余筛法代码。

为了能观察到IntelliSense发挥作用,请不要直接复制粘贴这段代码。亲手输入,你将看到下面的画面:



下面是埃拉托斯特尼筛法中“筛”这个部分的完整代码:

sieve = [True] * 101
for i in range(2, 100):
 if sieve[i]:
 print(i)
 for j in range(i*i, 100, i):
 sieve[j] = False

输入这段代码时,VSCode自动缩进了for和if下的语句,自动加上了结尾大括号,并为你提供输入建议。这就是IntelliSense的威力。

运行Python代码

既然写完了代码,我们就可以运行它了。因为VSCode可以直接在编辑器里运行代码,所以我们完全不需要离开编辑器。按Ctrl+S保存文件,接着在编辑器窗口中点击鼠标右键,选择Run Python File in Terminal。



可以看见,窗口下方出现了Terminal选项卡,显示了代码的输出。

对Python代码检查器的支持

你可能在写代码的时候看见过一个弹出框,上面写着代码检查器不可用(linting was not available)。你可以在弹出框中快速安装一个代码检查器,默认安装的是PyLint。VSCode也支持其他检查器,包括:flake8、mypy、pydocstyle、pep8、prospector、pyllama、bandit等。

Python代码检查器页面有配置每一种检查器的详细资料。注意,代码检查器的选择是项目级别的工作区设置,而不是全局用户设置。

编辑一个已有的Python项目

在埃拉托斯特尼筛法的例子中,你创建了一个单独的Python文件。这作为例子来讲很合适,但通常你会创建更大的项目,并在其上工作一段时间。一个典型的创建新项目的工作流程如下:

  • 创建一个存放项目的文件夹(其中可能包含一个新的Github项目)
  • 切换到新文件夹
  • 用命令代码创建一个初始Python代码文件

在Python项目中使用VSCode会给你带来更多精彩的功能,让我们看看VSCode是怎样对付大型工程的。

早在上个世纪我还是一名年轻的程序员时,我用调度场算法写过一个将算式解析为中缀表达式的计算器程序。为了展示VSCode中项目专属的特性,我将算法重构成了Python的一个算式求值库:

https://github.com/JFincher42/PyEval

大家可以随意克隆至本地以进行后面的操作。

本地文件夹建好后,你可以通过VSCode快捷地打开整个文件夹,我比较喜欢下面这种方式:

cd /path/to/project
code .

当这样打开时,VSCode将检测到并开启任何项目中存在的virtualenv、pipenv或conda虚拟环境,你甚至都不用自己手动去启动虚拟环境!以下几种方式都可以在用户界面中打开一个文件夹:菜单栏中点击File—Open Folder;按下快捷键Ctrl+K或Ctrl+O;在命令盘中键入file:open folder。

我的公式求值库项目打开后看起来是这样的:



当VSCode打开文件夹时,它同时也会打开你最近打开的文件(这个行为是可配置的)。

你可以打开、编辑、运行、调试文件列表中的任何文件。

左侧活动区的探索者视图向你展示了文件夹中的所有文件,并告诉你在当前打开的选项卡中有多少编辑了但还没有保存的文件。

对测试的支持

如果当前环境安装了测试框架,VSCode可以自动识别已有的用测试框架编写的测试代码。我用unittest为我的公式求值库写了一个单元测试,大家可以用它作为例子来学习。

你可以在项目中的任何一个文件中右键选择Run Current Unit Test File来运行已有的单元测试。VSCode会询问你使用哪种测试框架、项目中测试代码存放的路径,以及测试文件的命名方式。

这些设置都将作为工作去设置被保存在项目.vscode文件夹下的settings.json文件中,你也可以在那里更改这些设置。对于我的公式求值项目,我们选择用unittest框架,测试代码在当前目录下,测试代码命名为*_test.py。

一旦配置好了测试框架、找到了测试代码,你就可以点击状态栏的Run Tests来运行所有的测试。



你甚至可以通过点击状态栏的Run Tests,然后选择Run Unit Test Method来运行单个测试。这样我们就可以单独运行失败的测例,能够节省一大笔时间!测试结果输出在Output选项卡中。

对调试的支持

即使VSCode是个编辑器,但在其中调试代码也是可行的。VSCode提供了许多好的代码调试器所拥有的特性:

  • 自动变量追踪
  • watch表达式
  • 断点
  • 调用栈检查

它们作为调试视图的一部分被显示在活动栏中:



调试器可以控制Python应用在内置终端或远程终端实例上运行。它可以连接一个正在运行的Python实例,甚至可以调试Django和Flask应用。

用VSCode调试单个Python文件就和按F5启动调试器一样简单。你可以按F10和F11来跳出或进入函数,按Shift+F5退出调试器。按F9或单击编辑框左侧区域来设置断点。

当你要开始调试像Django和Flask应用这种更复杂的项目时,需要进行调试配置。在调试视图中,选择配置下拉菜单中的添加配置,然后选择Python:



上面的配置存储在了.vscode/launch.json中,你可以针对像Django、Flask这种特殊应用的设立专门的配置。

你甚至可以远程调试,或是调试Jinja模板。这一切只需在配置下拉菜单中选择合适的配置项即可。

Git集成

VSCode内置版本控制机制,并自带对Git和Github的支持,你也可以安装插件以支持其他版本控制软件。版本控制视图中提供了各种版本控制功能:



如果你的项目目录包含.git文件夹,那么VSCode自动开启完整的Git和Github支持。你可以进行的操作包括:

  • 提交文件到Git
  • 向远程仓库推送更新,或从远程仓库拉更新
  • 切换已有分支或新建分支
  • 查看并解决合并冲突
  • 查看代码差别

所有这些事都可以直接在VSCode用户界面中完成:

VSCode也能识别来自编辑器外的文件内容改变并做出反应。

在VSCode中提交最近的代码更改是很方便直接的。在版本控制视图中,被修改的文件用M标记,新的未追踪文件用U标记。

鼠标悬浮于文件上,点击加号(+)来添加更改。在顶端输入提交信息,最后点击对勾来提交这些更改。



你也可以在VSCode中将本地提交推至Github。选择版本控制视图中的Sync,点击状态栏中的Synchronize Changes即可。

结论

VSCode是目前最棒的通用编辑器,也是Python开发者的绝佳选择。通过这篇文章你学到了:

  • 如何安装VSCode
  • 如何查找、安装插件来开启对Python的支持
  • 如何用VSCode更轻松地编写Python程序
  • 如何用VSCode运行、调试Python代码
  • 如何在VSCode中使用Git和Github

VSCode已经成为了我进行Python甚至其他项目开发时最常用的编辑器,推荐给你,希望你也可以试试看~

— 完 —

诚挚招聘

量子位正在招募编辑/记者,工作地点在北京中关村。期待有才气、有热情的同学加入我们!相关细节,请在量子位公众号(QbitAI)对话界面,回复“招聘”两个字。

量子位 QbitAI · 头条号签约作者

վ'ᴗ' ի 追踪AI技术和产品新动态

近临近开学了,大家都在忙着准备各种学习的资料,准备在新的学期好好学习,充实自己。小编身边的同学也是如此,最近,小编的同学小丽就遇到了一个很棘手的问题。

她想将一个网页的Python学习的教程打印下来,方便自己来学习,但是上千页的教程,如果通过手动的方式,一个一个的去转成pdf并保存到本地,实在是麻烦的不。

这就是一个html转pdf的问题,其实网上有很多不错的html资源,但是苦于学习起来,不方便!于是小编就跟小丽保证,这点小事包在我身上。今天,小编就跟分享一下如何用Python把html资料变成pdf。

01.抓取的学习资料

如今网上的在线学习资料可谓是多如牛毛,为了方便讲解,小编就利用python3.9.2的中文文档作为演示的例子,来将其抓取并保存到本地,其网页链接如下:

https://docs.python.org/zh-cn/3.9/tutorial/index.html

打开上述链接后,大家会在网页中找到不同内容的链接地址,包括了基础的python字符、python语法等内容。

02.获取网页链接

在上图中,我们需要格外关注的是红色方格标注的链接,每个链接都会跳转到对应的子网页中,而在子网页中,就是我们想要保存的内容。

可以看到,上图中,在python速览子页面中,包含了我们需要提取的文字内容。所以将html内容保存为pdf的第一步便是获取到子页面的链接。由于教程大都是固定内容,因此对于教程的网页,大都采用的是静态页面,在网页源代码中可以很轻松地找到子页面的网页链接。

对于子网页的链接抓取,程序如下图所示:

程序中,通过BeautifulSoup库来解析网页源代码,然后提取所有的子页面链接地址并返回,如果抓取失败,则直接返回None


03.html转pdf

在得到子网页的链接后,接下来就是将html的子网页保存为pdf文件。小编使用的pdfkit库,pdfkit库可以将网页保存为pdf文档。首先小编来介绍一下pdfkit库的安装。

  • 下载https://github.com/wkhtmltopdf/packaging/releases/download/0.12.6-1/wkhtmltox-0.12.6-1.mxe-cross-win64.7z 并解压到本地文件中。(后台输入:pdf) 直接获取。
  • 将解压文件中的bin文件路径添加到系统变量Path中。
  • 执行pip install pdfkit
  • 执行pip install wkhtmltopdf

按照上述的操作流程,就可以安装pdfkit库。对于pdfkit库的使用,常见的用法有以下三种:

上面的程序主要完成以下几步:

首先需要指定wkhtmltopdf.exe文件的路径;

  • 然后分别通过from_url、from_file和from_string的三种方式来保存为pdf文件;
  • 需要注意的是,from_file和from_url中的第一个参数必须是一个html的字符串或者是html文档的列表;
  • 但是小编通过程序运行发现,from_url第一个参数只能是html的字符串,不能是html的列表


因此,pdfkit库只能将子网页保存为单独的pdf文档,无法直接通过pdfkit库将所有的子网页拼接成一个完整的pdf文档,小编通过PyPDF2库中的PdfFileMerger类来实现pdf文档的拼接。程序如下图所示。

程序中首先将所有的html网页保存为单独的pdf文档,然后通过PdfFileMerger类对象来实现pdf文档的拼接。最后就可以得到全部的pdf内容。最后我们通过视频的展示,来看一下程序的效果吧。


除此之外,程序不光可以抓取python3.9的中文文档,针对其他的在线文档,只需要对获取网页链接的程序进行修改即可抓取,例如对于Flask中文文档的抓取,程序只需要按照下图进行修改,即可将Flask的在线文档保存为PDF文档。

04.总结

学习Python其实非常有趣,也很有用。因为Python有大量的现成的库,可以帮助我们把工作中的很多琐碎的烦事轻松解决。小编将上述的程序稍加修改,很快就帮阿丽搞定了教程,保存为pdf发送给了她,小编与女神的关系更拉近了一步