목차
질문 내용
Solution
백엔드 개발 Golang Docker의 nginx에서 제공하는 스타일과 이미지가 페이지에서 작동하지 않습니다.

Docker의 nginx에서 제공하는 스타일과 이미지가 페이지에서 작동하지 않습니다.

Feb 09, 2024 am 08:00 AM

docker 中 nginx 提供的样式和图像在页面上不起作用

PHP 편집기 Youzi는 Docker에서 nginx를 사용할 때 스타일과 이미지가 페이지에 올바르게 표시되지 않는 문제에 직면할 수 있다는 것을 발견했습니다. 이는 구성 문제 또는 잘못된 경로 때문일 수 있습니다. 이 문제를 해결하기 전에 nginx 구성 파일과 파일 경로를 주의 깊게 확인하여 올바르게 설정되고 참조되는지 확인해야 합니다. 다음으로, 이 귀찮은 문제를 해결하는 데 도움이 되는 몇 가지 일반적인 솔루션을 살펴보겠습니다.

질문 내용

저는 golang 웹 애플리케이션을 가지고 있고 그 앞에 Nginx를 사용하여 정적 파일을 제공하고 이를 웹 애플리케이션의 역방향 프록시로 사용하기로 결정했습니다.

웹 애플리케이션용 Dockerfile:

으아악

Docker 작성 파일:

으아악

및 nginx 구성:

으아악

웹 페이지에 두 개의 이미지가 있습니다. 하나는 png이고 다른 하나는 svg입니다. CSS 파일은 매우 간단하며 본문 태그로 background-color: lightblue만 포함하고, js 파일은 콘솔에 "Loaded!"라는 문자열만 기록합니다. docker compose를 사용하여 컨테이너를 시작한 후 다음 문제가 발생했습니다.

  1. 정적 파일은 무작위로 제공됩니다. 예를 들어 png 이미지는 표시되지만 svg는 표시되지 않고, CSS 스타일은 페이지에 적용되지 않지만 자바스크립트 코드는 제대로 실행됩니다. 흥미롭게도 브라우저의 개발 도구 네트워크 탭에 따라 모든 정적 파일을 성공적으로 가져왔고 해당 내용을 검사할 수 있습니다. 예, 캐싱 없이 페이지를 다시 로드해 보았지만 소용이 없었습니다. 이건 무슨 마법인가요?
  2. 내 docker compose 파일에서 볼 수 있듯이 nginx와 webapp에 대한 볼륨을 설정했습니다. nginx의 경우 잘 작동합니다. 일부 자산을 삭제하고 캐싱 없이 페이지를 다시 로드할 때마다 변경 사항이 적용되지만 템플릿의 텍스트는 페이지에 표시되지 않지만 webapp의 컨테이너로 이동하여 템플릿의 콘텐츠를 검사하면 변경되지만 페이지에서는 docker compose를 사용하여 컨테이너를 다시 시작할 때까지 표시되지 않습니다. 여기에 문제가 있나요?

전체 코드는 여기 - https://github.com/ivnku/tmp

Solution

  1. go Fiber의 templateEngine.Reload(true)을 통해 이 기능을 제공합니다.
으아악
  1. 정적 파일은 실제로 Nginx에서 제공되지만 올바른 MIME 유형이 없습니다. nginx.conf의 http 섹션에 MIME 유형을 포함하면 이 문제가 해결됩니다.
으아악

위 내용은 Docker의 nginx에서 제공하는 스타일과 이미지가 페이지에서 작동하지 않습니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.

핫 AI 도구

Undresser.AI Undress

Undresser.AI Undress

사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover

AI Clothes Remover

사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool

Undress AI Tool

무료로 이미지를 벗다

Clothoff.io

Clothoff.io

AI 옷 제거제

AI Hentai Generator

AI Hentai Generator

AI Hentai를 무료로 생성하십시오.

뜨거운 도구

메모장++7.3.1

메모장++7.3.1

사용하기 쉬운 무료 코드 편집기

SublimeText3 중국어 버전

SublimeText3 중국어 버전

중국어 버전, 사용하기 매우 쉽습니다.

스튜디오 13.0.1 보내기

스튜디오 13.0.1 보내기

강력한 PHP 통합 개발 환경

드림위버 CS6

드림위버 CS6

시각적 웹 개발 도구

SublimeText3 Mac 버전

SublimeText3 Mac 버전

신 수준의 코드 편집 소프트웨어(SublimeText3)

