标签归档:ace.js

代码在线测试执行

空闲时间乱搞了那么一通,竟然按照心里的想法搞了出来
平常在线测试代码比较繁琐 就写了个测试
一直纠结别人怎么弄的
1、支持大多数语言
2、安全性要有保证
3、带智能语法提示

第一点就不多重复了,语言越多越方便

第二点比较重要,安全是首要考虑的问题,拿最简单的来说,代码执行shell命令就可以了,可以把你的服务器所有东西删除掉。所以这是必需要考虑的。

第三点也是很重要的,作为一个程序员,编写程序的时候代码提示还是很重要的,至少对我来说,智能提示还是很需要的~~。

我比较擅长PHP 所以页面用PHP来写咯,接口也是用PHP来写的
运行的环境,当然我不用在自己的服务器上搞,这是很危险的,开始想了虚拟机但是对性能要求比较
高,还有就是服务器被黑的话在恢复的时间上 会很长。别人介绍了用docker(强力推荐),这个软件
非常的方便。即使删除了我系统相关的东西,也能很快的恢复。
语法提示,这个推荐个编辑器 ace.js 编辑器 吊的不得了 强力推荐!!支持120多种语言
相关的工具就那么多 php docker nginx (后面会用到 端口转发) ace.js
流程: php 渲染模板(可以无视) PHP请求数据,生成对应的 编程语言文件,PHP调用命令执行文件。执行的过程是在 docker 里面
其实流程还是比较简单的,踩坑比较多
以前踩过的坑  执行php代码
ace.js 相关
docker相关操作

ace.js编辑器怎么用?

ace.js编辑器 支持 120多重语言 并且支持markdown 非常好用的代码编辑器

编辑代码或者显示代码 都推荐去使用
语法高亮超过120多种语言
超过20个主题
自动缩进
减少缩进
一个可选的命令行处理庞大的文件(400万线似乎是极限!)
完全自定义的键绑定,包括vim和Emacs模式
用正则表达式的搜索和替换
突出显示匹配的括号
软标签和实际标签之间切换
显示隐藏字符
使用鼠标拖放文本
换行
代码折叠
多个光标和选择
现场语法检查器
剪切,复制和粘贴功能
代码提示
尤其多代码提示功能,做的非常好
使用例子
只需要加载 这两个文件即可 下载的时候 会有src-noconflict 这个文件
<pre id=”editor”><?php 11;?></pre>
<script src=”ace/src-noconflict/ace.js” type=”text/javascript” charset=”utf-8″></script>
<script src=”ace/src-noconflict/ext-language_tools.js” type=”text/javascript” charset=”utf-8″></script>
下面的JS代码要写到 你的编辑器 上面,不然有可能因为加载问题没有代码提示
<script>
var editor = ace.edit(“editor”);//
editor.setTheme(“ace/theme/twilight”);//设置模板
editor.session.setMode(“ace/mode/php”);//设置语言
editor.setOptions({
enableBasicAutocompletion: true,
enableSnippets: true,
enableLiveAutocompletion: true
});
</script>
ace.js 方法属性调用
editor.getValue();   获取编辑器的值
editor.setValue(value);设置编辑器的值
editor.setTheme("ace/theme/twilight");设置皮肤
//设置编辑配置信息
editor.setOptions({
    enableBasicAutocompletion: true,
    enableSnippets: true,
    enableLiveAutocompletion: true//是否开启智能提示
});
editor.session.setMode("ace/mode/markdown");//设置编辑器语言