实现一个python代码编辑器

          monaco.languages.registerCompletionItemProvider('python', {
				provideCompletionItems: function () {
					let suggestions = [];
					// 这个keywords就是python.js文件中有的
					pythonLanguage.keywords.forEach(item => {
						suggestions.push({
							label: item,
							kind: monaco.languages.CompletionItemKind.Keyword,
							insertText: item
						});
					})
					return {
						// 最后要返回一个数组
						suggestions:suggestions
					};
			  },
		  });

下一步的计划是显示网页，尝试了几个不同的方法。这几个方法怎么说呢，都可以显示html，但是上一步的编译出来的html其实还要带文件夹一起，感觉文件大小有点大，对于一个项目来说，不是一个很好的选择。

qt的QWebEngineView类

qt有一个类，QWebEngineView可以用来显示html，具体用法就是用load函数，传入html的路径。

【注意】这里的html是上一步的文件build后生成在dist文件里的html，要把整个dist文件夹拷过来放在qt的运行目录里。

    MonacoEditor w;
    QWebEngineView view(&w);
    QString path = QApplication::applicationDirPath() + "/dist/index.html";
    view.load(QUrl(path));
    w.setCentralWidget(&view);
    w.show();

python的flask

flask是python的一个Web 框架。下面的代码是网上教程看的。用flask可以装一个pycharm。

from flask import  Flask,render_template
app=Flask(__name__)         #实例化并命名为app实例
#启动这个WEB服务
@app.route('/')
def index():
    msg = "hello world"
    #在文件目录下创建Templates文件夹，里面新建index.html
    return render_template("index.html",data = msg)  # 加入变量传递  
    
if __name__=="__main__":
    app.run(port=8088,host="127.0.0.1",debug=True)

更新：html作为前端，绑定端口8080，flask作为后端，绑定端口为8088。现在开始思考怎么让后端获取到前端输入的python代码。

bug1：跨域支持

在尝试过程中，html使用XMLHttpRequest，用GET发送内容，但是对应的status是0，responseText是空。进入html按F12进入终端发现下面报错。就是跨域失败，网上有的说前端加header["Access-Control-Allow-Origin","*"];，但对我这个来说没有用，这里使用flask的跨域支持可以参考下面这个博客，使用flask_cors模块，问题成功解决。[736]Flask - 解决Access-Control-Allow-Origin跨域请求问题_flask make_response no 'access-control-allow-origi-优快云博客

在终端输入 pip install -U flask-cors，安装cors，然后再py文件中加入即可。

from flask import  Flask,render_template,request
from flask_cors import CORS
app=Flask(__name__)         #实例化并命名为app实例

# 跨域支持
CORS(app)

再html点击运行按钮，发现status状态已经是200，表示请求成功。

bug2：XMLHttpRequest 没有把数据send过去

刚解决完bug1，bug2就来了，一坑接一坑。

后端收到的数据一直是None，百度上说法也挺多。有人说是前端的参数类型和后端的参数类型不匹配，有人说在前端加XMLHttpRequest.setRequestHeader("Content-type","application/json");，有人说是访问一个不存在的网页或者输入了一个错误的网址，也有可能是服务器的配置。

我这个是点击后端生成的网页发现不存在。后面发现时因为我的后端def index（）函数没有return，加个return返回值就行了。

bug3：执行exec函数 name 'xx' is not defined

这里返回的是标准输出。单单的print函数是没问题的，但是稍微复杂一点就会出现问题，会提示name 'xx' is not defined。

在网上找一个简单的python代码测试

# 定义两个列表
list1 = [1, 2, 3, 4, 5]
list2 = [4, 5, 6, 7, 8]

# 使用列表推导式找出两个列表中不同的元素
difference = [item for item in list1 if item not in list2]
print(difference)

后端收到的内容是这样的