在web中使用ACE Editor for Java语言_Java_Ace Editor

在web中使用ACE Editor for Java语言

java

在web中使用ACE Editor for Java语言,java,ace-editor,Java,Ace Editor,我希望制作一个像ideone.com这样的在线java编辑器我想用它来做我的工具。我使用了codeditor.session.setMode（“ace/mode/java”）；但我的工具仍然不编译java语言到目前为止，我的代码是： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name=

我希望制作一个像ideone.com这样的在线java编辑器

我想用它来做我的工具。我使用了codeditor.session.setMode（“ace/mode/java”）；但我的工具仍然不编译java语言

到目前为止，我的代码是：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="lib/css/editor-styles.css">
    <title>Online Test</title>
</head>

<body>
    <div class="editor">
        <div class="editor__wrapper">
            <div class="editor__body">
                <div id="editorCode" class="editor__code"></div>
            </div>
            <div class="editor__footer">
                <div class="editor__footer--left">
                    <button class="editor__btn editor__run">Run ></button>
                    <button class="editor__btn editor__reset">Reset ></button>
                </div>
                <div class="editor__footer--right">
                    <div class="editor__console">
                        <ul class="editor__console-logs"></ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Required Ace Libraries -->
    <script src="lib/js/ace-editor/src-min/ace.js"></script>
    <script src="lib/js/ace-editor/src-min/mode-javascript.js"></script>
    <script src="lib/js/ace-editor/src-min/ext-language_tools.js"></script>

    <!-- Custom Scripts -->
    <script src="lib/js/editor.js"></script>
    <script src="lib/js/editor-console.js"></script>
</body>

</html>

// Retrieve Elements
const consoleLogList = document.querySelector('.editor__console-logs');
const executeCodeBtn = document.querySelector('.editor__run');
const resetCodeBtn = document.querySelector('.editor__reset');

Ace是一个编辑器，而不是编译器。您不能使用它来编译代码。

Ideone使用球体引擎编译器编译

请参阅本文档：

如何向其添加编译功能

假设。。。让编辑器将源代码发送到安装了Java编译器的服务器，然后运行它

如果应用程序的服务器端是用Java实现的，那么可以使用Java的运行时编译API。看见（跳过关于加载和运行编译后的代码的部分……除非您也想这样做。）

是的，文本编辑器不会编译代码；编译器可以做到这一点。您链接到的ACE网站有一个功能列表；你看到那里的编译了吗？@kaya3，如何添加编译功能？

// Setup Ace
let codeEditor = ace.edit("editorCode");
let defaultCode = 'console.log("Editor")';
let consoleMessages = [];

let editorLib = {
    clearConsoleScreen() {
        consoleMessages.length = 0;

        // Remove all elements in the log list
        while (consoleLogList.firstChild) {
            consoleLogList.removeChild(consoleLogList.firstChild);
        }
    },
    printToConsole() {
        consoleMessages.forEach(log => {
            const newLogItem = document.createElement('li');
            const newLogText = document.createElement('pre');

            newLogText.className = log.class;
            newLogText.textContent = `> ${log.message}`;

            newLogItem.appendChild(newLogText);

            consoleLogList.appendChild(newLogItem);
        })
    },
    init() {
        // Configure Ace

        // Theme
        codeEditor.setTheme("ace/theme/monokai");

        // Set language
        codeEditor.session.setMode("ace/mode/java");


        // Set Options
        codeEditor.setOptions({
            fontFamily: 'Inconsolata',
            fontSize: '12pt',
            enableBasicAutocompletion: true,
            enableLiveAutocompletion: true,
        });

        // Set Default Code
        codeEditor.setValue(defaultCode);
    }
}

// Events
executeCodeBtn.addEventListener('click', () => {
    // Clear console messages
    editorLib.clearConsoleScreen();
    
    // Get input from the code editor
    const userCode = codeEditor.getValue();

    // Run the user code
    try {
        new Function(userCode)();
    } catch (err) {
        console.error(err);
    }

    // Print to the console
    editorLib.printToConsole();
});

resetCodeBtn.addEventListener('click', () => {
    // Clear ace editor
    codeEditor.setValue(defaultCode);

    // Clear console messages
    editorLib.clearConsoleScreen();
})

editorLib.init();