zioinfo-mail/workspace/zioinfo-web/frontend/src/hooks/useSeoMeta.js

import { useEffect } from 'react';

const BASE = 'https://zioinfo.co.kr';
const SITE = '(주)지오정보기술';

/**
 * 페이지별 SEO 메타태그 동적 업데이트.
 * @param {Object} opts
 * @param {string} opts.title       페이지 제목 (| 사이트명 자동 추가)
 * @param {string} opts.description 페이지 설명 (160자 이내 권장)
 * @param {string} [opts.path]      정규 URL 경로 (예: '/solution/guardia')
 * @param {string} [opts.image]     OG 이미지 URL
 * @param {string} [opts.keywords]  추가 키워드 (콤마 구분)
 */
export function useSeoMeta({ title, description, path = '', image = '/logo.png', keywords = '' }) {
  useEffect(() => {
    const fullTitle = title ? `${title} | ${SITE}` : SITE;
    const canonical = `${BASE}${path}`;
    const ogImage   = image.startsWith('http') ? image : `${BASE}${image}`;

    // title
    document.title = fullTitle;

    // 메타 업데이트 헬퍼
    const set = (selector, attr, value) => {
      let el = document.querySelector(selector);
      if (!el) {
        el = document.createElement('meta');
        const [k, v] = selector.replace('meta[', '').replace(']', '').split('=');
        el.setAttribute(k, v.replace(/"/g, ''));
        document.head.appendChild(el);
      }
      el.setAttribute(attr, value);
    };

    // canonical
    let canonical_el = document.querySelector('link[rel="canonical"]');
    if (!canonical_el) {
      canonical_el = document.createElement('link');
      canonical_el.rel = 'canonical';
      document.head.appendChild(canonical_el);
    }
    canonical_el.href = canonical;

    // 기본
    set('meta[name="description"]',           'content', description);
    if (keywords) set('meta[name="keywords"]', 'content', keywords);

    // OG
    set('meta[property="og:title"]',       'content', fullTitle);
    set('meta[property="og:description"]', 'content', description);
    set('meta[property="og:url"]',         'content', canonical);
    set('meta[property="og:image"]',       'content', ogImage);

    // Twitter
    set('meta[name="twitter:title"]',       'content', fullTitle);
    set('meta[name="twitter:description"]', 'content', description);
    set('meta[name="twitter:image"]',       'content', ogImage);
  }, [title, description, path, image, keywords]);
}