DB에 접근하는 동작 구현

실제 프론트 엔드에서 어떤 버튼을 눌렀을 때, 백엔드를 통해 내 DB에 접근하고 정보를 가져오고 싶습니다.

이를 위해서 어떤 방법을 사용하면 되는지 직접 구현하는 것이 목적입니다.

예시를 위해서 현재 사용자가 어떤 Form 을 사용하고 어떤 Version 을 사용하고 있을 때 

특정한 데이터를 해당 정보에 맞춰 전송하기 위함입니다. 

프론트엔드

mainForm(Form 의 ID), mainVersion(Form 의 버전), userId(유저의 ID), data1, data2 (전송하고 싶은 정보들)

위 정보가 정의가 되어 있다는 가정 하에..

다음과 같은 동작을 설정해서 특정 버튼을 누르면 작동되도록 해봅시다.

				
					const handleExample = async () => {
    try {
      const response = await axios.post(
        "https://example.com/api/",
        { mainForm, mainVersion, userId, data1, data2 }, 
        {
          headers: {
            "Content-Type": "application/json",
          },
        }
      );

      if (response.data.success) {
        alert("Your Data has been successfully created!");
      } else {
        alert("Failed to save Data.");
      }
    } catch (error) {
      alert("Failed to save Data.");
      console.error("Error :", error);
    }
  };
				
			

위 코드는 특정 라우터로 mainForm, mainVersion 등의 정보를 전송합니다.

그리고 data 라는 값을 전송을 받게 됩니다. 

data 내에 존재하는 success 라는 key 의 value 가 true일 경우, 전송이 완료 되었다는 문구가..

그렇지 않은 경우 뭔가 잘못 되었다는 문구가 등장합니다. 

그렇다면 이를 백엔드에서는 어떻게 받고 어떻게 처리할지 생각해봅시다. 

백엔드 라우터

우리는 각종 정보를 프론트엔드에서 백엔드로 전달하는 동작을 만들었습니다.

이제 프론트엔드에서 전송한 정보들을 통해서 

test_table 이라는 DB로 각각의 값을 알맞은 Column 내에 집어넣어 새로운 ROW 를 생성하는 로직입니다.

				
					app.post("/api/example", async (req, res) => {
    const { mainForm, mainVersion, userId, data1, data2 } =
      req.body;

    try {
      const connection = await pool.getConnection();
      try {
        await connection.beginTransaction();
        console.log("Transaction started");
  
        const query = `INSERT INTO test_table (form_id, form_version, user_id, data_1, data_2) VALUES (?, ?, ?, ?, ?)`;
        await connection.query(query, [
          mainForm,
          mainVersion,
          userId,
          data1,
          data2,
        ]);
  
        await connection.commit();
        console.log("Transaction committed successfully");
        res.json({ success: true });
      } catch (error) {
        console.error("Transaction Error:", error);
        await connection.rollback();
        res
          .status(500)
          .send({ success: false, message: "Error during transaction" });
      } finally {
        connection.release();
      }
    } catch (error) {
      console.error("Database Connection Error:", error);
      res
        .status(500)
        .send({ success: false, message: "Database connection error" });
    }
  });