Posts
Q&A
https ์ ์ฉ ํ์ ์ด๋ฏธ์ง ์ฃผ์์์ ์๋ฌ๊ฐ ๋ฐ์ํฉ๋๋ค.
์ฝ๋ ์ชฝ ์๋ฌ๊ฐ ๋ง์๋ค์.๊ทธ๋์ ์์ ํ๋๊น ์ด๋ฒ์๋ http๋ถํฐ ์๋ฉ๋๋ค.img src์ https ์์ผ๋ก ์ ์ฅ์ด ๋๋๋ฐ ๋ง์ฐ์ค๋ก ํ์ธํ๋ฉด /https ๋ก ์ฐ๊ฒฐ๋ฉ๋๋ค.๋๋ฉ์ธ์ ์ง์ธ ์ ์๋ ๋ฐฉ๋ฒ์ด ์์๊น์?google์ด๋ github์์ ์ด๋ฏธ์ง ๋ฐ์์ฌ ๋๋ ๋๋ฉ์ธ์ด ์ ๋ถ๋๋ฐ s3์์ ์ด๋ฏธ์ง ๋ฐ์์ฌ ๋๋ง ๋๋ฉ์ธ์ด ๋ถ์ต๋๋ค.
- 0
- 2
- 348
Q&A
res.setHeader vs res.cookie
(์ฌ์ง)(์ฌ์ง)์๋ฌ๋ ๋ฐ๋ก ์๋ ๊ฒ ๊ฐ์ต๋๋ค."dependencies": { "cookie-parser": "^1.4.6", "express": "^4.18.2", "express-session": "^1.17.3" }
- 0
- 3
- 1.7K
Q&A
infinite scroll์์ scroll ์์น ๊ธฐ์ตํ๋ ๋ฒ์ ๋ํด ์ง๋ฌธ๋๋ฆฝ๋๋ค.
useEffect(() => { window.scrollTo(0, 300); }, []); const scrollPos = () => { console.log(window.scrollY); localStorage.setItem("y", window.scrollY); }; useEffect(() => { window.addEventListener("scroll", scrollPos); return () => window.removeEventListener("scroll", scrollPos); }, []); (์ฌ์ง)๊ตฌ๊ธ๋งํด๋ ์ํ๋ ๋๋ต์ด ์ ๋์์ ์ง๋ฌธ๋๋ฆฝ๋๋ค.scrollTo๋ฅผ 300์ผ๋ก ์ค์ ํ๋๋ฐ 321์ ์ ๋์ค๋ ๊ฑด๊ฐ์? useEffect(() => { window.scrollTo(0, 300); }, []); const scrollPos = () => { // console.log(window.scrollY); localStorage.setItem("y", window.scrollY); }; useEffect(() => { console.log(window.scrollY); window.addEventListener("scroll", scrollPos); return () => window.removeEventListener("scroll", scrollPos); }, []); ๋ ์์ ๊ฐ์ด ์์ฑํ๋ฉด window.scrollY๊ฐ 300์ผ๋ก ์ถ๋ ฅ๋ฉ๋๋ค. ์ด๋์ ์ ๊ฐ ๋์น๊ฑธ๊น์?
- 1
- 4
- 2.7K
Q&A
infinite scroll์์ scroll ์์น ๊ธฐ์ตํ๋ ๋ฒ์ ๋ํด ์ง๋ฌธ๋๋ฆฝ๋๋ค.
์กฐ์ธํด์ฃผ์ ๋ฐฉ๋ฒ๋๋ก useSWRInfinite ์ด์ฉํด์ scrollHeight ๋ฌธ์ ํด๊ฒฐํ์ต๋๋ค. ๊ฐ์ฌํฉ๋๋ค.๋ ๊ถ๊ธํ ์ ๋ค์ด ์์ต๋๋ค. useEffect(() => { const y = localStorage.getItem("y"); if (y) window.scrollTo(0, y); }, []); const scrollPos = useDebouncedCallback(() => { localStorage.setItem("y", window.scrollY); }, 100); useEffect(() => { window.addEventListener("scroll", scrollPos); return () => window.removeEventListener("scroll", scrollPos); }, []); 1.์์ ๊ฐ์ด ์์ฑํ์ฌ previous scroll position์ ์ ์ฅํ๋๋ก ๊ตฌํํ์ต๋๋ค.scroll event๊ฐ ๋๋ฌด ์์ฃผ ๋ฐ์ํด์ debounce๋ฅผ ์ด์ฉํด์ ์ผ์ ์๊ฐ ๋์์ ๋์ํ์ง ์๋๋ก ๋ง๋ค์์ต๋๋ค.ํน์ ์ ๋ฐฉ๋ฒ ๋ง๊ณ ๋ค๋ฅธ ๋ฐฉ๋ฒ์ผ๋ก previous scroll position์ ์ ์ฅํ ์ ์๋ ๋ฐฉ๋ฒ์ด ์์๊น์? 2.reloadํ ๋ค์๋ previous scroll position์ด ์ ์ฉ๋๋๋ก ๋ง๋ค ์ ์๋์? ์๋ํ ๋ฐฉ๋ฒ 1useEffect(() => { const y = localStorage.getItem("y"); if (y) { window.scrollTo(0, y); } window.onbeforeunload = () => { localStorage.setItem("y", window.scrollY); }; }, []); beforeunload ์ด๋ฒคํธ๋ก scroll position์ ์ ์ฅ์ด ๋๋๋ฐ ํด๋น ์์น๋ก scroll์ด ์ด๋ํ์ง ์์ต๋๋ค. ์๋ํ ๋ฐฉ๋ฒ 2 useEffect(() => { const y = localStorage.getItem("y"); if (y) { window.scrollTo(0, y); } return () => localStorage.setItem("y", window.scrollY); }, []); clean up effect๋ฅผ ์ฌ์ฉํด๋ดค์ง๋ง ์ด๋ ๊ฒ ํ๋ฉด window.scrollY๊ฐ 0์ด ๋ฉ๋๋ค. ์กฐ์ธ ๋ถํ๋๋ฆฝ๋๋ค.
- 1
- 4
- 2.7K