Der PHP-Editor Baicao führte ein, dass bei der Verwendung des Nginx-Reverse-Proxys unter nixOS manchmal ein Problem auftritt: Beim Versuch, CSS/JS zu laden, wird ein 404-Fehler zurückgegeben. Dieses Problem kann dazu führen, dass der Stil und die Funktionalität der Website nicht richtig angezeigt werden. Um dieses Problem zu lösen, müssen wir überprüfen, ob die Nginx-Konfiguration und der Dateipfad korrekt sind, und sicherstellen, dass der Proxyserver korrekt auf die erforderlichen statischen Ressourcen zugreifen und diese laden kann. Durch sorgfältige Fehlerbehebung und Fehlerbehebung können wir dieses Problem lösen und den normalen Betrieb der Website sicherstellen.
Ich habe die nixos
来运行 nginx
作为 docker 容器的反向代理。在docker容器中运行一个golang
服务器,它使用函数处理/
,并从两个文件夹static
和js
Rückgabedatei eingerichtet. Es läuft auf Port 8181. Der Code lautet wie folgt:
func main() { static := http.fileserver(http.dir("static")) js := http.fileserver(http.dir("js")) http.handle("/static/", http.stripprefix("/static/", static)) http.handle("/js/", http.stripprefix("/js/", js)) // register function to "/" http.handlefunc("/", indexhandler) fmt.println("server is starting...") err := http.listenandserve("0.0.0.0:8181", nil) if err != nil { log.fatal("cannot listen and server", err) } } func indexhandler(w http.responsewriter, r *http.request) { wd, err := os.getwd() var static = filepath.join(wd, "static") var index = filepath.join(static, "index.html") if err != nil { log.fatal("cannot get working directory", err) } // check if the request is an options preflight request if r.method == "options" { // respond with status ok to preflight requests w.writeheader(http.statusok) return } // post-request if r.method == http.methodpost { // do something } else { // loading the index.html without any data tmpl, err := template.parsefiles(index) err = tmpl.execute(w, nil) // write response to w if err != nil { http.error(w, err.error(), http.statusinternalservererror) log.fatal("problem with parsing the index template ", err) } } }
Der Aufbau meiner Bewerbung sieht wie folgt aus.
├── web │ ├── dockerfile │ ├── go.mod │ ├── server.go │ └── static │ │ ├── index.html │ │ ├── style.css │ │ └── table.html │ └── js │ └── htmx.min.js
configuration.nix
中 nginx
-Teils ist wie folgt.
services.nginx = { enable = true; recommendedGzipSettings = true; recommendedOptimisation = true; recommendedProxySettings = true; recommendedTlsSettings = true; virtualHosts."myapp" = { sslCertificate = "/etc/ssl/nginx/ssl.cert"; sslCertificateKey = "/etc/ssl/nginx/ssl.key"; sslTrustedCertificate = "/etc/ssl/nginx/ssl.chain"; forceSSL = true; # Redirect HTTP to HTTPS locations = { "/myapp" = { proxyPass = "http://localhost:8181/"; }; }; extraConfig = '' proxy_set_header Host $host; proxy_set_header X-Forwarded-Proto $scheme; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; ''; }; };
Wenn ich https://server/myapp
时,index.html
将加载,但 style.css
和 htmx.min.js
anspreche, wird 404 zurückgegeben.
Wenn Sie den Container über Port 8181 statt über die URL (http://server:8181
) ansprechen, wird alles wie gewohnt geladen.
Ich möchte, dass Nginx Anforderungen zum Laden von CSS und JS in den Container umleitet.
Herausgeber:
Der genaue Fehler ist: get https://server.name/static/style.css net::err_aborted 404
即使我正在访问 https://server.name/myapp
.
Eine weitere wichtige Information ist, dass ich auf diese Weise mehrere Container über denselben Reverse-Proxy ausführen möchte. Daher funktioniert die Weiterleitung von css
- oder js
-Dateien an denselben Speicherort nicht. css
- 或 js
-files 定向到同一位置将不起作用。
请检查 index.html
-Datei. Sie verweisen höchstwahrscheinlich über absolute Pfade wie diesen: /myapp
<html> <head> <link rel="stylesheet" type="text/css" href="/static/style.css" /> <script src="/js/htmx.min.js"></script> </head> </html>
<html> <head> <link rel="stylesheet" type="text/css" href="./static/style.css" /> <script src="./js/htmx.min.js"></script> </head> </html>
index.html
Bei dieser Methode können leicht Fehler passieren. Ein besserer Ansatz besteht darin, die App so zu ändern, dass Inhalte unter : bereitgestellt werden
http.handle("/myapp/static/", http.stripprefix("/myapp/static/", static)) http.handle("/myapp/js/", http.stripprefix("/myapp/js/", js)) http.handlefunc("/myapp/", indexhandler)
-Datei: /myapp/
<html> <head> <link rel="stylesheet" type="text/css" href="/myapp/static/style.css" /> <script src="/myapp/js/htmx.min.js"></script> </head> </html>
locations = { "/myapp/" = { proxyPass = "http://localhost:8181/myapp/"; }; };
Das obige ist der detaillierte Inhalt vonDer Nginx-Reverse-Proxy unter NixOS gibt 404 zurück, wenn versucht wird, CSS/JS zu laden. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!