staging.inyokaproject.org

via DuckDuckGo

nginx + wsgi app: Dateien werden im Browser nicht richtig geladen

Status: Ungelöst | Ubuntu-Version: Ubuntu 20.04 (Focal Fossa)
Antworten |

Glocke

Avatar von Glocke

Anmeldungsdatum:
1. März 2009

Beiträge: 880
Zitieren
11. Januar 2021 12:40 (zuletzt bearbeitet: 11. Januar 2021 13:00)

Hallo,

ich habe ein Problem beim routen einer WSGI-App via Unix-Socket auf einen nginx-Server. Rufe ich die Seite via localhost oder meiner LAN-IP ab geht alles. Nutze ich meine öffentliche IP (btw Port-Forwarding im Router ist aktiv), so wird mir die Seite ohne die via CSS eingebettete Hintergrundgrafik angezeigt (insbesondere wenn ich mit CTRL+F5 neu lade um den Browser-Cache zu ignorieren).

btw 

1
2
$ nginx -v
nginx version: nginx/1.18.0 (Ubuntu)

Da die WSGI-App "direkt" problemlos läuft (mit Host und Port statt Unix-Socket und nginx), bin ich hier im Serverdienste-Bereit des Forums ☺ Ich habe das ganze auf ein Minimalbeispiel runtergebrochen, das ich im Folgenden hier poste (alternativ: http://github.com/cgloeckner/bottle-nginx-issue). Falls es nicht an meiner nginx-Konfiguration liegt so mögen die Admins das bitte ins Programmieren-Unterforum verschieben ^_^

Ordnerstruktur 

Hauptverzeichnis
|-- files
|   |-- background.jpg
|   |-- layout.css
|-- views
|   |-- demo.tpl
|-- server.py
|-- server.conf

Fangen wir mit der nginx-Konfiguration an: server.conf 

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
daemon off;

error_log /tmp/demo-error.log warn;
pid /tmp/demo.pid;

events {}

http {
	map $http_upgrade $connection_upgrade {
		default upgrade;
		''      close;
	}

	access_log /tmp/demo-access.log;
	
	upstream demo {
		server unix:/tmp/demo.sock fail_timeout=0;
	}
	
	server {
		listen 8080;
		server_name 0.0.0.0;
		
		try_files $uri @demo;
		
		location @demo {
			proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
			proxy_set_header X-Forwarded-Proto $scheme;
			proxy_set_header Host $http_host; 
			proxy_http_version 1.1;
			proxy_set_header Upgrade $http_upgrade;
			proxy_set_header Connection $connection_upgrade;
			
			proxy_redirect off;
			proxy_pass http://demo;
		}
	}
}

Hier meine WSGI-App in Python: Wegen des Unix-Sockets habe ich selber einen ServerAdapter geschrieben. Zwecks Testen gibt es einen optionalen --socket-Parameter (damit er via Unix-Socket startet; ansonsten via Host und Port) 

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
#!/usr/bin/python3 
# -*- coding: utf-8 -*- 

from gevent import monkey; monkey.patch_all()

import os, socket, sys
from bottle import ServerAdapter, get, view, static_file, run

from gevent.pywsgi import WSGIServer

class CustomServer(ServerAdapter):
	def __init__(self, unixsocket, **options):
		super().__init__(**options)
		self.unixsocket = unixsocket
		
	def run(self, handler):
		# create listener for unix socket
		if os.path.exists(self.unixsocket):
			os.remove(self.unixsocket)
		listener = socket.socket(socket.AF_UNIX, socket.SOCK_STREAM)
		listener.bind(self.unixsocket)
		listener.listen(1)
		# create server
		server = WSGIServer(listener, handler, **self.options)
		server.serve_forever()

@get('/')
@view('demo')
def test():
	return dict()

@get('/static/<fname>')
def static_files(fname):
	return static_file(fname, root='files')

if '--socket' in sys.argv:
	run(unixsocket='/tmp/demo.sock', server=CustomServer)
else:
	run(host='localhost', port=8000)

Weiter geht's mit dem HTML-Template: minimal gehalten mit Stylesheet views/demo.tpl 

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
<html>
<head>
	<link rel="stylesheet" type="text/css" href="/static/layout.css">
</head>
<body>

<h1>Hello World</h1>

<div class="test">Test</div>

</body>
</html>

Und abschließend das Stylesheet: files/layout.css 

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
body {
	background-color: black;
	
	color: white;
}

div.test {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);

	background-image: url('/static/background.jpg');
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	background-color: black;
	height: 50%;
	width: 50%;
}

Das Bild hänge ich auch an.

PS: Die nginx-logs verraten leider nichts dazu.

/EDIT: Screenshots angehangen

Bilder
Antworten |