embedHttpLua/index.html at main · TTHHR/embedHttpLua · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Lua 实时调试控制台</title>
    <style>
        body { font-family: sans-serif; margin: 20px; background: #f4f4f9; }
        .container { max-width: 800px; margin: auto; }
        textarea {
            width: 100%; height: 300px;
            font-family: 'Courier New', monospace;
            background: #272822; color: #f8f8f2;
            padding: 10px; border-radius: 5px;
        }
        .controls { margin-top: 10px; display: flex; gap: 10px; align-items: center; }
        button { padding: 10px 20px; cursor: pointer; background: #007bff; color: white; border: none; border-radius: 4px; }
        button:hover { background: #0056b3; }
        #status { margin-top: 10px; font-weight: bold; }
    </style>
</head>
<body>
    <div class="container">
        <h2>Lua 脚本在线编辑器</h2>

        <div class="controls">
            <label>从文件加载: </label>
            <input type="file" id="fileInput" accept=".lua" />
        </div>

        <br>
        <textarea id="editor" placeholder="在此编写 Lua 脚本..."></textarea>

        <div class="controls">
            <button onclick="executeScript()">上传并执行</button>
            <span id="status"></span>
        </div>
    </div>

    <script>
        const fileInput = document.getElementById('fileInput');
        const editor = document.getElementById('editor');
        const status = document.getElementById('status');

        // 读取本地文件到编辑器
        fileInput.addEventListener('change', (e) => {
            const file = e.target.files[0];
            if (!file) return;
            const reader = new FileReader();
            reader.onload = (e) => {
                editor.value = e.target.result;
            };
            reader.readAsText(file);
        });

        // 将编辑器内容发送到后端
        async function executeScript() {
            status.innerText = "执行中...";
            try {
                const response = await fetch('/upload', {
                    method: 'POST',
                    headers: { 'Content-Type': 'text/plain' },
                    body: editor.value
                });
                const result = await response.text();
                status.innerText = "服务器返回: " + result;
            } catch (err) {
                status.innerText = "请求失败: " + err;
            }
        }
    </script>
</body>
</html>