Kann ich eine img-source deswegen nicht einbinden, weil ich die HttpResponse in Djangoviews unorthodox zusammenbaue?

Django, Flask, Bottle, WSGI, CGI…
Antworten
AFX
User
Beiträge: 9
Registriert: Samstag 4. September 2021, 08:40

Montag 13. September 2021, 16:15

Ich habe eine views.py-Datei in einem Djangoprojekt. Diese enthält eine Methode (index), welche mir die indexview zusammenbasteln soll.

Leider wird eine Bildressource (c.jpg im folgenden Sourcecode) nicht geladen. Liegt das etwa daran, dass die die html der HttpResponse als String zusammengebaut wird? Anbei der Code:

Code: Alles auswählen

from django.shortcuts import render
from django.http import HttpResponse

# Create your views here.

def index(request):
    res=""
    res=res+"<!DOCTYPE html>"
    res=res+"<html>"
    res=res+"<head>"
    res=res+"<style>"
    res=res+"body { background-color:black; }"
    res=res+"p { color:white; font-size:50px; }"
    res=res+".imag { z-index:-100; position: -webkit-sticky; position: sticky; top: 0; }"
    res=res+".main { background-color:black; height:3000px; }"
    res=res+"</style>"
    res=res+"</head>"
    res=res+"<body>"
    res=res+"<div class='imag'>"
    res=res+"<img src='c.jpg' width='100%' height='500px'></img>"
    res=res+"</div>"
    res=res+"<div class='main'><p style='color:red;margin-top:0px'>ccccc</p></div>"
    res=res+"</div>"
    res=res+"</body>"
    res=res+"</html>"
    
    return HttpResponse(res)

Sirius3
User
Beiträge: 15002
Registriert: Sonntag 21. Oktober 2012, 17:20

Montag 13. September 2021, 16:35

Das liegt wohl eher daran, dass c.jpg nicht gefunden wird. Wie sehen denn Deine Routen zu index.html und c.jpg aus?
AFX
User
Beiträge: 9
Registriert: Samstag 4. September 2021, 08:40

Montag 13. September 2021, 19:32

Interessant. c.jpg lieg nämlich im selben Ordner wie die views.py-Datei.

Ich habe ein Projekt mysite.py, in dem sich eine Datei urls.py befindet, da habe ich den Ordner lk,
in der selbst eine urls.py-Datei ist, wie folgt bekannt gemacht:

Code: Alles auswählen

urlpatterns = [
    path('', include('lk.urls')),
    path('admin/', admin.site.urls),
]
Die urls.py-Datei des Ordners lk sieht wie folgt aus:

Code: Alles auswählen

from django.urls import path

from . import views

urlpatterns = [
    path('', views.index, name='index'),
]
Keine Ahnung, was da falsch sein könnte. Naja, vielleicht werde ich das ganze in ein emplate auslagern, vielleicht geht der Fehler dann weg.
Sirius3
User
Beiträge: 15002
Registriert: Sonntag 21. Oktober 2012, 17:20

Montag 13. September 2021, 19:39

Du hast keine Route zu /c.jpg. Üblich ist es, statische Daten über /static/ auf dem Server anzusprechen und eine entsprechende /static/-Route in Django zu definieren und c.jpg in das passende static-Verzeichnis zu legen.
AFX
User
Beiträge: 9
Registriert: Samstag 4. September 2021, 08:40

Dienstag 14. September 2021, 10:48

Danke für die hilfreichen Beiträge, jetzt klappt's. Ich wusste nicht, dass man so eine Route braucht.
AFX
User
Beiträge: 9
Registriert: Samstag 4. September 2021, 08:40

Dienstag 14. September 2021, 13:01

Oh nun geht es nicht mehr :( Hier mein Template: Das Bild c.jpg findet er, ich habe dann nachträglich eine jQuery-Datei (siehe Code) in denselben Ordner kopier,t wo auch das Bild c.jpg ist - aber das Skript wird nicht mal ausgeführt (der alert wird nicht ausgelöst).

Code: Alles auswählen

<!DOCTYPE html>
<html>
<head>
<style>
 body {
   background-color:black;
 }
 p {
   color:white;
    font-size:50px;
 }
 .imag {
  z-index:-100;
  position: -webkit-sticky; /* Safari */
  position: sticky;
  top: 0;
}
 .main {
 background-color:black;
 height:3000px;
 }
</style>
</head>
<body>
	 {% load static %}
<script src="stylesheet" href="{% static 'static/jquery-3.3.1.js' %}">
	$(document).ready(function() {
		alert("ready!");
		$("html").scrollTop(60);
	});
</script> 
 <div class="imag">
	 {% load static %}
     <img src="{% static 'static/c.jpg' %}" width="100%" height="650px"></img>
</div>
<div class="main"><p style="color:red;margin-top:0px">ccccc</p></div>
</body>
</html>
__deets__
User
Beiträge: 10308
Registriert: Mittwoch 14. Oktober 2015, 14:29

Dienstag 14. September 2021, 13:16

Mir waere nicht bekannt, dass man ein script-Tag sowohl zum nachladen einer Datei nutzen kann, als auch *gleichzeitig* dessen Inhalt ausgefuehrt. Ich haette das getrennt, also zwei Skript-Tags.

Und dann ist natuerlich die Frage: was sagt der Debugger des Browsers, siehst du, ob jquery geladen wird?
Benutzeravatar
__blackjack__
User
Beiträge: 9095
Registriert: Samstag 2. Juni 2018, 10:21
Wohnort: 127.0.0.1
Kontaktdaten:

Dienstag 14. September 2021, 14:17

Ich finde ja das "static/…" ein bisschen irritierend. Hast Du da tatsächlich einen Ordner "static" in einem Ordner "static" oder ist das nicht richtig konfiguriert, oder ist das "static/" tatsächlich einfach zu viel?
“When we write programs that "learn", it turns out that we do and they don't.” — Alan J. Perlis
Benutzeravatar
__blackjack__
User
Beiträge: 9095
Registriert: Samstag 2. Juni 2018, 10:21
Wohnort: 127.0.0.1
Kontaktdaten:

Dienstag 14. September 2021, 14:24

JQuery wird auch nicht geladen werden, denn `href` gibt's bei <script> nicht, das wird einfach ignoriert werden. Und ``src="stylesheet"`` macht auch keinen Sinn. *Da* hätte die URL hingehört.
“When we write programs that "learn", it turns out that we do and they don't.” — Alan J. Perlis
AFX
User
Beiträge: 9
Registriert: Samstag 4. September 2021, 08:40

Dienstag 14. September 2021, 19:44

Vielen Dank für die Tipps, hab es jetz so gelöst:

Code: Alles auswählen

<script type="text/javascript">
	function loadFun() {
		  let intViewportHeight = window.innerHeight;
		  x = document.getElementsByTagName("html")[0];
		  x.scrollTop = (intViewportHeight / 3);
	}
</script> 
Antworten