Python在线交互式编程平台

王鹏

● 特色与亮点

①前端预处理技术，使得该平台支持input输入函数，能更好地体现交互式编程的特点;前端二次解析技术，使得该平台支持time模块下的sleep函数，能更好地体现程序运行过程;前端预处理技术和前端二次解析技术属于前端的技术处理范畴，均不会给服务器造成负担，保证了系统的稳定和安全。

②对于错误提示可以进行实时的中英文对照输出，让学生更快、更容易地发现错误，解决问题。

③对于语法高亮的支持，让学生更容易掌握语法中的关键字。

④研发的与该平台配套的课程，内容贴合本地区初中生的认知水平。

⑤自主研发的课程后台管理系统，让教师可以自定义课程内容，适应个性化的教学，便于后期平台的推广和使用。

⑥使用该学习平台，学生或教师不需要安装任何软件或者插件，只要计算机能上网，打开浏览器就可以使用。如果将该平台部署到公网上，学生在家中就可以使用该平台进行Python知识的学习。当然，若将该平台部署到学校内部的服务器上，学生在校内只需要访问局域网便可使用。

● 制作背景

近年来，编程语言Python已经进入了浙江、山东、北京等地的高中以及中小学信息技术教材。通过Python语言的学习，可以培养学生的逻辑思维能力和创造力，可以及早发现以及选拔出在编程方面有特长的学生，为国家储备人工智能方面的人才。可以预见，Python语言在当下乃至未来很长一段时间将成为信息技术学科中的热点与重点模块。

通过搜索，笔者检索到一些关于Python的编程平台，但这些平台大多没有配套的Python课程，仅仅提供了Python实验环境，虽然也有极少数的Python编程平台提供了相应的Python课程，但课程内容大多只是一些代码示例，并不贴合初中的信息技术教学。而且，这些平台大多是不开源的，尤其是后台管理系统，对外是封闭的。教师无法使用它的后台管理系统上传自己开发的个性化课程，无法真正应将其用于日常教学中。笔者经过实际检验发现，这些Python实验环境或者编程平台都不能很好地支持input和sleep这两个函数。

针对以上问题，设计制作一个交互式的Python编程平台并且以初中信息技术教材为蓝本开发配套的Python校本课程，是很有必要的。笔者设计的这一平台具有完全的自主知识产权并且是公益性的。在教育领域里，广大信息技术教师可以自由、免费、个性化地使用这个平台。该平台为中小学生学习Python提供了一种有效的途径。

● 设计思路及内容结构

该系统采用了B/S架构方式。用户在浏览器的网页中输入Python代码，点击“运行”按钮后，代码被发送到服务器。在服务器端，通过subProcess这个API将代码传输給Python解释器，并且接收返回结果。subProcess可以通过子进程来执行外部指令，并通过input/output/error管道，获取子进程执行的返回信息。最后，由服务器将返回结果发送给浏览器，浏览器负责解析并呈现结果。

系统总体上分为前端和后台两部分。前端主要负责展示课程、提供交互式编程环境以及呈现代码运行结果。后台又细分为两个模块：专门负责代码解析、执行、反馈运算结果的“代码处理模块”以及专门负责课程“增删改查”等操作的“课程管理模块”。其中，系统的前端界面包含四个区域，如图1所示。当用户把鼠标移动到图1所示界面最左端时，会弹出课程列表（如图2）。当用户单击某一章的标题时会展开本章的小节列表，用户通过单击某一小节的标题，在课程展示区就可以看到本小节所对应的课程内容，并根据课程内容进行相应的学习。该系统的后端“课程管理模块”界面如图3所示。

用户可以通过“课程管理模块”对课程的“章节标题”以及“文章内容”分别进行管理。例如，用户可以通过“章标题维护”菜单对“章标题”进行新增、删除、查询、修改操作;通过“节标题维护”菜单可以对某一章下面的“小节标题”进行新增、删除、查询、修改操作;通过“文章新增”菜单可以对某一小节下面的文章进行新增;通过“文章维护”这一菜单可以对已有的文章进行修改或者删除操作。

值得一提的是，该系统中的“文章新增”以及“文章修改”这两个功能已经做了人性化处理。用户在新增文章的时候，很有可能不是将所有章节的文章一次性添加完毕。实际上，用户无需关心哪些文章曾经添加过或者还有哪些文章需要新增等类似的问题。该系统会将所有已经添加过的文章以“下拉列表”的形式自动展现在“文章修改”功能界面。同时，系统会将没有添加过文章的章节标题以“下拉列表”的形式自动展现在“文章新增”功能界面中。“文章新增”以及“文章修改”这两个功能做到了相对独立并且互斥，不会出现用户操作错误的情况。要做到以上这一点，需要在数据库层面对SQL语句进行相应的优化处理。其中，“文章新增”功能界面如下页图4所示，“文章修改”功能界面如图5所示。

● 关键技术处理

1.关于input输入函数

例如，有这样一段包含input函数的代码如图6所示。

经过前端预处理后，以上代码在运行时会首先弹出一个对话框，要求用户输入密码。假如用户输入的密码为“abc”，经过前端进一步的预处理后会变成如图7所示的代码。

2.关于time模块下的sleep函数

例如，有如图8所示的一段代码，代码中的time.sleep（1）这条语句会被解析成print（“！$1$！”），其余代码保持不变。负责第一次解析的核心代码如下页图9所示。

经过第一次解析后的代码会由前端发送到后台，经过“代码处理模块”中的Python解释器解释执行后，结果被返还给前端，前端拿到的结果会被二次解析。第二次解析主要是将“！$1$！”中的数字“1”解析出来并还原成类似sleep（1）这样的函数，随后，在前端运用JavaScript技术来模拟sleep函数的效果。负责第二次解析的核心代码如下页图10所示。

3.关于中英文错误提示

本模块主要采用了字典这种数据结构来实现中英文对照的错误提示功能。如果用户输入的Python代码有语法错误，代码在后台被解析时会报错。在后台可以将Python解释器给出的错误提示信息与字典中的key进行比对，如果比对成功则输出对应的value值到前端页面的错误提示区。字典范例如下页图11所示。

4.关于语法高亮

在实现“语法高亮”这一功能时需要前端与后台配合完成。后台主要负责将代码转换成一种特定的HTML格式，并且生成配套的CSS样式表。前端则负责将后台传递过来的HTML+CSS内容渲染到页面，呈现出语法高亮效果。核心代码如图12所示。

● 幕前幕后

研发这个平台涉及的技术点非常多，能够顺利完成研发工作，得益于笔者平时注重技术的点滴积累。笔者在涉猎知识时遵循“广度优先”的原则，优先追求知识的广度，扩宽自己的知识面。在应用知识时笔者遵循“深度优先”的原则，优先追求知识的深度，深入钻研某一方面的知识，直到弄懂为止。

笔者利用业余时间研发这个平台，前后历时约6个月。一路走来，虽然有些忙碌，但内心却感到充实。感谢评委老师们给予的较高评价以及中肯的建议。感谢一直以来陪伴、鼓励和支持我的家人。感谢本单位信息中心的领导和老师在平台研发过程中给笔者提供的资源支持。

附：《Python在线交互式编程平台》数字学习工具二维码