카카오톡 채널 연동 후 모바일에서만 "페이지를 찾을 수 없습니다." 가 보여집니다

  useEffect(() => {
    if (!(window as any).Kakao) {
      const script = document.createElement('script');
      script.src = 'https://t1.kakaocdn.net/kakao_js_sdk/2.6.0/kakao.min.js';
      script.integrity =
        'sha384-6MFdIr0zOira1CHQkedUqJVql0YtcZA1P0nbPrQYJXVJZUkTk/oX4U9GhUIs3/z8';
      script.crossOrigin = 'anonymous';
      script.onload = () => {
        (window as any).Kakao.init(process.env.NEXT_PUBLIC_KAKAO_API_KEY);
        (window as any).Kakao.Channel.createChatButton({
          container: '#chat-channel-button',
          channelPublicId: process.env.NEXT_PUBLIC_KAKAO_CHANNEL_PUBLICK_ID,
          supportMultipleDensities: true,
        });
      };
      document.head.appendChild(script);
    }
  }, []);

위와 같이 구현을 하였고 데스크탑에서는 잘 구동이 됩니다만,
모바일에서 버튼을 눌러 채널 연동을 시도하면
“페이지를 찾을 수 없습니다.”
“비공개 또는 삭제된 프로필일 수 있습니다.”
“또는 주소가 정확한지 다시 한번 확인해주세요.” 라는 알림만 보여집니다.

이걸 웹 개발자 모드에서 모바일로 접속하면,
header tag에 ‘data-locator-hook-status-message=“No valid renderers found.”’ 같은 에러 문구가 생기는데 원인을 알 수 있을까요 ?

이 내용은 process.env.NEXT_PUBLIC_KAKAO_CHANNEL_PUBLICK_ID 에 올바른 값이 전달 안된 경우 같습니다.

아래 주소에 접속하셔서 정상 표기되는지 먼저 확인해주시고, 정상표기된다면 해당 변수 하드코딩하셔서 확인해보시겠어요?

https://pf.kakao.com/(채널ID)/chat

동일한 URL에서 웹에서는 정상 작동하고, 모바일에서만 "비공개 또는 삭제된 프로필일 수 있습니다."가 보여지는데도 "process.env.NEXT_PUBLIC_KAKAO_CHANNEL_PUBLICK_ID"가 문제일까요 ?

https://pf.kakao.com/(채널ID)/chat

경로로는 정상 접근이 됩니다 ㅜㅜ

네, 해당 채널이 유효하지 않은것 같은데요. 채널 ID가 어떻게 되나요?