智能简历平台Plus——数据库将数据传送至前端（10）-CSDN博客

本文链接：https://blog.csdn.net/ltfxyy/article/details/139910036

概要

主要思路
前端
后端
展示效果

主要思路

将后端数据库数据传回前端，使得其在关闭打开之后再进入仍然可以进入

前端

前端代码思路

发送 HTTP 请求：使用 axios.get 方法向服务器发送一个 GET 请求，获取指定 URL
(http://127.0.0.1:5000/api/job_intention) 的数据。
处理成功响应：
请求成功后，服务器会返回一个响应对象，包含所请求的数据。检查响应对象中的数据（response.data）是否存在。
如果数据存在，将其赋值给组件的 jobIntentionForm 属性，使得组件能够使用这些数据。
处理错误响应：
如果请求失败（例如，服务器不可用，网络错误等），捕获错误并进行处理。使用 console.error
输出错误信息，以便进行调试。错误信息可以是服务器返回的错误消息（如果存在）或者整个错误对象。
注释掉的代码（this.$message.error(‘获取求职意向数据失败’)）建议在实际应用中使用用户友好的方式通知用户请求失败的情况。

fetchJobIntention() {
      axios.get('http://127.0.0.1:5000/api/job_intention')
      .then(response => {
        if (response.data) {
          this.jobIntentionForm = response.data;
        }
      })
      .catch(error => {
        console.error('Error fetching data:', error.response ? error.response.data : error);
        //this.$message.error('获取求职意向数据失败');
      });
    },


fetchData() {
      axios.get('http://127.0.0.1:5000/api/user_basic_info')
        .then(response => {
          console.log('Data fetched successfully:', response.data);
          this.formData = response.data;
        })
        .catch(error => {
          console.error('Error fetching data:', error.response ? error.response.data : error);
        });
    }
  },


```async loadData() {
      try {
        const response = await axios.get(`${API_ENDPOINT2}/api/getCampusExperience`);
        if (response.data.error) {
          console.error('Error:', response.data.error);
        } else {
          this.campusExperienceForm = response.data;
        }
      } catch (error) {
        console.error('API error:', error);
      }
    },

后端

代码思路

定义路由和跨域设置：
使用 @app.route 定义一个新的 API 路由 /api/job_intention，只允许 GET 请求。使用
@cross_origin 设置跨域访问，允许来自 http://localhost:8080 的请求。
数据库操作：
在路由处理函数 get_job_intention 中，首先尝试获取数据库连接和游标。使用 SQL 查询语句从
user_details 表中获取最新的用户求职意向数据。查询结果按 user_id 降序排列，并限制结果数量为
1（即最新的一条记录）。
处理查询结果：
如果查询结果存在，将其转换为字典格式，以便于 JSON 序列化。使用 jsonify 将字典转换为 JSON
格式，并返回给客户端，状态码为 200。如果查询结果为空，返回一个包含错误信息的 JSON 响应，状态码为 404。
错误处理：
使用 try-except-finally 结构处理数据库操作中的潜在错误。

@app.route('/api/education_info', methods=['GET'])
@cross_origin(origins='http://localhost:8080')  # 允许特定域名访问
def get_education_info():
    try:
        # 获取数据库连接
        conn = get_db_connection()
        cursor = conn.cursor()

        # 查询最新的教育背景信息
        cursor.execute('SELECT school_name, major, readingTime_start, readingTime_end, educational_background, experience_details FROM user_details ORDER BY rowid DESC LIMIT 1')
        education_info = cursor.fetchone()

        if education_info:
            return jsonify({
                'school_name': education_info['school_name'],
                'major': education_info['major'],
                'readingTime_start': education_info['readingTime_start'],
                'readingTime_end': education_info['readingTime_end'],
                'educational_background': education_info['educational_background'],
                'experience_details': education_info['experience_details']
            }), 200
        else:
            return jsonify({'error': 'No education information found'}), 404
    except sqlite3.Error as e:
        logging.error(f'Database error: {e}')
        return jsonify({'error': 'Database error'}), 500
    finally:
        if conn:
            conn.close()

@app.route('/api/job_intention', methods=['GET'])
@cross_origin(origins='http://localhost:8080')  # 允许特定域名访问
def get_job_intention():
    try:
        # 获取数据库连接
        conn = get_db_connection()
        cursor = conn.cursor()
        # 查询最新的用户意向
        cursor.execute(
            'SELECT intention_position, intention_city, intention_salary, attend_time FROM user_details ORDER BY user_id DESC LIMIT 1')
        job_intention = cursor.fetchone()

        if job_intention:
            # 将查询结果转换为字典
            job_intention_data = {
                'intention_position': job_intention['intention_position'],
                'intention_city': job_intention['intention_city'],
                'intention_salary': job_intention['intention_salary'],
                'attend_time': job_intention['attend_time']
            }
            return jsonify(job_intention_data), 200
        else:
            return jsonify({'message': 'No job intention found'}), 404
    except sqlite3.Error as e:
        logging.error(f'数据库错误: {e}')
        return jsonify({'error': 'Database error'}), 500
    finally:
        if cursor:
            cursor.close()
        if conn:
            conn.close()

app.route('/api/education_info', methods=['GET'])
@cross_origin(origins='http://localhost:8080')  # 允许特定域名访问
def get_education_info():
    try:
        # 获取数据库连接
        conn = get_db_connection()
        cursor = conn.cursor()

        # 查询最新的教育背景信息
        cursor.execute('SELECT school_name, major, readingTime_start, readingTime_end, educational_background, experience_details FROM user_details ORDER BY rowid DESC LIMIT 1')
        education_info = cursor.fetchone()

        if education_info:
            return jsonify({
                'school_name': education_info['school_name'],
                'major': education_info['major'],
                'readingTime_start': education_info['readingTime_start'],
                'readingTime_end': education_info['readingTime_end'],
                'educational_background': education_info['educational_background'],
                'experience_details': education_info['experience_details']
            }), 200
        else:
            return jsonify({'error': 'No education information found'}), 404
    except sqlite3.Error as e:
        logging.error(f'Database error: {e}')
        return jsonify({'error': 'Database error'}), 500
    finally:
        if conn:
            conn.close()

展示效果

后端数据库
在这里插入图片描述
前端展示