Go Language Pack 가져 오기 : 밑줄과 밑줄이없는 밑줄의 차이점은 무엇입니까? Go Language Pack 가져 오기 : 밑줄과 밑줄이없는 밑줄의 차이점은 무엇입니까? Mar 03, 2025 pm 05:17 PM

이 기사에서는 GO의 패키지 가져 오기 메커니즘을 설명합니다. 명명 된 수입 (예 : 가져 오기 & quot; fmt & quot;) 및 빈 가져 오기 (예 : import _ & quot; fmt & quot;). 명명 된 가져 오기는 패키지 내용을 액세스 할 수있게하고 빈 수입은 t 만 실행합니다.

Beego 프레임 워크에서 페이지간에 단기 정보 전송을 구현하는 방법은 무엇입니까? Beego 프레임 워크에서 페이지간에 단기 정보 전송을 구현하는 방법은 무엇입니까? Mar 03, 2025 pm 05:22 PM

이 기사에서는 웹 애플리케이션에서 페이지 간 데이터 전송에 대한 Beego의 NewFlash () 기능을 설명합니다. NewFlash ()를 사용하여 컨트롤러간에 임시 메시지 (성공, 오류, 경고)를 표시하여 세션 메커니즘을 활용하는 데 중점을 둡니다. 한계

MySQL 쿼리 결과 목록을 GO 언어로 사용자 정의 구조 슬라이스로 변환하는 방법은 무엇입니까? MySQL 쿼리 결과 목록을 GO 언어로 사용자 정의 구조 슬라이스로 변환하는 방법은 무엇입니까? Mar 03, 2025 pm 05:18 PM

이 기사에서는 MySQL 쿼리 결과를 GO 구조 슬라이스로 효율적으로 변환합니다. 수동 구문 분석을 피하고 최적의 성능을 위해 데이터베이스/SQL의 스캔 방법을 사용하는 것을 강조합니다. DB 태그 및 Robus를 사용한 구조물 필드 매핑에 대한 모범 사례

이동 중에 테스트를 위해 모의 개체와 스터브를 작성하려면 어떻게합니까? 이동 중에 테스트를 위해 모의 개체와 스터브를 작성하려면 어떻게합니까? Mar 10, 2025 pm 05:38 PM

이 기사는 단위 테스트를 위해 이동 중에 모의와 스터브를 만드는 것을 보여줍니다. 인터페이스 사용을 강조하고 모의 구현의 예를 제공하며 모의 집중 유지 및 어설 션 라이브러리 사용과 같은 모범 사례에 대해 설명합니다. 기사

GO에서 제네릭에 대한 사용자 정의 유형 제약 조건을 어떻게 정의 할 수 있습니까? GO에서 제네릭에 대한 사용자 정의 유형 제약 조건을 어떻게 정의 할 수 있습니까? Mar 10, 2025 pm 03:20 PM

이 기사에서는 GO의 제네릭에 대한 사용자 정의 유형 제약 조건을 살펴 봅니다. 인터페이스가 일반 함수에 대한 최소 유형 ​​요구 사항을 정의하여 유형 안전 및 코드 재사성을 향상시키는 방법에 대해 자세히 설명합니다. 이 기사는 또한 한계와 모범 사례에 대해 설명합니다

편리하게 GO 언어로 파일을 작성하는 방법? 편리하게 GO 언어로 파일을 작성하는 방법? Mar 03, 2025 pm 05:15 PM

이 기사는 OS.WriteFile (작은 파일에 적합)과 OS.OpenFile 및 Buffered Writes (큰 파일에 최적)를 비교하여 효율적인 파일 쓰기를 자세히 설명합니다. 강력한 오류 처리, 연기 사용 및 특정 오류 확인을 강조합니다.

GO에서 단위 테스트를 어떻게 작성합니까? GO에서 단위 테스트를 어떻게 작성합니까? Mar 21, 2025 pm 06:34 PM

이 기사는 GO에서 단위 테스트 작성, 모범 사례, 조롱 기술 및 효율적인 테스트 관리를위한 도구를 다루는 것에 대해 논의합니다.

추적 도구를 사용하여 GO 응용 프로그램의 실행 흐름을 이해하려면 어떻게해야합니까? 추적 도구를 사용하여 GO 응용 프로그램의 실행 흐름을 이해하려면 어떻게해야합니까? Mar 10, 2025 pm 05:36 PM

이 기사는 추적 도구를 사용하여 GO 응용 프로그램 실행 흐름을 분석합니다. 수동 및 자동 계측 기술, Jaeger, Zipkin 및 OpenTelemetry와 같은 도구 비교 및 ​​효과적인 데이터 시각화를 강조합니다.

See all articles