django restful 1-在线Python编辑器
客户端（浏览器）----> 前端页面-----> 后端处理数据，并把数据以 json 形式发送到前端
online_app.py
from django.conf import settings
from django.http import HttpResponse
from django.conf.urls import url
from django.views.decorators.http import require_POST # 目前的 API 视图只能用于接收 POST 请求
from django.http import JsonResponse # 用于返回 JSON 数据
import subprocess
from django.views.decorators.csrf import csrf_exempt setting = {
'DEBUG':True,
'ROOT_URLCONF':__name__
} settings.configure(**setting) # 主视图
def home(request):
# 浏览器与服务器的内容交互都是以二进制流的方式进行的，所以正规的响应就应返回字节串
with open('index.html','rb') as f:
html = f.read()
return HttpResponse(html) # 执行客户端代码核心函数
def run_code(code):
try:
output = subprocess.check_output(['python','-c',code],
universal_newlines=True,
stderr=subprocess.STDOUT,
timeout=30)
except subprocess.CalledProcessError as e:
output = e.output
except subprocess.TimeoutExpired as e:
output = '\r\n'.join(['Time Out!!!',e.output]) return output # API 请求视图
@csrf_exempt
@require_POST
def api(request):
code = request.POST.get('code')
output = run_code(code)
return JsonResponse(data={'output':output}) # URL 配置
urlpatterns = [url('^api/$',api,name='api'),
url('^$',home,name='home')] if __name__ == '__main__':
import sys
from django.core.management import execute_from_command_line
execute_from_command_line(sys.argv)
index.html
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>在线 Python 解释器</title>
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<style>
#run {
width: 20%; /*规定按钮的宽度*/
margin-top: 10px; /*留出和输入框的间距*/
}
#code {
font-size: 25px;
resize: none;
}
#output {
font-size: 25px;
resize: none;
}
</style>
</head>
<body><!--在下面的注释中 bs 代表 bootstrap -->
<div class="container"><!-- 页面的整体布局 -->
<div class="row"> <!-- 这一行单独用来放标题 -->
<div class="col-lg-12"> <!-- 根据 bs规定，所有内容应放在 col 中。这一列占满一行 -->
<p class="text-center h1"> <!-- text-center 是 bs 中央排版类，h1 是 bs 一号标题类 -->
在线 Python 解释器
</p>
</div>
</div>
<hr><!-- 标题和真正内容的分割线 -->
<div class="row"><!-- 这一行用来放置主要内容 -->
<div class="col-lg-6"><!-- 代码输入部分 -->
<p class="text-center h3">
在下面输入代码
</p>
<textarea id="code" placeholder="你的代码." class="form-control" ></textarea>
<div class='text-right'><button id="run" type="button" class="btn btn-primary ">运行</button></div>
</div>
<div class="col-lg-6"><!-- 结果显示部分 -->
<p class="text-center h3">运行结果</p>
<div class="col-lg-12"><textarea id="output" disabled placeholder="输入代码并点击运行按钮" class="text-center form-control"></textarea></div>
</div>
</div>
</div>
<script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<script>
// 动态大小函数
function changeSize(ele){
$(ele).css({'height':'auto','overflow-y':'hidden'}).height(ele.scrollHeight)
}
// 应用到输入框
$('#code').each(function(){
this.oninput = function(){
changeSize(this)
}
})
function getCode(){
return $('#code').val()
}
//打印结果到输出框并改变输出框大小
function print(data){
var ele = document.getElementById('output')
output.value = data['output']
changeSize(output)
}
// 点击按钮发送代码
$('#run').click(function(){
$.ajax({
url:'/api/', //代码发送的地址
type:'POST', // 请求类型
data: {'code':getCode()},//调用代码获取函数，获得代码文本
dataType: 'json', //期望获取的响应类型为 json
success: print // 在请求成功之后调用 pprint 函数，将结果打印到输出框
})
})
</script>
</body>
</html>
结果：
django restful 1-在线Python编辑器的更多相关文章
- $Django 在线文本编辑器skindeditor
简介 KindEditor是一套开源的在线HTML编辑器,主要用于让用户在网站上获得所见即所得编辑效果,开发人员可以用 KindEditor 把传统的多行文本输入框(textarea)替换为可视化的富 ...
- python三大web框架Django,Flask,Flask，Python几种主流框架，13个Python web框架比较，2018年Python web五大主流框架
Python几种主流框架 从GitHub中整理出的15个最受欢迎的Python开源框架.这些框架包括事件I/O,OLAP,Web开发,高性能网络通信,测试,爬虫等. Django: Python We ...
- python编辑器对比和推荐
python编辑器对比和推荐 我先给一个初步的表格吧,大家如果有什么意见,或有补充,欢迎提出.有些我没有用过,先不写了.以下是我使用过的python IDE: 除了PythonWin, Visua ...
- Django+xadmin打造在线教育平台（二）
三.xadmin后台管理 3.1.xadmin的安装 django2.0的安装(源码安装方式): https://github.com/sshwsfc/xadmin/tree/django2 把zip ...
- Django+xadmin打造在线教育平台（三）
五.完成注册.找回密码和激活验证码功能 5.1.用户注册 register.html拷贝到templates目录 (1)users/views.py class RegisterView(View): ...
- Django+xadmin打造在线教育平台（一）
目录 在线教育平台(一) 在线教育平台(二) 在线教育平台(三) 在线教育平台(四) 在线教育平台(五) 在线教育平台(六) 在线教育平台(七) 在线教育平台( ...
- 4种好用的python编辑器
1.Sublime Text: 这是一个轻量级的代码编辑器,跨平台,支持几十种编程语言,包括Python,Java,C/C++等,小巧灵活,运行轻快,支持代码高亮.自动补全.语法提示,插件扩展丰富,是 ...
- Django RESTful Web Services, 此书学DRF不错
全名为<Django RESTful Web Services: The easiest way to build Python RESTful APIs and web services wi ...
- Js的在线代码编辑器：CodeMirror
github地址:https://github.com/codemirror/CodeMirror/tree/master/demo 里面包含需要的js.css文件以及大量的示例 官网:https:/ ...
随机推荐
- Linux进行AES加密每次结果都不一致并且解密失败报错
1. 现象 windows操作系统下进行"123456"的AES加密 encrypted message is below : QLNYZyjRnKF/zxAjzDt/lw== d ...
- C#多线程编程（4）--异常处理+前三篇的总结
本来是打算讲并行For和PLINQ的,但是我感觉前三篇我没有讲得很清晰.之前一直在看<CLR via C#>(后文简称CLR)的多线程部分,其中有些部分不是很明白,今天翻开<果壳中的 ...
- 主席树总结（经典区间第k小问题）（主席树，线段树）
接着上一篇总结--可持久化线段树来整理吧.点击进入 这两种数据结构确实有异曲同工之妙.结构是很相似的,但维护的主要内容并不相同,主席树的离散化.前缀和等思想也要更难理解一些. 闲话 话说刚学习主席树的 ...
- [Luogu3345][ZJOI2015]幻想乡战略游戏
Luogu 题意: 动态维护带权重心. sol 这是一道写起来很舒服的动态点分治.(不像某些毒瘤题) 我们考虑,如果你选择的补给点不是当前的带权重心,那么带权重心就在补给点的一个子树中(你把补给点当做 ...
- wpf研究之道——自定义Button控件
我们知道WPF中普通的按钮,长得丑,所以自定义按钮,在所难免.我们给按钮添加 MoveBrush,EnterBrush两把刷子,其实就是鼠标经过和鼠标按下的效果.只不过这不是普通的刷子,而是带图片的I ...
- Injection of autowired dependencies failed
error:org.springframework.beans.factory.BeanCreationException: Error creating bean with name 'mainCo ...
- border-image的拉伸和平铺
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- 初步谈谈 C# 多线程、异步编程与并发服务器
多线程与异步编程可以达到避免调用线程异步阻塞作用,但是两者还是有点不同. 多线程与异步编程的异同: 1.线程是cpu 调度资源和分配的基本单位,本质上是进程中的一段并发执行的代码. 2.线程编程的思维 ...
- js备战春招の四のjs函数
1.普通函数声明: 2.函数表达式:函数表达式可以存储在变量中,在函数表达式存储在变量后,变量也可作为一个函数使用: 以上函数实际上是一个 匿名函数 (函数没有名称).函数存储在变量中,不需要函数名称 ...
- 颜色的RGB值表示法
颜色的RGB值表示法 从物理光学试验中得出:红.绿.蓝三种色光是其他色光所混合不出来的.而这三种色光以不同比例的混合几乎可以得出自然界所有的颜色. 如红光与不同比例的绿光混合可以得出橙.黄.黄绿等色: ...