用C#写前端-Blazor框架简介

发表于 2021-10-13 更新于 2021-10-14 分类于杂项

什么是Blazor

MSDN¹中的定义十分贴切, 此处照搬过来:

Blazor 是一个使用 .NET 生成交互式客户端 Web UI 的框架：
使用 C# 代替 JavaScript 来创建信息丰富的交互式 UI。
共享使用 .NET 编写的服务器端和客户端应用逻辑。
将 UI 呈现为 HTML 和 CSS，以支持众多浏览器，其中包括移动浏览器。
与新式托管平台（如 Docker）集成。

不严谨地说, Blazor就是用C#部分代替JavaScript来写前端.

阅读全文 »

题解【P1953】易语言

发表于 2021-07-25 分类于题解

题面

https://www.luogu.com.cn/problem/P1953

基本思路

很显然就是一个字符串处理的模拟题, 说到字符串, ~~就想到美国人的算法, 就想到今年下半年,~~ 正则表达式 是一个常用工具, 而 C++ 11 中引入了对正则表达式的支持(在 <regex> 中), 我们可以用正则表达式进行匹配与替换.

原生字符串

这是 C++11 中引入的语法糖, 格式为 R"(A_String)" , A_String 的字面值会被原封不动的保存, 这样我们的正则表达式中就不用每次都用 \\ 来转义了.

regex的使用

出门右拐 CppReference:

https://zh.cppreference.com/w/cpp/header/regex

网络上也有很多介绍, 在此就不赘述了.

注意:

smatch 的 str() 函数, 参数为 0 时返回的是匹配的整个串.

阅读全文 »

如何实现C++代码在线运行

发表于 2021-06-08 分类于杂项

核心部分-Coliru

Coliru是一个支持自定义命令行的在线编译器.

值得一提的是官方FAQ中给的示例代码还是http请求, 使用前应该替换成https.

语法高亮-ace.js

参考资料: 利用ace.js编写一个JavaScript编辑器(带智能补全)

需要指出的是文章存在一些问题

var text = document.getElementById('editor').innerText; 
/*存在只能获取可见部分的问题, 实际上ace.js提供了直接获取代码的方法, 无需处理行号
例: var code = editor.getSession().getValue();
*/
var ctext = "<script>"+text.replace(/\d\n/g, "")+'<\/script>'; 
//正则只能匹配一位数字, 应该改成/\d{1,}\n/g

传送门

在线运行C++代码

发表于 2021-06-08 更新于 2023-04-14 分类于杂项

由于换了渲染器, 不支持内嵌HTML了, 以下是源码:

点我查看完整代码

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

<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>Coliru_Run_Code_Online</title>
</head>
<style type="text/css" media="screen">
    .main {
        float: left;
        width: 100%;
    }
    #editor {
        display: block;
        margin-left: auto;
        margin-right: auto;
        padding: 1em;
        padding-bottom: 30%;
    }
    .box {
        font-family: "Consolas", Helvetica, sans-serif;
        margin-left: auto;
        margin-right: auto;
        padding: 1em;
        background-color: #272822;
        color: aliceblue;
    }
</style>

<body>
    <div class="main">
        <div style="display: block;">
            <div class="version" style="float: left; display: inline-block;">
                <select id="version">
                    <option value="c++98">C++</option>
                    <option value="c++11" selected = "selected">C++11</option>
                    <option value="c++14">C++14</option>
                    <option value="c++17">C++17</option>
                    <option value="c++20">C++20</option>
                </select>
            </div>
            <div style="float: left; display: inline-block;">
                <button type="button" onclick="getOutput()">Run It!</button>
            </div>
            <div style="float: right; display: inline-block;">
                <span>Powered by <a href="https://coliru.stacked-crooked.com/">Coliru</a> online compiler</span>
            </div>
        </div>
        <br />
        <div id="editor"></div>
        <h3>Input: </h3>
        <div id="inputBox" contenteditable="true" class="box"></div>
        <h3>Output: </h3>
        <div id="outputBox" contenteditable="true" class="box"></div>
    </div>
    <script src="https://cdn.bootcdn.net/ajax/libs/ace/test/ace.js"></script>
    <script type="text/javascript">
        ace.require("ace/ext/language_tools");
        var editor = ace.edit("editor");
        editor.setTheme("ace/theme/monokai");//monokai模式是自动显示补全提示
        editor.getSession().setMode("ace/mode/c_cpp");//语言
        editor.setFontSize(16);
        editor.session.setTabSize(4);
        function stdVersion() {
            var version = document.getElementById("version").value;
            return version;
        }
        function getOutput() {
            var code = editor.getSession().getValue();
            var output = document.getElementById("outputBox");
            var inputData = document.getElementById("inputBox").innerText;
            var http = new XMLHttpRequest();
            http.open("POST", "https://coliru.stacked-crooked.com/compile", false);
            http.send(JSON.stringify({ "cmd": "g++ -std=" + stdVersion() + " -O2 -Wall main.cpp && ./a.out << EOF\n" + inputData + "\nEOF", "src": code}));
            output.innerText = http.response;
            //document.getElementById("TestBox").innerText = text;
            /*alert(code);
            alert(inputData);
            alert(output.innerText);*/
        }
    </script>
</body>
</html>