项目代码（可直接下载运行）
一、项目的相关背景
学习编程的小伙伴，大家对力扣、牛客或其他在线编程的网站一定都不陌生，这些编程网站除了提供了在线编程，还有其他的一些功能。我们这个项目只是做出能够在线编程的功能。
二、所用技术栈和开发环境
技术栈：
负载均衡设计、多进程、多线程
C++ STL 标准库、Boost 标准库(字符串切割)、cpp-httplib 第三方开源网络库、ctemplate 第三方开源前端网页渲染库、jsoncpp 第三方开源序列化反序列化库
Ace前端在线编辑器(了解)、html/css/js/jquery/ajax (了解)
开发环境：
Centos 7 云服务器、vscode
三、项目的宏观结构
客户端向服务器的oj_server发起请求，有可能是请求题目的列表、请求特定题目的编写、请求代码提交；对于请求题目列表和编写，只需要向文件或MySQL获取数据，并显示成网页即可，但是提交代码的时候，我们就要考虑多用户提交的情况，所以oj_server在收到不同客户端发来的提交代码的请求时，就需要负载均衡式的选择后端的complie_server进行编译并运行，然后反馈最终结果。
四、工具类的设计
对于客户提交过来的文件（如1234），我们需要对文件进行路径拼接，拼接出（1234.cpp、1234.exe、1234.compiler_error），其中./temp是对用户提交过来的文件名进行路径的拼接，形成三个文件的存放位置，这是编译时需要的三个临时文件，有了这三个临时文件后，我们就可以对用户的代码进行编译的操作了。
用户提交的代码，虽然经过编译器编译后，形成了可执行程序，但是对于代码的运行也需要三个临时文件（1234.stdin、1234.stdout、1234.stderr） 这三个文件分别表示：1234.stdin：用户外部自测输入的参数（但是我们不考虑，直接使我们提供参数）1234.stdout：代表运行成功后的结果，我们不需要显示到显示器上，用文件保存起来，用于反馈给客户；1234.stderr：代表运行失败后的结果，我们不需要显示到显示器上，用文件保存起来，用于反馈给客户。
#pragma once
#include <iostream>
#include <string>
#include <atomic>
#include <fstream>
#include <sys/time.h>
#include <sys/types.h>
#include <sys/stat.h>
#include <boost/algorithm/string.hpp>
using namespace std;
class PathUtil
{
public:
static string addPath(const string &path, const string &suffix)
{
string totalPath = "./temp/";
totalPath += path;
totalPath += suffix;
return totalPath;
}
// 对文件进行路径拼接 1.cpp 1.exe 1.compile_error
static string srcPath(const string &path)
{
return addPath(path, ".cpp");
}
static string exePath(const string &path)
{
return addPath(path, ".exe");
}
static string errPath(const string &path)
{
return addPath(path, ".compile_error");
}
// 代码的运行需要的三个临时的文件
// 用户自行输入参数测试
static string stdIn(const string &path)
{
return addPath(path, ".stdin");
}
// 运行成功后的结果，不需要显示到显示器上，用文件保存起来，用于反馈给客户
static string stdOut(const string &path)
{
return addPath(path, ".stdout");
}
// 运行成功后的错误，不需要显示到显示器上，用文件保存起来，用于反馈给客户
static string stdErr(const string &path)
{
return addPath(path, ".stderr");
}
};
class TimeUtil
{
public:
// 日志添加时间戳
static string getTimeStamp()
{
struct timeval time;
gettimeofday(&time, nullptr);
return to_string(time.tv_sec);
}
// 为了保证文件的唯一性，使用毫秒级时间戳
static string getTimeMs()
{
struct timeval time;
gettimeofday(&time, nullptr);
return to_string(time.tv_sec * 1000 + time.tv_usec / 1000);
}
};
class FileUtil
{
public:
static bool isExistFile(const string &filename)
{
struct stat st;
if (stat(filename.c_str(), &st) == 0)
{
// 获取文件属性成功
return true;
}
return false;
}
// 毫秒级时间戳+原子递增唯一值，保证文件名的唯一性
static string uniqueFile()
{
atomic_uint id(0);
id++;
string ms = TimeUtil::getTimeMs();
string uniq_id = to_string(id);
return ms + "_" + uniq_id;
}
static bool writer(const string &target, const string &content)
{
ofstream ofs(target);
if (!ofs.is_open())
{
return false;
}
ofs.write(content.c_str(), content.size());
ofs.close();
return true;
}
static bool reader(const string &target, string *content, bool flag)
{
ifstream ifs(target);
if (!ifs.is_open())
{
return false;
}
(*content).clear();
string line;
// getline:不保存分隔符,但有些时候需要保留\n
// getline:内部重载了强制类型转换
while (getline(ifs, line))
{
(*content) += line;
(*content) += (flag ? "\n" : "");
}
ifs.close();
return true;
}
};
class StringUtil
{
public:
static void stringSpilt(const string &str, vector<string> *ret, const string spiltFlag)
{
// boost::split(type, select_list, boost::is_any_of(","), boost::token_compress_on);
// (1)、type类型是std::vector<std::string>，用于存放切割之后的字符串
// (2)、select_list：传入的字符串，可以为空。
// (3)、boost::is_any_of(",")：设定切割符为,(逗号)
// (4)、boost::algorithm::token_compress_on：将连续多个分隔符当一个，默认没有打开，当用的时候一般是要打开的。
boost::split((*ret), str, boost::is_any_of(spiltFlag), boost::algorithm::token_compress_on);
}
};五、compile的代码设计
compile只负责代码的编译，要对代码进行编译，就需要有file_name（文件名）（如：1234.cpp）对代码进行编译，有可能成功，形成.exe文件，后续可以直接运行；也有可能失败，对于编译失败了的原因，也需要保存起来，用于反馈给用户，否则客户怎么知道错误在哪里。
#pragma once
#include <unistd.h>
#include <sys/wait.h>
#include <sys/types.h>
#include <sys/stat.h>
#include <fcntl.h>
#include "log.hpp"
class Compiler
{
public:
static bool Compile(const string &path)
{
pid_t pid = fork();
if (pid < 0)
{
LOG(ERROR) << "子进程创建失败"
<< "\n";
return false;
}
else if (pid == 0)
{
// 子进程
umask(0); // 防止系统修改权限
int fileId = open(PathUtil::errPath(path).c_str(), O_CREAT | O_WRONLY, 0644);
if (fileId < 0)
{
LOG(WARNING) << "没有形成compile_error文件"
<< "\n";
exit(1);
}
dup2(fileId, 2); // 重定向标准错误到compile_error中
// 进程程序替换 并不影响进程的文件描述符
// 子进程执行 g++ -o 1.exe 1.cpp -std=c++11
execlp("g++", "g++", "-o", PathUtil::exePath(path).c_str(), PathUtil::srcPath(path).c_str(), "-std=c++11", "-D", "COMPILER_ONLINE", nullptr);
LOG(ERROR) << "启动编译器g++失败，可能是参数错误" << "\n";
exit(2);
}
else
{
// 父进程
waitpid(pid, nullptr, 0);
// 编译成功，查看是否有可执行文件生成.exe
if (FileUtil::isExistFile(PathUtil::exePath(path)))
{
LOG(INFO) << "编译成功，生成" << PathUtil::exePath(path) << "\n";
return true;
}
}
LOG(ERROR) << "编译失败，没有生成任何.exe文件" << "\n";
return false;
}
};六、run的代码设计
我们已经完成的编译服务，相应的会在temp目录下形成三个临时文件，当然编译成功会形成.exe文件，失败会形成compiler_error文件不会形成.exe文件，相应的错误信息回报存在这个文件中。有了.exe文件后，我们接下来的工作就是对可执行程序进行运行了。
虽然已经基本完成了run，但是还是有缺陷的，我们常常在力扣或牛客上刷题时，明确标注了时间限制和内存限制。所以我们对资源的限制也需要做一些处理，我们这里只处理时间和内存上的限制。
#pragma once
#include <unistd.h>
#include <fcntl.h>
#include <sys/wait.h>
#include <sys/resource.h>
#include "log.hpp"
class Runner
{
public:
// 设置进程占用资源大小
static void setProcLimit(int cpu_limit, int mem_limit)
{
struct rlimit cpu; // 调用setrlimit所需的结构体
cpu.rlim_max = RLIM_INFINITY; // 硬约束 无穷
cpu.rlim_cur = cpu_limit; // 软约束 当前cpu能跑的时长
setrlimit(RLIMIT_CPU, &cpu);
struct rlimit mem;
mem.rlim_max = RLIM_INFINITY;
mem.rlim_cur = mem_limit * 1024; // 将单位字节转化为kb
setrlimit(RLIMIT_AS, &mem);
}
// 只关心程序是否运行，并不关心结果是否正确
// 返回值 > 0：程序异常了，退出时收到了信号，返回值就是对应的信号编号
// 返回值 == 0：正常运行完毕了，结果保存到了对应的临时文件中
// 返回值 < 0：内部错误
static int Run(const string &path, int cpu_limit, int mem_limit)
{
string exe_path = PathUtil::exePath(path);
string stdin_path = PathUtil::stdIn(path);
string stdout_path = PathUtil::stdOut(path);
string stderr_path = PathUtil::stdErr(path);
umask(0);
int inId = open(stdin_path.c_str(), O_CREAT | O_WRONLY, 0644);
int outId = open(stdout_path.c_str(), O_CREAT | O_WRONLY, 0644);
int errId = open(stderr_path.c_str(), O_CREAT | O_WRONLY, 0644);
if (inId < 0 || outId < 0 || errId < 0)
{
LOG(ERROR) << "打开文件描述符失败" << "\n";
return -1;
}
pid_t pid = fork();
if (pid < 0)
{
LOG(ERROR) << "创建子进程失败" << "\n";
close(inId);
close(outId);
close(errId);
return -2; // 代表创建子进程失败
}
else if (pid == 0)
{
dup2(inId, 0);
dup2(outId, 1);
dup2(errId, 2);
setProcLimit(cpu_limit, mem_limit);
// 我要执行谁 我想在命令行上如何执行该程序
execl(exe_path.c_str(), exe_path.c_str(), nullptr);
exit(1);
}
else
{
close(inId);
close(outId);
close(errId);
int status = 0;
waitpid(pid, &status, 0);
LOG(INFO) << "运行完毕, info" << (status & 0x7F) << "\n";
return (status & 0x7F);
}
}
};
七、编译运行服务（compileRun）
编译和运行有了之后，我们将其整合到一起（编译运行服务）
在编译中，我们是根据用户传过来的文件名，先形成三个临时文件（1234.cpp、1234.exe、1234.compiler_error）然后对1234.cpp进行编译，形成1234.exe。
在运行中，我们是对1234.exe进行运行，形成三个临时文件（1234.stdin、1234.stdout、1234.stderr）
在编译运行过程中才是真正的接收用户传过来的数据信息，通过编译和运行的分别处理，完成用户的请求编译运行工作，这些数据信息是通过网络传输过来的，我们知道通过网络接收用户传过来json串，其中json串中应该包含如下：
in_json：
{
code: “#include <iostream> ....int main(){...}”,
input: "用户的输入（像牛客哪些）",
cpu_limit: "1024",
mem_limit: "30"
}我们提供一个start函数，用于解析这个in_json串，将数据解析出来；然后将提取出来的代码写入到特定的文件中，但是存在多个用户提交代码，我们就需要保证每个文件的唯一性。
如何保证每个文件的唯一性呢？我们采用毫秒级时间戳+原子递增的唯一值来实现。
我们可以获取到唯一的文件后，我们将获取到的in_json串进行解析， 提供路径拼接函数，形成唯一的源文件，将in_json中的代码写入到文件中（它保存在我们的temp目录下），然后进行编译工作，编译是通过创建子进程执行函数替换，其中所需的源文件和可执行程序文件都可以通过路径拼接来完成，最终形成可执行程序；紧接着就是去调用run进行程序的运行，也是通过路径拼接的方式找到文件，它的返回值是int（大于0：程序异常，退出时收到了信号，返回值就是对应的信号；小于0：内部错误，子进程创建失败；等于0：正常运行完毕，结果保存到对应的临时文件中）。我们可以通过这个返回值来进行判断程序运行的结果，并自行设置状态码，将状态码对应到不同的信息，我们可以通过实现一个CodeToDesc函数。当然，在temp目录下会不断的形成临时文件，我们需要做个清理工作。
#pragma once
#include <jsoncpp/json/json.h>
#include <sstream>
#include <memory>
#include "run.hpp"
#include "compile.hpp"
class CompileRun
{
public:
// code > 0：进程收到了信号导致异常崩溃
// code < 0：整个过程非运行报错（代码为空，编译报错等）
// code = 0：整个过程全部完成
// 将错误代码转为描述（CodeToDesc()）
static string codeToDesc(int code, const string &filename)
{
string ret;
switch (code)
{
case 0:
ret = "编译成功";
break;
case -1:
ret = "提交代码为空";
break;
case -2:
ret = "未知错误";
break;
case -3:
FileUtil::reader(PathUtil::errPath(filename), &ret, true); // 编译错误
break;
case SIGABRT:
ret = "内存超出";
break;
case SIGXCPU:
ret = "CPU使用超时";
break;
case SIGFPE:
ret = "浮点数溢出";
break;
default:
ret = "未知错误码" + to_string(code);
break;
}
return ret;
}
// 删除临时文件 清理temp目录下的临时文件
static void removeTempFile(const string &filename)
{
if (FileUtil::isExistFile(PathUtil::srcPath(filename)))
{
unlink(PathUtil::srcPath(filename).c_str());
// unlink函数：是Linux下删除特定文件的一个函数，参数是字符串形式
}
if (FileUtil::isExistFile(PathUtil::exePath(filename)))
{
unlink(PathUtil::exePath(filename).c_str());
}
if (FileUtil::isExistFile(PathUtil::errPath(filename)))
{
unlink(PathUtil::errPath(filename).c_str());
}
if (FileUtil::isExistFile(PathUtil::stdIn(filename)))
{
unlink(PathUtil::stdIn(filename).c_str());
}
if (FileUtil::isExistFile(PathUtil::stdOut(filename)))
{
unlink(PathUtil::stdOut(filename).c_str());
}
if (FileUtil::isExistFile(PathUtil::stdErr(filename)))
{
unlink(PathUtil::stdErr(filename).c_str());
}
}
/*
* 输入：
* code：用户提交的代码
* input：用户给自己提交代码对应的输入，不做处理
* cpu_limit：时间要求
* mem_limit：空间要求
*
* 输出：
* 必填字段：
* status：状态码
* reason：请求结果
* 选填字段：
* stdout：程序运行完的结果
* stderr：程序运行完的错误结果
* */
/*
* start函数功能:
* 通过网络接收用户传过来的json串（in_json），其中in_json包含如下：
* in_json：
* {
* code: “#include <iostream> ....int main(){...}”,
* input: "用户的输入（像牛客哪些）",
* cpu_limit: "1024",
* mem_limit: "30"
* }
* start函数去解析这个in_json串，将数据取出来；
* 然后将提取出来的代码写入到特定的文件中，因为存在多个用户提交代码，所以需要保证每个文件的唯一性；
* */
static void start(const string &in_json, string *out_json)
{
// 反序列化
Json::Value inRoot;
Json::CharReaderBuilder crb;
unique_ptr<Json::CharReader> cr(crb.newCharReader());
string error;
cr->parse(in_json.c_str(), in_json.c_str() + in_json.size(), &inRoot, &error);
string code = inRoot["code"].asString();
string input = inRoot["input"].asString();
int cpu_limit = inRoot["cpu_limit"].asInt();
int mem_limit = inRoot["mem_limit"].asInt();
// 在goto之间定义的变量是不允许的，所以提前定义
int status_code = 0; // 状态码
int run_result = 0; // run运行返回值
string filename = ""; // 需要内部形成唯一文件名
Json::Value outRoot;
if (code.size() == 0) // 提交代码为空
{
status_code = -1;
goto END;
}
// 给每一个用户的每一次提交生成唯一的文件src
filename = FileUtil::uniqueFile();
// 生成.cpp文件
if (!FileUtil::writer(PathUtil::srcPath(filename), code))
{
status_code = -2; // 未知错误
goto END;
}
// 编译 .cpp->.exe
if (!Compiler::Compile(filename))
{
status_code = -3; // 编译错误
goto END;
}
// 运行可执行文件.exe
run_result = Runner::Run(filename, cpu_limit, mem_limit);
if (run_result < 0)
{
status_code = -2;
goto END;
}
else if (run_result > 0)
{
status_code = run_result; // 程序运行崩溃了(源于某种信号)
}
else
{
status_code = 0; // 运行成功
}
END:
outRoot["status"] = status_code;
outRoot["reason"] = codeToDesc(status_code, filename);
// 如果运行成功，输出运行结果
if (status_code == 0)
{
string out;
FileUtil::reader(PathUtil::stdOut(filename), &out, true);
outRoot["stdout"] = out;
string err;
FileUtil::reader(PathUtil::stdErr(filename), &err, true);
outRoot["stderr"] = err;
}
// 序列化
Json::StreamWriterBuilder swb;
unique_ptr<Json::StreamWriter> sw(swb.newStreamWriter());
stringstream ss;
sw->write(outRoot, &ss);
*out_json = ss.str();
removeTempFile(filename);
}
};八、打包成网络服务（编译运行代码的测试）
#include "compileRun.hpp"
#include "./cpp-httplib/httplib.h"
void Usage(string proc)
{
cerr << "Usage: "
<< "\n\t" << proc << endl;
}
// 这里是测试代码
int main(int argc, char *argv[])
{
// in_json:
// {
// "code" : "#include...", "input" : " ", "cpu_limit" : 1, "mem_limit" : 10240
// }
// out_json:
// {
// "status" : "0", "reason" : "", "stdout" : "", "stderr" : ""
// }
// 通过http让client给我们上传一个json string
// 下面的工作，充当客户端请求的json串
// std::string in_json;
// Json::Value in_value;
// in_value["code"] = R"(#include <iostream>
// int main(){
// std::cout << "你可以看见我了" << std::endl;
// return 0;
// })";
// in_value["input"] = "";
// in_value["cpu_limit"] = 1;
// in_value["mem_limit"] = 10240 * 3;
// Json::FastWriter writer;
// in_json = writer.write(in_value);
// std::cout << in_json << std::endl;
// std::string out_json; // 这个是将来给客户返回的json串
// CompileRun::start(in_json, &out_json);
// std::cout << out_json << std::endl;
// ./compile_server port
if (argc != 2)
{
Usage(argv[0]);
return 1;
}
httplib::Server ser;
ser.Post("/compileAndRun", [](const httplib::Request &req, httplib::Response &resp)
{
string inJson = req.body;
string outJson;
if (!inJson.empty())
{
CompileRun::start(inJson, &outJson);
resp.set_content(outJson,"application/json;charset=utf-8");
} });
ser.listen("0.0.0.0", atoi(argv[1]));
}九、基于MVC结构的设计
1. 什么是MVC结构
经典MVC模式中，M是指业务模型，V是指用户界面（视图），C则是控制器，使用MVC的目的是将M和V的实现代码分离，从而使同一个程序可以使用不同的表现形式。其中，View的定义比较清晰，就是用户界面。
M：model表示的是模型，代表业务规则。在MVC的三个部件中，模型拥有最多的处理任务，被模型返回的数据是中立的，模型与数据格式无关，这样一个模型就能够为多个视图提供数据，由于应用于模型的代码只需要写一次就可以被多个视图重用，所以减少了代码的重复性。
V：view表示的视图，代表用户看到并与之交互的界面。在视图中没有真正的处理发生，它只是作为一种输出数据并允许用户操作的方式。
C：controller表示的是控制器，控制器接收用户的输入并调用模型（M）和视图（V）去完成用户需求。控制器本身不输出任何东西和任何处理。它只接收请求并决定调用哪个模型构建去处理请求，然后再确定用哪个视图来显示返回的数据。
2. Model
题目应该包含如下的信息：
题目的编号（1）
题目的标题（求最大值）
题目的难度（简单、中等、困难）
题目的时间要求（1s）
题目的空间要求（30000KB）
题目的描述（给定一个数组，求最大值）
题目预设给用户在线编辑的代码（#include<iostream>...）
题目的测试用例
新增一个目录questions，用来存放我们的题库，这个questions目录下包含题目列表（文件形式）和每个题目的文件夹（其中又包含题目的描述、题目预设给用户在线编辑的代码header和题目的测试用例tail）
#pragma once
#include <iostream>
#include <fstream>
#include <vector>
#include <unordered_map>
#include <string>
#include "log.hpp"
using namespace std;
struct Question
{
string number; // 题目编号
string title; // 题目标题
string star; // 题目难度
int cpu_limit; // 时间要求
int mem_limit; // 内存要求
string desc; // 题目描述
string head_code; // 预设在线编辑的代码
string test_code; // 测试用例
};
const string questionsPath = "./questions/";
const string questionListPath = "./questions/question.list";
class Model
{
private:
unordered_map<string, Question> Questions;
public:
Model()
{
LoadQuestion(questionListPath);
}
bool LoadQuestion(const string &path)
{
ifstream ifs(path);
if (!ifs.is_open())
{
LOG(FATAL) << "加载题库失败，请检查是否存在题库文件" << endl;
return false;
}
string line;
while (getline(ifs, line))
{
vector<string> q;
StringUtil::stringSpilt(line, &q, " ");
if (q.size() != 5)
{
LOG(WARNING) << "加载部分题目失败，请检查题目格式" << endl;
continue;
}
Question ques;
ques.number = q[0];
ques.desc = q[1];
ques.star = q[2];
ques.cpu_limit = atoi(q[3].c_str());
ques.mem_limit = atoi(q[4].c_str());
string qPath = questionsPath;
qPath += q[0];
qPath += "/";
FileUtil::reader(PathUtil::addPath(qPath, "desc.txt"), &(ques.desc), true);
FileUtil::reader(PathUtil::addPath(qPath, "header.cpp"), &(ques.head_code), true);
FileUtil::reader(PathUtil::addPath(qPath, "tail.cpp"), &(ques.test_code), true);
Questions.insert({ques.number, ques});
}
LOG(INFO) << "加载题库......成功" << endl;
ifs.close();
return true;
}
bool getAllQuestions(vector<Question> *questions)
{
if (Questions.empty())
{
LOG(ERROR) << "用户获取题库失败" << endl;
return false;
}
for (const auto &e : Questions)
{
(*questions).push_back(e.second);
}
return true;
}
bool getOneQuestion(const string &id, Question *question)
{
auto iter = Questions.find(id);
if (iter == Questions.end())
{
LOG(ERROR) << "用户获取指定题目失败" << endl;
return false;
}
*question = iter->second;
return true;
}
};3. View
将model中的数据进行渲染构建出网页，所以我们需要引入一个第三方库ctemplate。
#pragma once
#include <ctemplate/template.h>
#include "ojModel.hpp"
const string template_html = "./template_html/";
class View
{
public:
// 所有题目的网页
void AllExpendHtml(const vector<Question> &questions, string *html)
{
// 题目编号 标题 难度 推荐使用表格
// 形成路径
string src_html = template_html + "all_questions.html";
// 形成数据字典
ctemplate::TemplateDictionary root("all_questions.html");
for (const auto &q : questions)
{
ctemplate::TemplateDictionary *td = root.AddSectionDictionary("question_list");
td->SetValue("number", q.number);
td->SetValue("title", q.title);
td->SetValue("star", q.star);
}
// 获取被渲染的网页
ctemplate::Template *t = ctemplate::Template::GetTemplate(src_html, ctemplate::DO_NOT_STRIP);
// 开始渲染
t->Expand(html, &root);
}
// 一道题目的网页
void OneExpendHtml(const Question &question, string *html)
{
string src_html = template_html + "one_question.html";
ctemplate::TemplateDictionary root("one_question.html");
root.SetValue("number", question.number);
root.SetValue("title", question.title);
root.SetValue("star", question.star);
root.SetValue("desc", question.desc);
root.SetValue("pre_code", question.head_code);
ctemplate::Template *t = ctemplate::Template::GetTemplate(src_html, ctemplate::DO_NOT_STRIP);
t->Expand(html, &root);
}
};4. Control
通过获取用户的输入调用不同的模型构建view。但是我们还需要完成负载均衡的概念，因为在后端进行编译服务的时候，如果只提供一台主机，当用户请求比较多或主机挂了，会影响用户体验。
#pragma once
#include <mutex>
#include <jsoncpp/json/json.h>
#include <sstream>
#include "./cpp-httplib/httplib.h"
#include "ojView.hpp"
#include "ojModel.hpp"
class Machine
{
public:
string ip; // 编译服务的ip
int port; // 编译服务的port
uint64_t load; // 编译服务的负载数量
mutex *mtx; // c++中mutex是禁止拷贝的，所以使用指针
public:
Machine() : ip(""), port(0), load(0), mtx(nullptr) {}
void incrLoad()
{
if (mtx)
mtx->lock();
load++;
if (mtx)
mtx->unlock();
}
void descLoad()
{
if (mtx)
mtx->lock();
load--;
if (mtx)
mtx->unlock();
}
void clearLoad()
{
if (mtx)
mtx->lock();
load = 0;
if (mtx)
mtx->unlock();
}
uint64_t getLoad()
{
uint64_t l = 0;
if (mtx)
mtx->lock();
l = load;
if (mtx)
mtx->unlock();
return l;
}
};
const string confPath = "./conf/service_machine.conf";
class LoadBlance
{
private:
vector<Machine> machines; // 所有主机的集合 下标就是主机的id
vector<int> online; // 在线主机的id
vector<int> offline; // 离线主机的id
mutex mtx;
public:
LoadBlance()
{
Load(confPath);
LOG(INFO) << "加载" << confPath << "完成" << endl;
}
bool Load(const string &path)
{
ifstream ifs(path);
if (!ifs.is_open())
{
LOG(FATAL) << "加载" << path << "失败" << endl;
return false;
}
string line;
while (getline(ifs, line))
{
vector<string> ret;
StringUtil::stringSpilt(line, &ret, ":");
if (ret.size() != 2)
{
LOG(WARNING) << "切分失败" << endl;
return false;
}
Machine m;
m.ip = ret[0];
m.port = atoi(ret[1].c_str());
m.load = 0;
m.mtx = new mutex();
online.push_back(machines.size());
machines.push_back(m);
}
ifs.close();
return true;
}
// Machine **m 使用双重指针的原因是为了能够通过指针间接地修改指向的对象，即Machine对象的地址。
bool SmartChoice(int *id, Machine **m)
{
mtx.lock();
// 负载均衡：随机数算法、轮询+随机算法
int num = online.size();
if (num == 0)
{
mtx.unlock();
LOG(WARNING) << "所有主机都离线了，请运维人员迅速查看" << endl;
return false;
}
*id = online[0];
*m = &machines[online[0]];
uint64_t min_load = machines[online[0]].load;
for (int i = 1; i < online.size(); i++)
{
uint64_t cur_load = machines[online[i]].load;
if (cur_load < min_load)
{
min_load = cur_load;
*id = online[i];
*m = &machines[online[i]];
}
}
mtx.unlock();
return true;
}
// 离线主机
void offlineMachine(int which)
{
mtx.lock();
for (auto iter = online.begin(); iter != online.end(); iter++)
{
if (*iter == which)
{
machines[which].clearLoad();
online.erase(iter);
offline.push_back(which);
break; // 因为有break存在，所以不需要考虑迭代器失效问题
}
}
mtx.unlock();
}
// 上线主机
void onlineMachine()
{
// 当所有主机已离线时，统一上线所有主机
mtx.lock();
online.insert(online.end(), offline.begin(), offline.end());
offline.erase(offline.begin(), offline.end());
mtx.unlock();
LOG(INFO) << "所有离线主机已上线" << endl;
}
void showMachine()
{
mtx.lock();
// 当前在线主机id
cout << "当前在线主机id列表:" << endl;
for (auto e : online)
{
cout << e << " , ";
}
cout << endl;
cout << "当前离线主机id列表:" << endl;
for (auto e : offline)
{
cout << e << " , ";
}
mtx.unlock();
}
};
class Control
{
private:
Model model;
View view;
LoadBlance loadBlance;
public:
void RecoveryMachine()
{
loadBlance.onlineMachine();
}
bool AllQusetions(string *html)
{
bool ret = true;
vector<Question> q;
if (model.getAllQuestions(&q))
{
sort(q.begin(), q.end(), [](const Question &q1, const Question &q2)
{ return atoi(q1.number.c_str()) < atoi(q2.number.c_str()); });
view.AllExpendHtml(q, html);
}
else
{
*html = "获取题目失败，形成题目列表失败";
ret = false;
}
return ret;
}
bool OneQusetion(const string &id, string *html)
{
bool ret = true;
Question q;
if (model.getOneQuestion(id, &q))
{
view.OneExpendHtml(q, html);
}
else
{
*html = "获取指定题目" + id + "失败";
ret = false;
}
return ret;
}
void Judge(const string &id, const string &inJson, string *outJson)
{
Question q;
model.getOneQuestion(id, &q);
Json::CharReaderBuilder crb;
unique_ptr<Json::CharReader> cr(crb.newCharReader());
Json::Value inRoot;
cr->parse(inJson.c_str(), inJson.c_str() + inJson.size(), &inRoot, nullptr);
string code = inRoot["code"].asString();
Json::Value compileRoot;
compileRoot["input"] = inRoot["input"].asString();
compileRoot["code"] = code + "\n" + q.test_code;
compileRoot["cpu_limit"] = q.cpu_limit;
compileRoot["mem_limit"] = q.mem_limit;
Json::StreamWriterBuilder swb;
unique_ptr<Json::StreamWriter> sw(swb.newStreamWriter());
stringstream ss;
sw->write(compileRoot, &ss);
string compileString = ss.str();
// 选择负载最低的主机
// 一直选择，直到找到主机，否则全部挂掉
while (true)
{
int id = 0;
Machine *m;
if (!loadBlance.SmartChoice(&id, &m))
{
break;
}
// 客户端发起http请求，得到结果
httplib::Client cli(m->ip, m->port);
m->incrLoad();
LOG(INFO) << " 选择主机成功，主机id：" << id << " 详情：" << m->ip << ":" << m->port << "当前主机的负载是：" << m->getLoad() << "\n";
if (auto resp = cli.Post("/compile_and_run", compileString, "application/json;charset=utf-8"))
{
if (resp->status == 200)
{
*outJson = resp->body;
m->descLoad();
LOG(INFO) << " 请求编译和运行服务成功......"
<< "\n";
break;
}
else
{
// 请求失败
LOG(ERROR) << " 选择当前请求的主机的id：" << id << " 详情：" << m->ip << ":" << m->port << " 可能已经离线"
<< "\n";
loadBlance.offlineMachine(id);
loadBlance.showMachine();
}
}
}
}
};5. 打包成网络服务（ojServer）
#include <signal.h>
#include "ojControl.hpp"
static Control *con_ptr;
void Recovery(int signo)
{
con_ptr->RecoveryMachine();
}
int main()
{
signal(SIGQUIT, Recovery);
httplib::Server ser;
Control control;
con_ptr = &control;
// 获取所有题目内容
ser.Get("/all_questions", [&control](const httplib::Request &req, httplib::Response &resp)
{
string html;
// 返回一张包含所有题目的html网页
control.AllQusetions(&html);
// 用户看到的是什么？网页数据+拼上了题目相关的数据
resp.set_content(html,"text/html;charset=utf-8"); });
// 用户要根据题目编号，获取题目内容
ser.Get(R"(/question/(\d+))", [&control](const httplib::Request &req, httplib::Response &resp)
{
string html;
string id = req.matches[1];
control.OneQusetion(id, &html);
resp.set_content(html,"text/html;charset=utf-8"); });
ser.Post("/judge/(\\d++)", [&control](const httplib::Request &req, httplib::Response &resp)
{
string id = req.matches[1];
string result;
control.Judge(id,req.body,&result);
resp.set_content(resp.body,"application/json;charset=utf-8"); });
ser.set_base_dir("./wwwroot");
ser.listen("0.0.0.0", 8080);
}十、前端页面的设计
1. indx.html
当用户访问根目录时显示的网页
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>这是我的个人oj系统</title>
<style>
/*起手式：100%保证我们的样式设置可以不受默认影响*/
* {
margin: 0px;
/*消除网页的默认外边距*/
padding: 0px;
/*消除网页的默认内边距*/
}
html,
body {
width: 100%;
height: 100%;
}
.container .navbar{
width: 100%;
height: 50px;
background-color:black;
/* 给父级标签overflow，取消后续float带来的影响 */
overflow: hidden;
}
.container .navbar a{
/* 设置a标签是行内块元素，允许你设置宽度*/
display: inline-block;
/* 设置a标签的宽度，默认a标签是行内元素，无法设置宽度*/
width: 80px;
/* 设置字体的颜色 */
color: white;
/* 设置字体的大小 */
font-size: large;
/* 设置文字的高度和导航栏一样的高度 */
line-height: 50px;
/* 去掉a标签的下划线 */
text-decoration: none;
/* 设置a标签的文字居中 */
text-align: center;
}
/* 设置鼠标事件 */
.container .navbar a:hover{
background-color:green;
}
/* 设置浮动 */
.container .navbar .login{
float:right;
}
.container .content {
/* 设置标签的宽度 */
width: 800px;
/* background-color: #ccc; */
/* 整体居中 */
margin: 0px auto;
/* 设置文字居中 */
text-align: center;
/* 设置上外边距 */
margin-top: 200px;
}
.container .content .front_ {
/* 设置标签为块级元素，独占一行，可以设置高度宽度等属性 */
display: block;
/* 设置每个文字的上外边距 */
margin-top: 20px;
/* 去掉a标签的下划线 */
text-decoration: none;
}
</style>
</head>
<!-- <body background="C:\Users\MLG\Desktop\壁纸.jpg"> -->
<body background="./壁纸.jpg">
<div class="container">
<!--导航栏-->
<div class="navbar">
<a href="/">首页</a>
<a href="/all_questions">题库</a>
<a href="#">竞赛</a>
<a href="#">讨论</a>
<a href="#">求职</a>
<a class="login" href="#">登录</a>
</div>
<!--网页的内容-->
<div class="content">
<h1 class="front_">欢迎来到我的Online_Judge平台</h1>
<a class="front_" href="/all_questions">点击我开始编程啦！</a>
</div>
</div>
</body>
</html>2. all_questions.html
当用户获取题目列表的时候显示的网页
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>在线OJ-题目列表</title>
<style>
/*起手式：100%保证我们的样式设置可以不受默认影响*/
* {
margin: 0px;
/*消除网页的默认外边距*/
padding: 0px;
/*消除网页的默认内边距*/
}
html,
body {
width: 100%;
height: 100%;
}
.container .navbar {
width: 100%;
height: 50px;
background-color: black;
/* 给父级标签overflow，取消后续float带来的影响 */
overflow: hidden;
}
.container .navbar a {
/* 设置a标签是行内块元素，允许你设置宽度*/
display: inline-block;
/* 设置a标签的宽度，默认a标签是行内元素，无法设置宽度*/
width: 80px;
/* 设置字体的颜色 */
color: white;
/* 设置字体的大小 */
font-size: large;
/* 设置文字的高度和导航栏一样的高度 */
line-height: 50px;
/* 去掉a标签的下划线 */
text-decoration: none;
/* 设置a标签的文字居中 */
text-align: center;
}
/* 设置鼠标事件 */
.container .navbar a:hover {
background-color: green;
}
.container .navbar .login{
float: right;
}
.container .question_list {
padding-top: 50px;
width: 800px;
height: 600px;
margin: 0px auto;
/* background-color: #ccc; */
text-align: center;
}
.container .question_list table {
width: 100%;
font-size: large;
font-family:'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
margin-top: 50px;
background-color: #c6cbcc;
}
.container .question_list h1{
color: green;
}
.container .question_list table .item{
width: 100px;
height: 40px;
font-size: large;
font-family:'Times New Roman', Times, serif;
}
.container .question_list table .item a{
text-decoration: none;
color:black;
}
.container .question_list table .item a:hover{
color: blue;
text-decoration: underline;
}
</style>
</head>
<body>
<div class="container">
<div class="navbar">
<!--导航栏-->
<div class="navbar">
<a href="/">首页</a>
<a href="/all_questions">题库</a>
<a href="#">竞赛</a>
<a href="#">讨论</a>
<a href="#">求职</a>
<a class="login" href="#">登录</a>
</div>
</div>
<div class="question_list">
<h1>Online_Judge题目列表</h1>
<table>
<tr>
<th class="item">编号</th>
<th class="item">标题</th>
<th class="item">难度</th>
</tr>
{{#question_list}}
<tr>
<td class="item">{{number}}</td>
<td class="item"><a href="/question/{{number}}">{{title}}</a></td>
<td class="item">{{star}}</td>
</tr>
{{/question_list}}
</table>
</div>
</div>
</body>
</html>3. one_question.html
当用户获取单道题目所显示的网页
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>{{number}}.{{title}}</title>
<!-- 引入ACE CDN -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.6/ace.js" type="text/javascript"
charset="utf-8"></script>
<!-- 引入语法 -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.6/ext-language_tools.js" type="text/javascript"
charset="utf-8"></script>
<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
<style>
* {
margin: 0;
padding: 0;
}
html,
body {
width: 100%;
height: 100%;
}
.container .navbar {
width: 100%;
height: 50px;
background-color: black;
/* 给父级标签overflow，取消后续float带来的影响 */
overflow: hidden;
}
.container .navbar a {
/* 设置a标签是行内块元素，允许你设置宽度*/
display: inline-block;
/* 设置a标签的宽度，默认a标签是行内元素，无法设置宽度*/
width: 80px;
/* 设置字体的颜色 */
color: white;
/* 设置字体的大小 */
font-size: large;
/* 设置文字的高度和导航栏一样的高度 */
line-height: 50px;
/* 去掉a标签的下划线 */
text-decoration: none;
/* 设置a标签的文字居中 */
text-align: center;
}
/* 设置鼠标事件 */
.container .navbar a:hover {
background-color: green;
}
.container .navbar .login {
float: right;
}
.container .part1 {
width: 100%;
height: 600px;
overflow: hidden;
}
.container .part1 .left_desc {
width: 50%;
height: 600px;
float: left;
overflow: scroll;
/* 添加滚动条*/
}
.container .part1 .left_desc h3 {
padding-top: 10px;
padding-left: 10px;
}
.container .part1 .left_desc pre {
padding-top: 10px;
padding-left: 10px;
font-size: medium;
font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
}
.container .part1 .right_code {
width: 50%;
float: right;
}
.container .part1 .right_code .ace_editor {
height: 600px;
}
.container .part2 {
width: 100%;
overflow: hidden;
}
.container .part2 .result {
width: 300px;
float: left;
}
.container .part2 .btn-submit {
width: 100px;
height: 30px;
margin-top: 1px;
margin-right: 1px;
font-size: large;
float: right;
background-color: #26bb9c;
color: #FFF;
border-radius: 1ch;
/* 给按钮带圆角*/
border: 0px;
}
.container .part2 button:hover {
color: green;
}
.container .part2 .result{
margin-top: 15px;
margin-left: 15px;
}
.container .part2 .result pre{
font-size: larger;
}
</style>
</head>
<body>
<div class="container">
<div class="navbar">
<a href="/">首页</a>
<a href="/all_questions">题库</a>
<a href="#">竞赛</a>
<a href="#">讨论</a>
<a href="#">求职</a>
<a class="login" href="#">登录</a>
</div>
<!-- 左右呈现，题目描述和预设代码 -->
<div class="part1">
<div class="left_desc">
<h3><span id="number">{{number}}</span>.{{title}}.{{star}}</h3>
<pre>{{desc}}</pre>
</div>
<div class="right_code">
<pre id="code" class="ace_editor"><textarea class="ace_text-input">{{pre_code}}</textarea></pre>
</div>
</div>
<!-- 提交结果并显示 -->
<div class="part2">
<div class="result"></div>
<button class="btn-submit" onclick="submit()">提交代码</button>
</div>
</div>
<script>
//初始化对象
editor = ace.edit("code");
//设置风格和语言（更多风格和语言，请到github上相应目录查看）
// 主题大全：http://www.manongjc.com/detail/25-cfpdrwkkivkikmk.html
editor.setTheme("ace/theme/monokai");
editor.session.setMode("ace/mode/c_cpp");
// 字体大小
editor.setFontSize(16);
// 设置默认制表符的大小:
editor.getSession().setTabSize(4);
// 设置只读（true时只读，用于展示代码）
editor.setReadOnly(false);
// 启用提示菜单
ace.require("ace/ext/language_tools");
editor.setOptions({
enableBasicAutocompletion: true,
enableSnippets: true,
enableLiveAutocompletion: true
});
function submit() {
// 1. 收集当前页面的有关数据：1.题号 2.代码我们采用JQuery
// console.log("哈哈！");
var code = editor.getSession().getValue();
//console.log(code);
var number = $(".container .part1 .left_desc h3 #number").text();
//console.log(number);
var judge_url = "/judge/" + number;
console.log(judge_url);
// 2. 构建json，并向后台发起基于http的json请求
$.ajax({
method: 'Post', //向后端发起请求的方式（post、get）
url: judge_url, //向后端指定的url发起请求
dataType: 'json', //告知server，我们需要什么格式
contentType: 'application/json;charset=utf-8', //告知server我给你的是什么格式
data: JSON.stringify({
'code': code,
'input': ''
}),
success: function (data) {
//成功得到结果
//console.log(data);
show_result(data);
}
});
// 3. 得到结果，解析并显示到result中
function show_result(data) {
// console.log(data.status);
// console.log(data.reason);
// 拿到result结果标签
var result_div = $(".container .part2 .result");
// 清空上一次的运行结果
result_div.empty();
// 首先拿到结果的状态码和原因结果
var _status = data.status;
var _reason = data.reason;
var reson_lable = $("<p>",{
text: _reason
});
reson_lable.appendTo(result_div);
if (status == 0) {
// 请求是成功的，编译运行没出问题，但是结果是否通过看测试用例的结果
var _stdout = data.stdout;
var _stderr = data.stderr;
var reson_lable = $("<p>",{
text: _reason
});
var stdout_lable = $("<pre>",{
text: _stdout
});
var stderr_lable = $("<pre>",{
text: _stderr
});
stdout_lable.appendTo(result_div);
stderr_lable.appendTo(result_div);
} else {
}
}
}
</script>
</body>
</html>
