基于Judge0 IDE和Judge0 CE部署 雪球网股票论坛

雪球网股票论坛 近期在给实习学习的高一学子上信息技术课教授C语言，为了能够直观的演示，于是我使用了tool.lu的在线运行代码工具，体验尚可但是偶尔会无法链接评测端，就有点影响上课，于是打算自己搭建一个在线运行代码的平台。

于是我就想到了学校oj之前使用的judge0，体验很不错。与tool.lu相比则多了输入功能。

judge0

judge0 ，The most advanced open-source online code execution system in the world.

judge0是一款可以部署的健壮且可扩展的开源在线代码执行系统，支持60+种编程语言，并且安装方式也非常的简单。

judge0的api服务和ide都是开源免费的，而widget则是收费的，我们可以直接使用judge0官方提供的服务，当然我们也可以自行搭建。

开源地址

官方网站：https://judge0.com

开源前端ide: judge0/ide

开源版后端judge0 api：judge0/judge0

官方ide demo：https://ide.judge0.com/

安装judge0 IDE

首先安装前端页面 judge0 ide

服务器用的是宝塔面板那么将更加简单

cd /www/wwwroot/
git clone https://github.com/judge0/ide.git judge0ide

然后直接新建站点，PHP版本设置为纯静态，然后选择judge0ide目录即可。做好域名解析之后，配置一下ssl，这个时候访问域名就可以直接使用了，不过默认使用的是judge0官方的api服务，免费版每天只有一百次的运行次数限制，所以我们可以自行搭建评测api，也就是judge0本体。

安装judge0 CE api服务

首先安装docker和docker-compose

docker可以直接在软件商店安装dockhttps://wangzhuan.org.cn/wp-content/uploads/2021/11/8f36d19182202.pnger管理器，然后使用下方的命令来安装docker-compose，这条命令会自动进行安装，等待安装成功即可。

sudo curl -L "https://github.com/docker/compose/releases/download/1.29.2/docker-compose-$(uname -s)-$(uname -m)" -o /usr/local/bin/docker-compose

然后验证一下docker和docker-compose是否安装成功

docker -v
docker-compose -v

如果遇到docker-compose 报下方的错误：

-bash: /usr/local/bin/docker-compose: Permission denied

那么，使用以下命令给他赋以权限：

chmod +x /usr/local/bin/docker-compose

然后开始安装，还是在wwwroot目录

cd /www/wwwroot/
wget https://github.com/judge0/judge0/releases/download/v1.13.0/judge0-v1.13.0.zip
unzip judge0-v1.13.0.zip
cd judge0-v1.13.0
docker-compose up -d db redis
sleep 10s
docker-compose up -d
sleep 5s

等待安装成功，安装成功会自动运行，然后我们看一下服务是否正常。

docker ps -a

这个时候judge0的api服务就已经运行在2358端口了

配置域名反代api服务

这一步主要是为了在https下能够正常的进行评测

创建一个网站，PHP版本选择静态，然后解析好域名并配置好ssl

然后点击反向代理，对2358端口进行反代。

修改ide调用的api服务

在/www/wwwroot/judge0ide/js目录下有一个ide.js文件

我们打开他，修改第一行的api地址，默认的是judge0官方的api，修改之后保持，就可以访问前台进行食用了。

速度优化

judge0 ide默认使用的是unpkg还有cloudflare的公共库，那速度可想而知，大家可以替换为国内的镜像服务，打开速度会更上一个层次，这里我把head中修改过的内容放在下方，大家可以根据这个进行修改，其余的内容按自己的想法来修改就好啦！当然，记得底部保留版权，开源不易，请大家支持。

    <script src="https://cdn.staticfile.org/jquery/3.4.1/jquery.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>

    <script src="https://cdn.staticfile.org/golden-layout/1.5.9/goldenlayout.min.js" integrity="sha256-NhJAZDfGgv4PiB+GVlSrPdh3uc75XXYSM4su8hgTchI=" crossorigin="anonymous"></script>
    <link rel="stylesheet" href="https://cdn.staticfile.org/golden-layout/1.5.9/css/goldenlayout-base.css" integrity="sha256-oIDR18yKFZtfjCJfDsJYpTBv1S9QmxYopeqw2dO96xM=" crossorigin="anonymous" />
    <link rel="stylesheet" href="https://cdn.staticfile.org/golden-layout/1.5.9/css/goldenlayout-dark-theme.css" integrity="sha256-ygw8PvSDJJUGLf6Q9KIQsYR3mOmiQNlDaxMLDOx9xL0=" crossorigin="anonymous" />

    <script>
        var require = {
            paths: {
                "vs": "https://cdn.staticfile.org/monaco-editor/0.23.0/min/vs",
                "monaco-vim": "https://cdn.jsdelivr.net/npm/monaco-vim@0.1.19/dist/monaco-vim",
                "monaco-emacs": "https://cdn.jsdelivr.net/npm/monaco-emacs@0.2.2/dist/monaco-emacs"
            }
        };
    </script>
    <script src="https://cdn.staticfile.org/monaco-editor/0.23.0/min/vs/loader.js"></script>
    <script src="https://cdn.staticfile.org/monaco-editor/0.23.0/min/vs/editor/editor.main.nls.js"></script>
    <script src="https://cdn.staticfile.org/monaco-editor/0.23.0/min/vs/editor/editor.main.js"></script>

    <link rel="stylesheet" href="https://cdn.staticfile.org/semantic-ui/2.4.1/semantic.min.css" integrity="sha256-9mbkOfVho3ZPXfM7W8sV2SndrGDuh7wuyLjtsWeTI1Q=" crossorigin="anonymous" />
    <script src="https://cdn.staticfile.org/semantic-ui/2.4.1/semantic.min.js" integrity="sha256-t8GepnyPmw9t+foMh3mKNvcorqNHamSKtKRxxpUEgFI=" crossorigin="anonymous"></script>

    <!--<link href="https://fonts.geekzu.org/css?family=Exo+2" rel="stylesheet">-->

    <script type="text/javascript" src="third_party/download.js"></script>

    <script type="text/javascript" src="js/ide.js"></script>

    <link type="text/css" rel="stylesheet" href="css/ide.css">

    <title>KZ IDE - Online code editor</title>
    <link rel="shortcut icon" href="./favicon.ico" type="image/x-icon">
    <link rel="icon" href="./favicon.ico" type="image/x-icon">

    <!--<script async src="https://www.googletagmanager.com/gtag/js?id=G-RHNJ50BJ2F"></script>-->
    <script>
        // window.dataLayer = window.dataLayer || [];
        // function gtag(){dataLayer.push(arguments);}
        // gtag('js', new Date());
        // gtag('config', 'G-RHNJ50BJ2F');
    </script>

    <!--<script type="text/javascript">window.$crisp=[];window.CRISP_WEBSITE_ID="ee4621ff-c682-44ac-8cfa-1835beddb98a";(function(){d=document;s=d.createElement("script");s.src="https://client.crisp.chat/l.js";s.async=1;d.getElementsByTagName("head")[0].appendChild(s);})();</script>-->