Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

개정판> 24장) <Route path="/@:username"> #373

Closed
bigtiger0405 opened this issue Feb 10, 2023 · 3 comments
Closed

개정판> 24장) <Route path="/@:username"> #373

bigtiger0405 opened this issue Feb 10, 2023 · 3 comments

Comments

@bigtiger0405
Copy link

bigtiger0405 commented Feb 10, 2023

스크린샷 2023-02-10 오전 9 18 42

똑같이 작성했고 자료를 찾아봐도 잘안나오고 모르겠어서 질문 남깁니다.
Route path="/@:username" 에 관련된 질문입니다.

  1. http://localhost:4000/@tester 접속해 봤지만 책과 같이 PostListPage 가 출력되지 않습니다.
  2. 개발자도구 콘솔에 아래와같이 나타납니다.
    => No routes matched location "/@tester"
  3. 깃허브에 올라가있는 코드를 복사해서 해도 되지않습니다.

어떻게 해야 해결할 수 있을까요?

@andrew950515
Copy link

andrew950515 commented Feb 13, 2023

질문자님께서 아마 질문하실때 4000번이라고 오타를 치신거 같네요. 실제 도메인은 3000번 포트로 입력하신거겠죠?

저도 같은 에러가 발생을 했는데 여러 시도를 해보니 이상하게 '/@:username' 에서 콜론이 @와 붙어있을 경우 제 역할을 하지 못하는 것 같습니다.

===@가 있는 경우===
<Route path="/@:username" element={<PostListPage />} / 인경우
도메인에 localhost:3000/@:username 이랑 똑같이 쳐야 컴포넌트가 제대로 뜹니다.
하지만 localhost:3000/@tester 혹은 localhost:3000/@username은 동작하지 않습니다

그리고
<Route path="/@">
<Route path=":username" element={<PostListPage />} />
<Route path=":username/:postId" element={<PostPage />} />
</Route>
일때는 localhost:3000/@tester와 localhost:3000/@:username모든 경우 동작하지 않습니다.

===@가 없는 경우===
<Route path="/:username" element={<PostListPage />} / 인경우에는
localhost:3000/tester 잘 작동 합니다.

===@와 콜론 분리 시===
<Route path="/@/:username" element={<PostListPage />} />인 경우에도
localhost:3000/@/tester 잘 작동합니다.

이를 보면 routing의 문제가 아닌 '/@:'에서 @와 콜론이 붙어있을 경우 콜론을 하나의 문자열로 인식을 하는 것 같습니다.
chrome, safari, xcode simulator의 아이폰 기기에서도 접속을 시도해 보았지만 결과는 같은 것으로 보아
브라우저의 문제는 아닌거 같습니다.

이런 에러가 발생하는 이유를 아시는분은 알려주시면 감사하겠습니다.

@bigtiger0405
Copy link
Author

네 3000번 포트 맞아요~ 제가 잘못 적었네요
@를 제거 하고 진행했을때 username을 구분 못하는 문제가 생겨서 꼭 있어야 하는거 같은데
이 문제 해결하신분 있으시면 공유 부탁드려요~

@velopert
Copy link
Owner

#382 를 확인해주세요~
감사합니다.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants