Windows系统使用Python Flask制作Web网站并结合内网穿透公网访问

文章目录

• • 前言
  • 1. 安装部署Flask并制作SayHello问答界面
  • 2. 安装Cpolar内网穿透
  • 3. 配置Flask的问答界面公网访问地址
  • 4. 公网远程访问Flask的问答界面

    前言

    Flask是一个Python编写的Web微框架，让我们可以使用Python语言快速实现一个网站或Web服务，本期教程我们使用Python Flask搭建一个web问答应用程序框架，并结合cpolar内网穿透工具将我们的应用程序发布到公共网络上，实现可多人远程进入到该web应用程序访问。

    在操作上我们将使用HTML来创建网页的结构，然后使用css设计这个结构并且使其看起来更漂亮，此外还会利用Javascript与页面上的不同元素进行交互，最后使用python与web服务器（也成为后端）进行连接。

    1. 安装部署Flask并制作SayHello问答界面

    本篇文章代码使用 Python3 运行

    安装环境：需要在电脑上安装 Python3 和 pip3。建议安装最新版本

    检查是否有安装了pip的可用Python，查看Python和pip版本：

    C:> py --version
    Python 3.N.N
    C:> py -m pip --version
    pip X.Y.Z from ... (python 3.N.N)
    

    使用pip安装和更新：

    $ pip install -U Flask
    

    创建环境：

    conda create -n SAYHELLO python=3.10
    

    激活环境：

    conda activate SAYHELLO
    

    创建项目目录：

    mkdir SAYHELLO
    

    进入到创建的目录：

    cd SAYHELLO
    

    在当前目录启动VS Code：

    code .
    

    在SAYHELLO文件夹下新建两个附加文件夹，一个名为templates储存html文件的位置，

    另一个名为static文件夹，下面新建一个名为css的文件夹。

    在css文件夹下新建一个名为main.css的文件，

    body {
        text-align: center;
        background-color: SlateGrey;
    }
    p {
        color: white;
        font-family: Shanti;
        font-size: 1.2em;
        display: inline-block;
        margin:  20px;
    }
    img {
        margin: 60px 0 30px 0;
        width: 250px;
    }
    input {
      width: 300px;
      margin: 20px 20px;
      height: 50px;
      border: none;
      border-radius: 10px;
      font-family: Shanti;
      font-size: 1.3em;
      text-align: center;
    }
    input:focus {
        outline: none;
        border: solid 5px #00FFCE;
    }
    #greet {
        background-color: PaleVioletRed;
        border:  none;
        width:  200px;
        color: white;
    }
    #greet:hover {
        background-color: MediumVioletRed;
    }
    

    在templates文件夹里新建一个名为index.html的文件，

    
    
        
        Say Hello