Go 백엔드를 사용하여 React 프론트엔드를 라우팅할 때 '404 찾을 수 없음' 오류를 어떻게 수정할 수 있나요?
Go에서 프런트엔드 라우팅으로 리디렉션
Go 백엔드와 Go 백엔드를 모두 실행할 때 http://localhost:8090/my_frontend_path와 같은 URL을 사용하여 프런트엔드 경로에 액세스할 수 없음 React 프론트엔드는 근본적인 문제에 기인할 수 있습니다:
The Root 원인
브라우저에서 http://localhost:8090/my_frontend_path에 접속하면 프론트엔드 React 라우터가 아직 활성화되지 않은 상태입니다. 따라서 브라우저는 서버에 페이지를 요청합니다. 그러나 my_frontend_path가 빌드 폴더에 존재하지 않아 404 "페이지를 찾을 수 없음" 오류가 발생합니다.
간단한 서버측 솔루션
이 문제를 해결하는 한 가지 간단한 방법은 다음과 같습니다. Go 서버 수준에서 "포괄적" 접근 방식을 구현합니다. 여기에는 다른 곳에서 명시적으로 처리되지 않은 모든 경로에 대해 index.html(결과적으로 앱)을 반환하는 작업이 포함됩니다. 예는 다음과 같습니다.
const FSPATH = "./build/"
func main() {
fs := http.FileServer(http.Dir(FSPATH))
http.HandleFunc("/my_api", func(w http.ResponseWriter, _ *http.Request) { w.Write([]byte("API CALL")) })
http.HandleFunc("/", func(w http.ResponseWriter, r *http.Request) {
// If the requested file exists, return it; otherwise return index.html (fileserver default page)
if r.URL.Path != "/" {
fullPath := FSPATH + strings.TrimPrefix(path.Clean(r.URL.Path), "/")
_, err := os.Stat(fullPath)
if err != nil {
if !os.IsNotExist(err) {
panic(err)
}
// Requested file does not exist so we return the default (resolves to index.html)
r.URL.Path = "/"
}
}
fs.ServeHTTP(w, r)
})
http.ListenAndServe(":8090", nil)
}
이 코드는 요청된 파일이 있는지 확인합니다. 존재하지 않는 경우 요청된 경로를 "/"로 변경합니다. 그러면 index.html로 리디렉션되고 React 라우터가 라우팅을 처리할 수 있습니다.
해시 기록 대안
또 다른 옵션은 React 애플리케이션에 해시 기록을 사용하는 것입니다. 이 방법을 사용하면 my_frontend_path URL에 대한 초기 요청이 Go 서버와 상호 작용하지 않습니다. 대신 React 라우터에 의해 전적으로 처리됩니다. 해시 기록은 React 앱의 createBrowserHistory 또는 createHashHistory 함수에서 구성할 수 있습니다.
위 내용은 Go 백엔드를 사용하여 React 프론트엔드를 라우팅할 때 '404 찾을 수 없음' 오류를 어떻게 수정할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
핫 AI 도구
Undress AI Tool
무료로 이미지를 벗다
Undresser.AI Undress
사실적인 누드 사진을 만들기 위한 AI 기반 앱
AI Clothes Remover
사진에서 옷을 제거하는 온라인 AI 도구입니다.
Stock Market GPT
더 현명한 결정을 위한 AI 기반 투자 연구
인기 기사
뜨거운 도구
메모장++7.3.1
사용하기 쉬운 무료 코드 편집기
SublimeText3 중국어 버전
중국어 버전, 사용하기 매우 쉽습니다.
스튜디오 13.0.1 보내기
강력한 PHP 통합 개발 환경
드림위버 CS6
시각적 웹 개발 도구
SublimeText3 Mac 버전
신 수준의 코드 편집 소프트웨어(SublimeText3)
GO 인터페이스 : 비 포르지 구현 하에서 필요성
Sep 09, 2025 am 11:09 AM
GO의 인터페이스는 유형의 명시 적 선언 구현을 강요하지는 않지만, 다형성 및 코드 디커플링을 구현하는 데 여전히 중요합니다. 메소드 서명 세트를 정의함으로써 인터페이스를 통해 다른 유형을 통합 방식으로 처리 할 수있어 유연한 코드 설계 및 확장 성이 가능합니다. 이 기사는 GO 인터페이스의 특성을 깊이 탐구하고 예제를 통해 실제 개발에서 적용 값을 보여줍니다.
GO 빌드 중에 컴파일에 관련된 파일을 결정하는 방법은 무엇입니까?
Sep 09, 2025 am 11:57 AM
이 기사는 개발자가 GO 프로젝트에서 컴파일 및 링크 될 파일을 결정하는 방법, 특히 시스템 별 파일이 존재하는 경우 개발자가 어떤 파일을 컴파일하고 연결하는지 이해하는 데 도움이됩니다. GO 빌드 -N 명령을 사용하여 출력을 구문 분석하고 GO/빌드 패키지의 가져 오기 기능을 사용합니다. 이러한 방법을 사용하면 빌드 프로세스를 명확하게 이해하고 프로젝트를 더 잘 관리 할 수 있습니다.
Go 프로그램에서 외부 편집자를 시작하고 완료되기를 기다립니다.
Sep 16, 2025 pm 12:21 PM
이 기사에서는 GO 프로그램에서 외부 편집기 (예 : Vim 또는 Nano)를 시작하는 방법에 대해 설명하고 프로그램이 계속 실행되기 전에 사용자가 편집기를 닫을 때까지 기다립니다. CMD.stdin, CMD.Stdout 및 CMD.Stderr를 설정하면 편집기가 터미널과 상호 작용하여 시작 실패 문제를 해결할 수 있습니다. 동시에, 완전한 코드 예제가 표시되고 개발자 가이 기능을 원활하게 구현할 수 있도록 예방 조치가 제공됩니다.
Golang에서 사용되는 빈 구조 구조 {}는 무엇입니까?
Sep 18, 2025 am 05:47 AM
Struct {}는 GO의 필드리스 구조로 제로 바이트를 차지하며 데이터가 필요하지 않은 시나리오에서 종종 사용됩니다. Goroutine 동기화와 같은 채널의 신호로 사용됩니다. 2. 효율적인 메모리에서 주요 존재 검사를 달성하기 위해 값 유형의 맵 모음으로 사용됩니다. 3. 종속성 주입 또는 조직 기능에 적합한 정의 가능한 상태없는 방법 수신기. 이 유형은 제어 흐름과 명확한 의도를 표현하는 데 널리 사용됩니다.
GO WEBSOCKE EOF 오류를 해결하십시오. 연결을 계속 활성화하십시오
Sep 16, 2025 pm 12:15 PM
이 기사는 GO를 사용하여 WebSocket을 개발할 때 발생하는 EOF (파일 끝) 오류를 해결하는 것을 목표로합니다. 이 오류는 일반적으로 서버가 클라이언트 메시지를 수신하고 연결이 예기치 않게 닫히면 후속 메시지를 정상적으로 전달할 수 없습니다. 이 기사는 문제의 원인을 분석하고 코드 예제를 제공하며 개발자가 안정적이고 신뢰할 수있는 WebSocket 애플리케이션을 구축 할 수 있도록 해당 솔루션을 제공합니다.
Golang에서 파일을 어떻게 읽고 쓰나요?
Sep 21, 2025 am 01:59 AM
goprovidessimpleanfilefile handlingsingtheosandbufiopackages.toreadasmallfileentirely, useos.readfile, whithloadsTecontintomemorySafelyAntomatically ManagestomanagesTomanagesFileOperations.forlageFilesorincrementalprocessing, bufio.scannerallows-by-lyiner
Golang 웹 서버의 맥락에서 미들웨어는 무엇입니까?
Sep 16, 2025 am 02:16 AM
MiddlewareWebServersErsectionstttprequestsBeeReachtheHandler, enableRusableCross-CuttingFunctionality; workgrappingHandlerstoaddpre-andpost-processinglogicsuchaslogging, Authentication, Cors, OrerrorRecovery 및 Canbechai
Golang의 파일에서 구성을 읽는 방법
Sep 18, 2025 am 05:26 AM
표준 라이브러리의 인코딩/JSON 패키지를 사용하여 JSON 구성 파일을 읽습니다. 2. yaml 형식 구성을 읽으려면 gopkg.in/yaml.v3 라이브러리를 사용하십시오. 3. os.getenv 또는 Godotenv 라이브러리를 사용하여 파일 구성을 덮어 쓰십시오. 4. Viper 라이브러리를 사용하여 다중 형식 구성, 환경 변수, 자동 재 장전과 같은 고급 기능을 지원합니다. 유형 안전을 보장하기 위해 구조를 정의하고, 파일 및 파싱 오류를 올바르게 처리하고, 구조 태그 매핑 필드를 올바르게 사용하고, 하드 코딩 된 경로를 피하고, 생산 환경에서 환경 변수 또는 안전한 구성 저장을 사용하는 것이 좋습니다. 요구 사항이 복잡 할 때 간단한 JSON으로 시작하여 Viper로 마이그레이션 할 수 있습니다.
