若想自己搭建网站但又不想花费大量资金购买服务器或依赖大平台，那么学会在个人服务器上运行程序就显得尤为重要。今天我们来讨论一下如何在 VS Code 中使用 SSH 连接到服务器，运用 Flask 框架完成数据绑定，以及让程序保持运行的方法。
pip install flask
项目准备搭建
<html>
<h1>Hello Word!</h1>
</html>
启动这个项目，得先通过SSH在个人服务器上用VS Code建立连接。之后，在项目文件夹里创建一个叫作templates的文件夹，用来存放HTML文件等资料。紧接着，再新建一个app.py文件。这个过程就像盖房子得先打好地基，这一步是至关重要的，为接下来的开发工作奠定了基础。完成这些步骤后，我们就拥有了开发所需的基本框架。
from flask import Flask, render_template, request, jsonify
#创建Flask对象app并初始化
app = Flask(__name__)
#通过python装饰器的方法定义路由地址
@app.route("/")
#定义方法 用jinjia2引擎来渲染页面，并返回一个index.html页面
def root():
return render_template("index.html")
#定义app在8080端口运行
app.run(port=8080)
HTML 文件创建
在“templates”文件夹里，新建一个“index.html”文件。请按照您的需要来编写内容。这段代码主要是用来构建网页的基础结构，就像房子的墙壁一样，有了它，网页的基本轮廓就能显现。之后，你还可以继续加入更多的功能和组件。
app.py 文件编写
在 app.py 文件里编写代码。这些代码必须依照 Flask 框架的要求来写。这就像搭建房屋时布置水电线路，把各个部分连接起来，保证网页能流畅运作。代码写好后，按 F5 键启动程序，终端会展示程序的运行状态。
from flask import Flask, render_template, request, jsonify
#创建Flask对象app并初始化
app = Flask(__name__)
#通过python装饰器的方法定义路由地址
@app.route("/")
#定义方法 用jinjia2引擎来渲染页面，并返回一个index.html页面
def root():
return render_template("index.html",name="zxy",age=21)
#定义app在8080端口运行
app.run(port=8080)
<html>
<h1>我是{{name}},今年{{age}}岁</h1>
</html>
数据绑定原理
数据绑定技术使得后端数据变化时，前端页面能够实现同步更新。在 Flask 框架中，这一过程具体如下：后端先加载网页，再将数据放置到适当的位置。随后，通过 Jinjia2 引擎完成页面渲染。最终，将渲染好的页面发送回用户。打个简单的例子，就好比你在电脑上修改了数据，网页上马上就能看到这些变化。这种方式让用户能够实时查看最新信息，从而提高了使用感受。
数据提交步骤
先在前端页面引入 jQuery 库，并创建两个输入框和一个按钮，它们用于输入信息并启动提交过程。然后，利用 JavaScript 的 Ajax 功能来传输数据。在后端的 app.py 文件里，编写处理这些数据的函数。这相当于你发送了一条消息，后端需要有相应的“接收者”来处理这条信息。处理完毕后，数据便能在前后端间顺畅流通。
<html>
<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<h1>请输入你的姓名和年龄</h1>
<input type="text" id="name" name="name" placeholder="姓名">
<br>
<input type="text" id="age" name="age" placeholder="年龄">
<br>
<button onclick="submit();">提交</button>
<script>
/*在这里编写submit()事件*/
function submit() {
$.ajax({
url: "submit", /*数据提交到submit处*/
type: "POST", /*采用POST方法提交*/
data: { "name": $("#name").val(),"age":$("#age").val()}, /*提交的数据（json格式），从输入框中获取*/
/*result为后端函数返回的json*/
success: function (result) {
if (result.message == "success!") {
alert(result.message+"你的名字是"+result.name+",你的年龄是"+result.age)
}
else {
alert(result.message)
}
}
});
}
</script>
</html>
页面测试与功能扩展
数据通过Ajax提交完成，接下来要对8080端口的服务器进行检测。如果没有发现异常，就在templates文件夹里建立一个名为data.html的文件，用它来搭建新的网页。然后在app.py文件里，编写两个函数，一个用于展示data.html页面，另一个用于处理相关事件。这个过程就像给房子加盖一层，目的是为了增加更多功能。在创建应用对象和指定运行端口时，务必注意，要把这两个函数插入到这两个步骤之间。
from flask import Flask, render_template, request, jsonify
#创建Flask对象app并初始化
app = Flask(__name__)
#通过python装饰器的方法定义路由地址
@app.route("/")
#定义方法 用jinjia2引擎来渲染页面，并返回一个index.html页面
def root():
return render_template("index.html")
#app的路由地址"/submit"即为ajax中定义的url地址，采用POST、GET方法均可提交
@app.route("/submit",methods=["GET", "POST"])
#从这里定义具体的函数 返回值均为json格式
def submit():
#由于POST、GET获取数据的方式不同，需要使用if语句进行判断
if request.method == "POST":
name = request.form.get("name")
age = request.form.get("age")
if request.method == "GET":
name = request.args.get("name")
age = request.args.get("age")
#如果获取的数据为空
if len(name) == 0 or len(age) ==0:
return {'message':"error!"}
else:
return {'message':"success!",'name':name,'age':age}
#定义app在8080端口运行
app.run(port=8080)
后台运行处理
运行Python程序时，按F5键即可。不过，一旦关闭VS Code，页面就会不见了。在这种情况下，可以在服务器上通过执行screen命令来开启一个后台任务。接着，把app.py文件放入后台运行。程序就可以持续工作了。要在工程文件目录下启动程序，只需输入相应的命令即可。如果想要查看后台程序的运行状态，可以使用screen -x命令。停止或移除后台程序也有对应的操作步骤。这样程序就能一直跑，不受 VS Code 开关影响。
在使用自家的服务器运行程序时，你是否曾遭遇过难题？别忘了点赞和分享给更多人！
import pymysql
class Database:
#设置数据库的连接参数，由于我是在服务器中编写的，所以host是localhost
host = "localhost"
user = "root"
password = "Zhangxy0212!!"
#类的构造函数，参数db为欲连接的数据库。该构造函数实现了数据库的连接
def __init__(self,db):
connect = pymysql.connect(host=self.host,user=self.user,password=self.password,database=db)
self.cursor = connect.cursor()
#类的方法，参数command为sql语句
def execute(self, command):
try:
#执行command中的sql语句
self.cursor.execute(command)
except Exception as e:
return e
else:
#fetchall()返回语句的执行结果，并以元组的形式保存
return self.cursor.fetchall()