项目实训第一周02

项目实训第一周02（7.1）

工作概要：初步搭建框架，实现前后端通信和后端的数据库访问与读取工作。

（1）前后端通信
在实现前后端通信中，借用了之前自己实现项目中的一些思路，在Vue中提前封装好ajax，前端通信时通过调用ajax方法即可，定义如下：

//封装ajax
export default function ajax(url='',params={},type='GET'){
  let promise;
  return new Promise(((resolve, reject) => {
    //1.判断请求方式
    if ('GET'===type){
      //1.1拼接字符串
      let str = '';
      Object.keys(params).forEach((value,index) => {
        if (index+1===Object.keys(params).length){
          str+=value+'='+params[value];
        }else{
          str+=value+'='+params[value]+'&';
        }
      });
      //1.2完整路径
      url+='?'+str;
      //1.3发送get请求
      promise = axios.get(url);
    }else if('POST'===type){
      //1.3发送post请求
      promise = axios.post(url,params);
    }
    //2.返回请求结果
    promise.then((response)=>{
      resolve(response.data);
    }).catch((error)=>{
      reject(error);
    });
  }))
}

后端响应通过装饰器规定路径和响应方式，需要注意的是，需要解决跨域的问题，否则前端不会按照期待的结果进行显示，解决方法如下：

from flask_cors import CORS  # 引入声明
app = Flask(__name__)
CORS(app, resources=r'/*')  #解决跨域

考虑到后面实现过程中需要大量使用json，在此处记录一下在Flask中关于json的使用方式。一种方式是使用jsonify()，另一种方法是使用json.dumps()，示例如下：

# 第一种方式
jsonify({'user':'root','password':'123'},{'user':'kiro','password':'0000'})

# 第二种方式
data = {
    'name' : 'myname',
    'age' : 100,
}
json_str = json.dumps(data)

（2）Flask连接与读取数据库
经过大量资料查阅，python中对数据库的使用方法较多，为了使用SQL原生语句，本项目决定使用sqlite数据库，在app.py文件中提前定义好数据库连接方法和执行语句获得结果集方法，当定义响应方法时直接调用这两个方法就可以。

# 数据库连接
def get_db():
    # sqlite数据中连接直接使用数据库名称，这与sqlite数据库的创建有关系
    db = sqlite3.connect('dbtest.db')

    db.row_factory = sqlite3.Row
    return db
# 获得结果集
def query_db(query, args=(), one=False):
    db = get_db()
    cur = db.execute(query, args)
    db.commit()
    rv = cur.fetchall()
    db.close()
    return (rv[0] if rv else None) if one else rv

定义好这两个方法之后，后面就可以直接使用query_db方法执行sql语句，获得结果集进行处理。