Flask爱家租房--房屋管理（获取房屋详情）

0.效果展示

1.思路总结

1）房屋详情页面开始加载时，detail.js首先通过定义的函数（重点：document.location.search），截取需要向后端取得详情页面的house_id；

2）后端经过逻辑处理，首先向redis中获取相应房屋的具体信息，若redis中不存在，则向数据库查询，返回给前端detail.js；
接下来，detail.js分两部分对前端页面进行渲染；
效果如下：

3）同时判断当前用户是否为房东，如果不为房东，则想用户展示“即刻预订”按钮。

2.后端接口

houses.py相关接口：

@api.route("/houses/<int:house_id>", methods=["GET"])
def get_house_detail(house_id):
    """获取房屋详情"""
    # 前端在房屋详情页面展示时，如果浏览页面的用户不是该房屋的房东，则展示预定按钮，否则不展示，
    # 所以需要后端返回登录用户的user_id
    # 尝试获取用户登录的信息，若登录，则返回给前端登录用户的user_id，否则返回user_id=-1
    user_id = session.get("user_id", "-1")

    # 校验参数
    if not house_id:
        return jsonify(errno=RET.PARAMERR, errmsg="参数缺失")

    # 先从redis缓存中获取信息
    try:
        ret = redis_store.get("house_info_%s" % house_id)
    except Exception as e:
        current_app.logger.error(e)
        ret = None
    if ret:
        current_app.logger.info("hit house info redis")
        return '{"errno":"0", "errmsg":"OK", "data":{"user_id":%s, "house":%s}}' % (user_id, ret), \
               200, {
   "Content-Type": "application/json"}

    # 查询数据库
    try:
        house = House.query.get(house_id)
    except Exception as e:
        current_app.logger.error(e)
        return jsonify(errno=RET.DBERR, errmsg="查询数据失败")

    if not house:
        return jsonify(errno=RET.NODATA, errmsg="房屋不存在")

    # 将房屋对象数据转换为字典
    try:
        house_data = house.to_full_dict()
    except Exception as e:
        current_app.logger.error(e)
        return jsonify(errno=RET.DATAERR, errmsg="数据出错")

    # 存入到redis中
    json_house = json.dumps(house_data)
    try:
        redis_store.setex("house_info_%s" % house_id, constants.HOUSE_DETAIL_REDIS_EXPIRE_SECOND, json_house)
    except Exception as e:
        current_app.logger.error(e)

    resp = '{"errno":"0", "errmsg":"OK", "data":{"user_id":%s, "house":%s}}' % (user_id, json_house), \
           200, {
   "Content-Type": "application/json"}
    return resp

3.前端js

detail.js

function hrefBack() {
   
    history.go(-1);
}

// 解析提取url中的查询字符串参数
function decodeQuery(){
   
    var search = decodeURI(document.location.search);
    return search.replace(/(^\?)/, '').split('&').reduce(function(result, item){
   
        values = item.split('=');
        result[values[0]] = values[1];
        return result;
    }, {
   });
}

$(document).ready(function(){
   
    // 获取详情页面要展示的房屋编号
    var queryData = decodeQuery();
    var houseId = queryData["id"]