Frontend

Chrome PNA CORS 에러 처리 - "The request client is not a secure context and the reso

로컬 서버에서 CORS 요청을 전부 처리해줬는데 다음과 같은 에러가 발생하면서 요청에 실패하셨나요?"The request client is not a secure context and the resource is in more-private adress space local" 이럴 때에는 크롬 브라우저의 설정을 변경하면 문제를 해결할 수 있습니다. 1. 크롬 창에 chrome://flags/#block-insecure-private-network-requests 입력 2. Block insecure private network requests. 를 Disable로 바꾼다.3. Send Private Network Access preflights 를 Disable로 바꾼다. 주의: 테스트가 끝나면 설정값을..

robots.txt와 sitemap

robots.txt robots.txt 파일은 검색엔진으로부터 검색을 어떻게 허용할 것인지 규칙을 관리합니다. 웹서버의 루트 디렉토리에 위치해야 하고, 만약 robots.txt 파일이 존재하지 않다면 검색엔진에서 검색이 안되는 것이죠 ㅜ 웹앱을 살펴보니 robots.txt는 있지만 검색이 안되도록 설정되어 있더라구요! 다음과 같이 수정해서 검색을 허용시켰습니다! 한번 검색이 되나 볼까요? 페이지를 넘겨도 검색이 되지 않더라구요 ㅜ sitemap. 파일이란 robots.txt 가 검색 엔진의 허용을 제어하는 파일이었다면 sitemap.xml은 검색 엔진이 어떤 주소에 접속할 수 있는지 알려주는 네비게이션 역할을 합니다. sitemap 파일은 html, xml의 형태를 가질 수 있고 수동으로 생성할 수도 있..

웹앱 배포 했으면 구글에서 검색도 가능해야지! - 구글 서치 콘솔 설정하기

이번에 react를 공부하면서 간단한 웹앱을 만들고 배포까지 해봤습니다. 2022.09.26 - [aws] - AWS S3의 정적 웹사이트 호스팅을 활용한 간단한 웹앱 배포 방법 그런데 이렇게 만들어도 구글에서 검색이 안된다는 것 아셨나요? 제가 만든 웹앱을 구글 검색엔진에서 검색이 되게 하려면 구글 서치 콘솔에 등록해줘야 하더라구요! https://search.google.com/search-console/about 구글 서치 콘솔에 웹앱 등록 1. 구글 서치 콘솔 접속 구글 서치 콘솔에 접속해서 시작하기 버튼을 누르면 웹앱을 등록할 수 있습니다. 2. 웹앱 등록하기 표시된 부분을 클릭하여 속성 추가하기를 누릅니다. 속성 추가하기를 클릭하면 다음과 같은 창이 나오는데 URL 접두어 부분에 웹앱 주소를 ..

Node v18.9.1 사용 시, "Error: error:0308010C:digital envelope routines::unsupported"

간단하게 웹앱을 만들어보려고 NVM을 설치해서 가장 최신 버전의 Node를 설치했다. 리액트 앱을 만든 뒤, 실행하는데 갑자기 이런 에러가 뜨는 것이 아닌가? 부랴부랴 인터넷을 찾아보니 Node 버전을 낮추라고 하는 것이다;;; Node 버전을 16.13으로 낮추니 문제가 해결되었다. 구체적인 이유는 나중에 찾아봐야겠다;;