PHP 实现 PHP在线代码运行工具

李耀光 · 发表于 2021-4-13 10:02:00

demo源码下载：点击下载

HTML代码（index.html）：

注：代码编撰区域使用开源项目 ACE (Ajax.org Cloud9 Editor) 实现

<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>PHP在线代码编辑器</title>
    <script src="./ace-build/ace.js" type="text/javascript" charset="utf-8"></script>
    
    <style type="text/css">
        html, body
        {
            height: 100%;
        }
        
        *
        {
            margin: 0px; padding: 0px;
        }
        
        #main
        {
            height: calc(100% - 50px);
        }
        
        #editor, #wall, #result
        {
            width: calc(50% - 30px); height: 100%; font-size: 14px; float: left;
        }
        
        #wall
        {
            width: 30px; background-color: #FBF1D3;
        }
        
        #result
        {
            height: calc(100% - 10px); padding: 5px; overflow-y: auto;
        }
        
        #header, #header-left, #header-right
        {
            height: 50px; line-height: 50px; background-color: #FBF1D3; float: left;
        }
        
        #header
        {
            width: 100%;
        }
        
        #header-left
        {
            width: 50%; font-size: 18px; text-align: center;
        }
        
        #btn
        {
            padding: 3px 5px; margin: 10px 30px 5px 0; line-height: 17px; cursor: pointer; float: right;
        }
    </style>
</head>
<body>
    <div id="header">
        <div id="header-left">
            XMSB — PHP在线代码运行工具
            
            <button type="button" id="btn">执行代码 [RUN]</button>
        </div>
    </div>
    
    <div id="main">
        <div id="editor"></div>
        <div id="wall"></div>
        <div id="result"></div>
    </div>
    
    <script type="text/javascript">
        var editor = ace.edit("editor");
        editor.setTheme("ace/theme/solarized_light");
        editor.session.setMode("ace/mode/php");
        
        editor.setValue("<?php \n\t$xmsb = 'PHP在线代码运行工具';\n\techo $xmsb;", 1);
    </script>
    
    <script type="text/javascript">
        var btn = document.getElementById('btn');
        btn.onclick = function()
        {
            var xhr = null;
            if(window.XMLHttpRequest)
            {
                xhr = new XMLHttpRequest();
            }
            else if(window.ActiveXObject)
            {
                xhr = new ActiveXObject('Microsoft.XMLHTTP');
            }
            
            xhr.onreadystatechange = function()
            {
                if(xhr.readyState == 4 && xhr.status == 200)
                {
                    document.getElementById('result').innerHTML = xhr.response;
                }
            }
            
            xhr.open('POST', `run.php`, true);
            xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
            xhr.send('code=' + editor.getValue());
        }
    </script>
</body>
</html>

PHP代码（run.php）：

<?php
ini_set('display_errors', 0);
ini_set('xdebug.overload_var_dump', '1');

error_reporting(E_ALL);
set_error_handler('handle_error');
set_exception_handler('handle_exception');
register_shutdown_function('shutdown_function');

function handle_error($error_level, $error_message, $error_file, $error_line, $error_context)
{
    ob_end_clean();
    echo "[第" . $error_line . "行] " . "发生错误：" . $error_message;
    die();
}

function handle_exception($exception)
{
    ob_end_clean();
    echo "[第" . $exception -> getLine() . "行] " . "发生错误：" . $exception -> getMessage();
    die();
}

function shutdown_function()
{
    $error = error_get_last();
    if(!empty($error))
    {
        ob_end_clean();
        echo "[第" . $error['line'] . "行] " . "发生错误：" . $error['message'];
        die();
    }
}

if(!empty($_POST))
{
    $code = trim($_POST['code'], "<?php");
    
    ob_start();
    eval($code);
    $output = ob_get_contents();
    ob_end_clean();
    
    echo $output;
}

PHP 实现 PHP在线代码运行工具

浏览过的版块