배포 후, 조회수 증가 이슈
안녕하세요 조은님!
강의 즐겁게 수강했습니다 🤓
다른게 아니라 배포 후 발견한 문제 때문에 질문 드립니닷!
로컬에서는 문제없이 새로고침할 때마다 조회수가 1씩 증가하는데용
배포 후에는 조회수가 3씩 증가 하고 있습니닷 🤔
(포스팅 갯수도 3개여서 관련이 있을 거라고 생각되는데욤..)
제 코드는 강의와 약간 다른 점이 있습니닷!
현재 Vercel에서는 기존 Vercel Postgres를 대체하는 Neon Marketplace 통합으로 변경되었는데요
(자세히는 잘 모르겠습니닷.. 관련 링크를 첨부합니닷..)
https://vercel.com/docs/storage/vercel-postgres
https://vercel.com/changelog/neon-now-available-on-vercel-marketplace
그래서 강의와는 다른 import { neon } from "@neondatabase/serverless"; 를 불러와서 사용 중입니닷
"use server";
import { neon } from "@neondatabase/serverless";
import { unstable_noStore as noStore } from "next/cache";
const sql = neon(`${process.env.DATABASE_URL}`);
export async function getViewsCount(): Promise<
{
slug: string;
count: number;
}[]
> {
if (!process.env.POSTGRES_URL) {
return [];
}
noStore();
const rows = await sql`
SELECT slug, count
FROM views
`;
return rows.map((row) => ({
slug: row.slug,
count: row.count,
}));
}
export const incrementView = async (slug: string) => {
noStore();
await sql`
INSERT INTO views (slug, count)
VALUES (${slug}, 1)
ON CONFLICT (slug)
DO UPDATE SET count = views.count + 1;
`;
};다른 분들도 저와 비슷한 오류가 생길지 궁금한데용.. 혹시 배포 후 조회수 증가를 확인해주실 수 있을까용..?
감사합니다!
回答 1
1
오, 이슬님! 안녕하세요! Vercel Postgres를 대체하는 Neon Marketplace 통합되었는지 몰랐네요... 변화가 정말 빠른 거 같습니다 😅
알려주신 것으로 시도해봤는데... 저도 동일한 증상이 발생하더라고요. 뭔가 이상해서 원래 예제로도 테스트를 해봤어요. 그랬더니 역시 동일하게 카운트가 2회 이상 오르는 문제가 생기는 걸 발견할 수 있었어요. (제 예제에 있던 버그를 발견해주셨어요. 감사해요!)
다시 알아보니 서버 컴포넌트의 중복 호출 문제로 보여요. 예제에서처럼 새로고침 마다 변경되어야 하는 경우라면 incrementView에 해당하는 로직을 Route Handlers로 구현하는 방식이 가장 쉬운 접근일 것 같아요.
예제를 별도의 브랜치에 만들어뒀으니 확인 해주세요.
https://github.com/hajoeun/next-js-blog/blob/fix/view-count/app/api/view-count/route.ts
더 알아보고 좋은 방법이 있다면 강의 소식에 남겨둘게요!
문제를 발견해주셔서 너무 감사드립니다!
시도해보시고 결과 알려주세요. 문제가 있다면 또 질문 남겨주세요! 감사합니다.
1
알려주신 방법으로 시도해보니 원하는대로 잘 구현되는 것을 확인했어요!
아직 nextjs의 렌더링에 대한 이해력이 부족해서 왜 서버 컴포넌트의 중복 호출 문제가 생겼는지는 완벽히 이해하지 못했습니닷 🥲 좀 더 살펴보고 질문 또 드려보겠습니다!
감사합니다!
명시적 타입 선언(콜론 타입 선언)과 as 타입 단언 차이
0
3
1
max x5 플랜을 결제했습니다.
0
5
1
클로드 초기 설정
0
5
1
사용자 스코프 설정 파일 적용 문제
0
7
1
클로드코드 유료플랜 할인 방법이 있을까요?
0
19
0
API Error : 400 에러의 원인과 해결방법이 궁금합니다!!
0
16
2
퍼미션 권한 설정 문의
0
19
2
Next.js + Tanstack Query BFF 구조 질문
0
13
1
커서에서 shift+enter가 안됩니다.
0
19
2
mcp 설치를 못하겠어요
0
34
2
라이브러리 관련 질문 있습니다!
0
24
2
노션 학습 자료 권한 요청
0
17
1
output-styles은 Claude Code의 공식 기능이 아니라고 하는데 혹시 변경된걸까요?
0
23
2
클로드 변경
0
26
2
/config 에서 output-style 을 변경
0
24
1
sitemap 에 Pormise가 필요한 이유
0
49
2
getPostData 함수 질문
0
50
1
초반부 pnpm dev 후 발생하는 에러
1
529
2
PPR 적용 후 여전히 SSG로 배포되는 이슈
0
237
3
추가로 Head tag에서 작성된 script 코드 관련하여 질문드리고 싶습니다. (feat. 즉시 실행 함수, dangerouslySetInnerHTML)
1
254
2
Head tag에서 script를 작성하는 이유에 대해서 여쭤보고 싶습니다! (+ NextJS의 Head tag와 Script tag)
1
173
1
완강하고 질문 드립니다
1
185
2
다크모드 적용
1
361
2
PPR 적용 한 후 에러가 났습니다.
1
298
2

