순살 아파트) server.js

1. 필요한 모듈을 가져옵니다. axios는 HTTP 요청을 보내는 데 사용되며, express는 웹 서버를 구축하는 데 사용됩니다. path 모듈은 파일 경로를 다루는 데 사용됩니다.
2. CORS(Cross-Origin Resource Sharing) 헤더 설정: 이 설정은 다른 도메인에서의 리소스 접근을 허용합니다.
3. 정적 파일 경로 설정: express.static() 미들웨어 함수를 이용해 정적 파일(HTML, CSS, JavaScript 등)이 있는 디렉토리 경로를 지정합니다.
4. 라우팅 설정: 각 URL 요청에 대한 응답을 정의합니다. 예를 들어 /map.html 요청이 오면 "map.html" 파일을 응답으로 반환합니다.
5. 서버 포트 설정 및 실행: 환경 변수 PORT 값 혹은 3000 포트에서 서버가 실행됩니다.
6. 카카오 맵 정보 가져오기: '/getKakaoMapData' URL로 GET 요청이 오면 카카오 API에 좌표 정보(lat, lng)를 전달하고 결과 데이터를 받아서 클라이언트에게 반환합니다.
7. 카카오 지도 스크립트 불러오기: '/loadKakaoScript' URL로 GET 요청이 오면 카카오 지도 API 스크립트 태그 문자열을 반환합니다.

 

sever.js 코드입니다!

const axios = require("axios");
const express = require("express");
const app = express();
const path = require("path");

// CORS 헤더 설정
app.use((req, res, next) => {
  res.setHeader("Access-Control-Allow-Origin", "*");
  res.setHeader(
    "Access-Control-Allow-Headers",
    "Origin, X-Requested-With, Content-Type, Accept"
  );
  res.setHeader(
    "Access-Control-Allow-Methods",
    "GET, POST, PATCH, DELETE, OPTIONS"
  );
  next();
});

// 정적 파일 경로 설정
app.use(express.static(path.join(__dirname, "..")));

// 라우팅 설정
app.get("/", (req, res) => {
  res.sendFile(path.join(__dirname, "..", "html", "index.html"));
});

app.get("/map.html", (req, res) => {
  res.sendFile(path.join(__dirname, "..", "html", "map.html"));
});

app.get("/buildingData.js", (req, res) => {
  res.sendFile(path.join(__dirname, "..", "js", "data", "buildingData.js"));
});

app.get("/news.html", (req, res) => {
  res.sendFile(path.join(__dirname, "..", "html", "news.html"));
});

app.get("/newsData.js", (req, res) => {
  res.sendFile(path.join(__dirname, "..", "js", "data", "newsData.js"));
});

app.get("/notice.html", (req, res) => {
  res.sendFile(path.join(__dirname, "..", "html", "notice.html"));
});

app.get("/noticeData.js", (req, res) => {
  res.sendFile(path.join(__dirname, "..", "js", "data", "noticeData.js"));
});

// 서버 포트 설정
const PORT = process.env.PORT || 3000;
app.listen(PORT, () => {
  console.log(`Server running on port ${PORT}`);
});

// 카카오 맵 정보 가져오기
app.get("/getKakaoMapData", async (req, res) => {
  const { lat, lng } = req.query;

  try {
    const response = await axios.get(
      `https://dapi.kakao.com/v2/local/geo/coord2address.json?x=${lng}&y=${lat}`,
      {
        headers: {
          Authorization: `KakaoAK ${process.env.KAKAO_API_KEY}`,
        },
      },
    );

    res.json(response.data);
  } catch (error) {
    console.error(error);
    res.status(500).json({ error: "서버 오류 발생" });
  }
});

// 카카오 지도 스크립트 불러오기
app.get("/loadKakaoScript", (req, res) => {
  res.set("Content-Type", "text/javascript");
  res.send(
    `document.write('<script src="https://dapi.kakao.com/v2/maps/sdk.js?appkey=${process.env.KAKAO_API_KEY}&libraries=services,clusterer"><\\/script>');`,
  );
});