nextjs metaラベルはkakao共有に適用されず、プレビューエラーを解決する方法

2464 ワード

nextjsでKakaoTalkを共有する場合、
正しいopen graphコードが入力されていますが.

常にメタタグが適用されないopen graph
KakaoDebTalkにアップしましたが、どう見ても私たちの状況に合わないアドバイスばかり…
それで最終的に組長にお願いしました.
metaラベルのappを適用します.tsxでコンソールをデバッグしました.

export const WithContextApp = (props: AppProps) => {
  const { loading, error, data } = useQuery<me>(ME, {
    client,
  });
  const me = data?.Me || undefined;
  const isLogined = !!me;


  if (loading) return false;

  return (
    <AppContext.Provider
      value={{
        me,
        isLogined,
      }}
    >
      <App {...props} />
    </AppContext.Provider>
  );
};
loadがtrueを表示するとfalseに戻りhtmlタグがまったく適用されないことに気づきます...
そこで、以下のように修正しました.
  const isServerSide = typeof window === "undefined";

  if (!isServerSide && loading) return false;
ここでtypeofwindowは定義されておらず、windowがサーバ側にあることを示します.
(したがって変数名もisServer Side)、、、
(ただし、通常、フロントはnot nullを返します.定義されていない場合を除きます)
要するに、metaラベルが適用されることを最終的に知ることができます.

HTMLコードが良く、metaタグが生成プレビューを受け付けているのが見えます😭 に感謝
あ、それから、レンダリングが正しいかどうか
https://developers.facebook.com/tools/debug/?locale=ko_KR
私のホームページがHTMLコードをどのように表現しているかを見ることができます!
週末を過ごして、解決してくれて嬉しいです.😆😆
私も組長のようにします.有能な開発者になりたいのですが、、、、😊