전남대 FE_정서윤 6주차 과제 Step2 #69
Conversation
public/404.html
Outdated
| // the correct url will be waiting in the browser's history for | ||
| // the single page app to route accordingly. | ||
| (function (l) { | ||
| if (l.search) { |
There was a problem hiding this comment.
https://github.com/rafrex/spa-github-pages 참고하셔서 설정하신거 같네요. 원리는 404.html 를 통해 URL을 보정하는 형태인데 현재 커밋해주신 404.html에는 15번 라인에서 알 수 있듯이 window.location.search가 항상 존재해야 실행됩니다. 참고하신 저장소에서는 404.html 내용이 https://github.com/rafgraph/spa-github-pages/blob/gh-pages/404.html 처럼 변경된 거 같으니 참고해보시겠어요?
디버깅 하실 때는 문제가 생긴 부분의 근본적인 원인이 무엇인지 먼저 찾으신 다음에 가능한 해결 방식을 탐색하는게 좋아요.
There was a problem hiding this comment.
첨부해주신 링크 에 있는 코드나 새로 push한 코드 모두 넣어보고 404 에러를 수정하려했지만 계속 헤더의 [내 계정] 클릭시 https://yunn23.github.io/react-deploy/my-account 로 라우팅되었다가, 로그인 되어있지 않아 https://yunn23.github.io/login 으로 라우팅 되어 404 에러가 뜹니다. 어떻게 수정하는게 좋을까요?
There was a problem hiding this comment.
Usage instructions의 "Copy over the 404.html file to your repo as is" 섹션 보시고 처리해주시겠어요? 커스텀 도메인을 설정하지 않았기 때문에 pathSegmentsToKeep를 1로 설정해야하는거 같구요, <BrowserRouter basename="/react-deploy" />처럼 browser router의 basename을 설정해줘야하는거 같습니다.
도구의 공식 문서에서 내 상황에 맞는 안내가 어떤게 있는지 찬찬히 살펴보시고 대응하시면 조금 더 수월하실 거에요.
|
또, 백엔드에서 넘겨준 링크는 http여서 Mixed Content 에러가 뜨는데 이 경우 백엔드 측에 https로 구현해줄 수 있는지 여쭤봐야할까요? 현재는 mixed content 에러가 떠서 배포 링크에서는 백엔드 데이터가 보이지 않는 것 같습니다. step1, 2를 해결하고 3, 4로 넘어가려고 하다보니 시간이 많이 소요되는점 죄송합니다. |
넵~! |
public/404.html
Outdated
| // If you're creating a Project Pages site and NOT using a custom domain, | ||
| // then set pathSegmentsToKeep to 1 (enterprise users may need to set it to > 1). | ||
| // Otherwise, leave pathSegmentsToKeep as 0. | ||
| var pathSegmentsToKeep = 0; |
There was a problem hiding this comment.
#69 (comment) 코멘트 참고 부탁드려요.
| var pathSegmentsToKeep = 0; | |
| var pathSegmentsToKeep = 1; |
github pages로 배포 진행하였습니다!
🔗 배포링크
문제점
로그인 버튼을 누르면 https://yunn23.github.io/react-deploy/login 으로 나오는 것이 아닌 https://yunn23.github.io/login 으로 라우팅되어 404 페이지가 발생하고 있습니다. 새로고침시 https://yunn23.github.io/react-deploy/ 가 아닌 https://yunn23.github.io/ 로 변해 404가 뜨는 오류는 해결하였지만, 위 에러가 지속되고 있습니다. 라우팅 관련 404 에러 해결을 위해 어떤 부분을 수정해야할까요?
배포 이후 npm run start 시 localhost 3000뒤에 /react-deploy가 붙어서 주소가 출력되면서 실행이 제대로 되지 않고 있습니다. 이를 해결하기 위해 .env로 환경변수 설정을 하여 BrowserRoute의 basename을 env로 변경하였는데도 해결되지 않습니다.
배포 전 로컬에서 실행시 백엔드 api가 실행되었었는데 배포 이후에는 백엔드 서버가 동작하지 않고 있습니다.
이번 기회에 배포를 처음 진행해보면서 개발환경과 동일하게 동작하지 않다는 것을 깨닫게 되었습니다 항상 문제 해결에 도움 주셔서 감사합니다!