Html /css avec python

Bonjour,

Tu devrais essayer avec le lien relatif vers ton CSS, il ne faut pas chercher "file:///" car le serveur ne connait pas ça

salut

oui j'ai essayé avec le lien relatif :

href= "C:\\Users\\USER\PycharmProjects\chatroom\style.css"

ca ne fonctionne pas !

merci bien

Bonjour,

Comme je te l'ai expliqué dans ton autre discussion, les classes de bases fournies par python sont assez laborieuses à utiliser (et en plus les tutoriels diffèrent entre python2 et python3 car le paquet http n'est pas organisé pareil). Tu aurais meilleur temps d'utiliser cherrypy.

Mais bref, voici un exemple minimal qui met en évidence un CGI python avec CSS en utilisant le module http en python3. Tous les fichiers qui suivent doivent être positionnés dans le même dossier.

main.py

import time
import http.server
import cgitb; cgitb.enable()  ## This line enables CGI error reporting
from my_handler import MyHandler

server = http.server.HTTPServer
server_address = ("localhost", 8000)
handler = MyHandler
handler.cgi_directories = ["/"]
print(time.asctime(), "Start Server - %s:%s" % server_address)
try:
    httpd = server(server_address, handler)
    httpd.serve_forever()
except KeyboardInterrupt:
    pass
httpd.server_close()
print(time.asctime(), "Stop Server - %s:%s" % server_address)

On prépare le serveur web avec notre propre handler. C'est ce handler qui implémente le comportement du serveur en fonction de l'URI reçue.

main.css

body {
    background-color: #222;
}

h1 {
    color: red;
}

Lorsque le CSS est en action, les titres sont en rouge et le fond est gris foncé.

my_handler.py

import http.server
import traceback

class MyHandler(http.server.CGIHTTPRequestHandler):
    def do_GET(self):
        if self.path.endswith(".py"):
            super().do_GET()
        else:
            try:
                filename = self.path.lstrip("/")
                with open(filename) as f:
                    data = f.read()
                    self.send_response(200)
                    self.end_headers()
                    self.wfile.write(bytes(data, "utf-8"))
            except Exception:
                self.send_error(404, traceback.format_exc())

Ici on rattrape "en CGI" tout appel à une URI qui se finit par ".py" (par exemple "/test_cgi.py"). Sinon on sert le fichier comme un fichier texte (en particulier quand il s'agit d'un fichier css. Cette modification de do_GET nécessaire, sinon la classe Server tente d'exécuter le fichier css comme s'il s'agissait d'un script.

Note qu'on peut améliorer le handler pour rediriger l'URI / vers /index.html, ce qui permettra d'afficher cette page si on va sur http://localhost:8000.

import http.server
import traceback

class MyHandler(http.server.CGIHTTPRequestHandler):
    def do_GET(self):
        if self.path.endswith(".py"):
            super().do_GET()
        else:
            try:
                filename = self.path.lstrip("/")
                if not filename:
                    filename = "index.html"
                with open(filename) as f:
                    data = f.read()
                    self.send_response(200)
                    self.end_headers()
                    self.wfile.write(bytes(data, "utf-8"))
            except Exception:
                self.send_error(404, traceback.format_exc())

index.html

Ce fichier n'est pas nécessaire dans l'absolu mais permet d'avoir quelque chose à afficher quand on va sur http://localhost:8000

<!DOCTYPE html>
<html> 
    <head>
        <meta charset="utf-8" />
        <link rel="stylesheet" href="/main.css">
    </head>
    <body>  
        <h1>Page par défaut index.html</h1>
    </body> 
</html>

test_cgi.py

#!/usr/bin/env python3
from datetime import date


# https://docs.python.org/3/library/cgi.html
print("Content-type: text/html")
print("")

# Now let's play
TEMPLATE_HTML = """<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <link rel="stylesheet" href="/main.css">
    </head>
    <body>
        %s
    </body>
</html>"""
today = date.today()
print(TEMPLATE_HTML % f"""
<h1>Date du jour<h1>
{today}
""")

Trois points pour que ça marche :

1) Le CGI doit avoir des droits en exécution. Sous Linux on lancerait donc :

chmod a+x test_cgi.py

2) Le CGI doit être dans l'un des dossiers référencés par handler.cgi_directories.  Ici, notre CGI est dans le même dossier que le script python qui lance le serveur, ce qui correspond dossier / et est donc conforme à handler.cgi_directories.

3) Le shebang du CGI doit permettre au système d'exploitation de trouver l'interpréteur (ici l'interpréteur python) à utiliser pour exécuter le script. Dans l'absolu, le serveur web pourrait servir à la fois des fichiers écrits python et pourquoi pas des fichiers écrits en perl ou en php. La décision est prise en fonction de cette liste.

Sous Linux, la manière propre de récupérer le chemin de l'interpréteur python est :

#!/usr/bin/env python3

Je laisse le soin aux personnes sous Windows de préciser comment on fait dans ce cas, personnellement, je ne sais pas.

Tests

On lance le serveur :

python3 main.py

Puis on peut tenter dans le navigateur d'accéder à :

• http://localhost:8000/hello.py
• http://localhost:8000/index.html et son alias http://localhost:8000/
• http://localhost:8000/main.css
• http://localhost:8000/test_cgi.py

Bonne chance

bonsoir 

merci beaucoup pour votre réponse 

voila dans mon dossier chatroom j'ai le script index.py et mon fichier css 

ce que je fait :

href="chatroom/style.css" écrit dans index.py

mais pourquoi ca ne fonctionne pas je tourne en rond depuis des jours .

salutations

slt

j'ai corrigé ca fonctionne merci faut créer un sous dossier .