准备工作

  • Visual Studio Code
  • mySQL+DBeaver(已连接,具体连接可参考http://t.csdnimg.cn/7U7Oj)另外不用可视化工具DBeaver,可下载vscode插件mysql连接MySQL
  • DevEco Studio

    python连接数据库

    安装(终端运行安装)
    pip install pymysql==1.0.2
    pip install flask
    pip install requests
    pip install flask_cors
    直接看代码(python后端代码)

    使用flask创建了一个应用实例,包含两个路由,一个用于发送到前端,一个用于接收前端的数据。

    #导入需要的模块
    #用于构建 Web 应用程序。这段代码中导入了 Flask、request 和 jsonify,其中 Flask 是主要的模块,
    #request 用于处理 HTTP 请求对象,
    import json
    import logging
    from flask import Flask, request, jsonify
    from flask_cors import CORS
    #用于连接和操作 MySQL 数据库。通过这个库,在 Python 程序中执行 SQL 语句、插入、更新和删除数据等操作。
    import pymysql
    #用于发送 HTTP 请求并处理响应
    import requests
    # 连接数据库
    conn = pymysql.connect(host='127.0.0.1', # 连接名称,默认127.0.0.1
                           user='root', # 用户名,默认为root
                           passwd='123456', # 密码,默认为123456
                           port=3306, # 端口,默认为3306
                           db='weldingdata', # 所创建的数据库名称**************************************************************************
                           charset='utf8') # 字符编码
    # 生成游标对象
    cur_1 = conn.cursor()
    cur_2 = conn.cursor()
    cur_3 = conn.cursor()
    # SQL语句*************************************************************table name******************************表名
    sql_1 = "select voltage from `datas`"
    sql_2="select electricity from `datas`"
    sql_3="select pressure from `datas`"
    # 执行SQL语句,并将结果保存到游标对象中使用 cur.execute(sql) 方法来执行该语句,并将查询结果保存到游标对象 cur 中,以便后续处理或输出
    cur_1.execute(sql_1)
    cur_2.execute(sql_2)
    cur_3.execute(sql_3)
    # 通过fetchall方法获得数据
    data_1 = cur_1.fetchall()
    data_2 = cur_2.fetchall()
    data_3 = cur_3.fetchall()
    #打印数据
    for item in data_1:
        print(item)
    # 关闭游标
    cur_1.close()
    cur_2.close()
    cur_3.close()
    # 关闭连接
    conn.close()
    # 导入Flask模块,创建一个应用实例,用于发送 HTTP 请求并处理响应
    #创建了一个名为 app 的 Flask 应用实例
    app = Flask(__name__)
    # 允许跨域访问
    CORS(app, resources={r"/*": {"origins": "*"}})
    # 设置日志
    logging.basicConfig(level=logging.DEBUG)
    logger = logging.getLogger(__name__)
    # 使用 @app.route 装饰器来定义了一个路由,指定了 /api/users 这个端点接收 GET 请求
    # 处理 HTTP GET 请求,向前端发送数据
    @app.route('/api/users', methods=['GET'])
    def get_data():
        # 将元组转换为列表,并将所有元素转换为字符串
        result = [list(map(str, item)) for item in data_1]  
         # 将列表转换为JSON格式
        json_result = json.dumps(result) 
        # 将JSON数据发送到指定URL
        return jsonify(json_result)  
    #测试地址:http://127.0.0.1:5000/api/users
    # 处理前端发送的数据,例如插入到数据库
    @app.route('/submit-fault', methods=['POST'])
    def submit_fault():
        data = request.json
        process_data(data)  # 处理数据的函数
        return jsonify({'message': 'Fault information submitted successfully.'})
    def process_data(data):
       print(data)
       return
    #http://127.0.0.1:5000/submit-fault
    # 启动Flask应用
    if __name__ == '__main__':
        app.run(debug=True)
    
    数据库中的数据

    鸿蒙前后端互联实现接收发送数据+MySQL数据库(简单示例)

    数据库名为weldingdata,表名为data,数据如图所示(这里我直接用了vscode插件,用DBeaver也一样,只要连接上了就行)

    运行结果

    python终端(运行成功,大家有需要可自行执行其他sql语句并对代码进行修改得到自己想要的数据),这里我只让它输出了voltage这列的所有数据。

    指定的url地址界面,可以看到自己发送的数据。

    连接鸿蒙前端

    现在数据已经可以从后端发送到指定的url了,接下来就是前端通过网络请求拿到这个地址的数据。

     module.json5配置

    首先配置网络权限。插入(在module后插入就ok了)

        requestPermissions:[
    {
    name: "ohos.permission.INTERNET"
    }
    ] ,
    鸿蒙前端index代码示例
    import http from '@ohos.net.http';
    @Preview
    @Entry
    @Component
    struct Index {
      @State message: string = 'Demo'
    @State numArr:number[]=[]
      transmit_data(){
        let httpRequest_transmit = http.createHttp();
        let dataToSend = { "树深时见鹿":"溪午不闻钟","南风知我意":"吹梦到西洲","与君初相识":"犹如故人归",};
        httpRequest_transmit.request(
          "http://127.0.0.1:5000/submit-fault",
          {
            method:http.RequestMethod.POST,
            header:{"Content-Type": "application/json"},
            // 将数据转换为JSON字符串
            extraData: JSON.stringify(dataToSend)
          },
          (err, data) => {
            if (!err) {
              // 处理响应
              console.log("Data sent successfully");
            } else {
              // 错误处理
              console.log("Failed to send data");
            }
          }
        );
      }
      HTTP() {
        ///创建HTTP请求对象
        let httpRequest = http.createHttp();
        httpRequest.request(
          // 填写HTTP请求的URL地址,可以带参数也可以不带参数。URL地址需要后端定义
          "http://127.0.0.1:5000/api/users", //后端定义的url地址
          {
            method: http.RequestMethod.GET, //默认为GET方法
            //定义请求头,这里设置Content-Type为application/json,表示请求体内容的数据类型为JSON
            header: { 'Content-Type': 'application/json' },
            //设置读取超时时间为60000毫秒,即60秒 。
            readTimeout: 60000,
            //设置连接超时时间为60000毫秒,即60秒。
            connectTimeout: 60000,
          },
          (err, data) => {
            if (!err) {
              //处理data,将得到的json数据格式转为字符串存入result
              let result = data.result.toString()
              console.log(result)
              //将result转为数组存入arr
              let arr = JSON.parse(result)
              console.info(arr)
              //使用正则表达式匹配 [ 和 ] 和""并去除
              let newarr = arr.replace(/[\[\]"]+/g, '');
              console.info(newarr)
              // 将处理后的字符串按照逗号分隔成数组,并转换为数字
              this.numArr = newarr.split(',').map(Number);;
              console.log(this.numArr.toString()); // [170, 170, 220, 200, 140, 160, 70, 100, 90, 150]
              console.info(this.numArr[0].toString())//打印第一个数据
            } else {
              //输出错误信息
              console.info('error:' + JSON.stringify(err));
              //销毁
              httpRequest.destroy();
            }
          })
      }
      build() {
        Column() {
          Column() {
            Text(this.message)
              .fontSize(30)
              .fontWeight(FontWeight.Bold)
              .margin({ bottom: 20 ,top:20})
            // Text()
            //   .fontSize(22)
            //   .fontColor('#ffc318d0')
            //   .margin({bottom:50})
            Button('数字传入')
              .backgroundColor('#ff228828')
              .width(200)
              .height(60)
              .margin({top:50,bottom:50})
              .onClick(() => {
                this.HTTP()
              })
            Button('信息传出')
              .backgroundColor('#ff228828')
              .width(200)
              .height(60)
              .onClick(() => {
                  this.transmit_data()
              })
          }.width('100%')
          .height(300)
        }
        .height('100%')
        .width('100%')
      }
    }
    

     结果测试

    测试页面。

     后端发送,前端接收(点击数字传入)

    可以看到数据已经转换成数组存入,我这里将它在控制台打印出来了。后续可以对这些数据操作。

     前端发送,后端接收(点击信息传出)

    可以看到控制台输出Data sent successfully,说明数据发送成功了。

    其中第十行代码是我们定义要发送的数据。

     我们返回到后端查看数据。可以看到数据已经成功发送过来了。

    后续我们可以进行对数据的处理,包括插入数据库当中。

    下面是一个插入数据库的简单示例。

    前面代码不变,为了简化,我只发送了一组数据,数据如下 。

    let dataToSend = { "数字":"2"};

    首先需要在数据库先创建一个表来存储要接收的数据。

    例如我这里,还用之前的数据库,只需创建一个number_data的表,新建一个number列。

    后端的代码部分

    # 处理前端发送的数据,插入到数据库
    @app.route('/submit-fault', methods=['POST'])
    def submit_fault():
        data = request.json
        process_data(data)  # 处理数据的函数
        return jsonify({'message': 'Fault information submitted successfully.'})
    def process_data(data):
        try:
            # 连接数据库
            conn = pymysql.connect(host='127.0.0.1', user='root', passwd='180805Wmy', port=3306, db='weldingdata', charset='utf8')
            # 生成游标对象
            cur = conn.cursor()
            # 插入数据的SQL语句
            #将数据插入到number_data表中的(number)列中
            sql = "INSERT INTO number_data (number) VALUES (%s)"
            # 从前端发送的数据中获取值
            #从 "数字" 中获取值 "2"
            number= data.get('数字')
            # 执行SQL语句,插入数据
            cur.execute(sql, (number))
            # 提交事务
            conn.commit()
            # 关闭游标和连接
            cur.close()
            conn.close()
        except pymysql.Error as e:
            # 打印错误信息
            print(f"Error {e.args[0]}: {e.args[1]}")
            # 回滚事务
            conn.rollback()
        except Exception as e:
            # 打印其他异常信息
            print(f"An error occurred: {e}")
        return
    

    跟之前步骤一样,只需点击信息传出按钮。

    数据就成功存入到数据库中了。

    遇到的问题

    数据的处理(已解决)
    • 一开始jiexijson数据时发现无法解析成想要的格式,因为是只想要数据库中的那一串数字,后来干脆用正则表达式处理字符串,最后把它放到数组里。
    • 下面就是具体操作。如果有其它办法亦可。
    • //处理data,将得到的json数据格式转为字符串存入result
                let result = data.result.toString()
                console.log(result)
                //将result转为数组存入arr
                let arr = JSON.parse(result)
                console.info(arr)
                //使用正则表达式匹配 [ 和 ] 和""并去除
                let newarr = arr.replace(/[\[\]"]+/g, '');
                console.info(newarr)
                // 将处理后的字符串按照逗号分隔成数组,并转换为数字
                this.numArr = newarr.split(',').map(Number);;

       问题收集

      大家可将过程中自己遇到的所有问题展示出来,以便于大家学习改进。如果更好的方法或者简单直接的方式请联系我。

微信扫一扫