CSS Datei aus Unterordner aufrufen.

[CheeseCakeMen]

Folgende Ordner Struktur befindet sich auf meinen Webspace.
root/
..public/
index.php
..source/
..css
..js
..views

Die index.php befindet sich im Ordner: "public"
Via include wird die Header_view.php aufgerufen, welche sich unter "views" befindet.
Da wird die CSS Datei geladen, doch irgendwo habe ich einen Fehler beim aufrufen, da diese nicht gefunden wird.

<link rel="stylesheet" href="../source/css/bootstrap.min.css" integrity="sha384-B0vP5xmATw1+K9KRQjQERJvTumQW0nPEzvF6L/Z6nronJ3oUOFUFpCjEUQouq2+l" crossorigin="anonymous">

Könnte mir jemand auf die Sprünge helfen, warum dies nicht funktioniert? Lokal mit XAMPP geht es es.

 

[Piktogramm]

Ich bin mächtig verwirrt...
Punkte haben Bedeutungen.
. -> Der aktuelle Ordner
.. -> Der übergeordnete Ordner
file -> Datei
file.css -> Datei mit Dateiendung
.file.css -> versteckte Datei
..file.css -> immer noch versteckt

Wenn du deine Ordnerstruktur abbilden willst, mach das doch bitte in Code Blöcken und dann so, wie es "tree" auch machen würde:

~/.config$ tree -L 2
├── Yubico
│   ├── YKPersonalization.conf
│   ├── Yubico Authenticator.conf
│   └── YubiKey Manager.conf
└── zim
    ├── accelmap
    ├── notebooks.list
    ├── preferences.conf
    └── style.conf

Wenn du lokal testest und es gerade irgendwo anders als lokal läuft wären Hinweise gut, wo es gerade wie läuft. Samt Hinweisen dazu welche Rechte und welche Owner für die Ordner und Datei festgelegt sind (und unter welchem User der Webserver(?) läuft).

Und wenn du root/ schreibst, ich hoffe inständig, dass du keinen Server laufen hast, wo der root Nutzer einen public Ordner hat und wo der Webserver im home Ordner dieses Nutzer arbeiten kann!

 

[FranzvonAssisi]

CSS-Dateien werden Client-seitig geladen.

D.h. wenn du “../style.css” schreibst, wäre das auf “xyz.de/abc/def” die Datei “xyz.de/abc/Style.css” und auf “xyz.de” halt ungültig.

Lg

 

[CheeseCakeMen]

~/Websapce
├── public
│   ├── index.php
└── source
    ├── css
    │   ├── bootstrap.min.css
    ├── sites
    ├── js
    ├── views 
       ├── header_view.php
    └── start.php

Habe meine Ordnerstruktur nochmal angepasst. Hoffe das man es jetzt besser sieht.
In der header_view.php wird der Link zur css Datei aufgerufen, allerdings bekomme ich es nicht hin, das er sich die Datei aus einem übergeordneten Ordner holt.

 

[Schempi]

Wenn ich dein Problem nicht total falsch verstehe: Du müsstest Pfad relativ zur index.php setzen, da aus der heraus der Code der includierten php Datei ausgeführt wird.

Edit: Moment, so hast du es eh schon und ich hab mich von der Schreibweise deiner Pfadangabe verwirren lassen, oder? Ist der Include Path zwischen lokalem und externem Server eventuell einfach unterschiedlich konfiguriert?

 

[Piktogramm]

Wenn du lokal testest und es gerade irgendwo anders als lokal läuft wären Hinweise gut, wo es gerade wie läuft. Samt Hinweisen dazu welche Rechte und welche Owner für die Ordner und Datei festgelegt sind (und unter welchem User der Webserver(?) läuft).

Und deine includes, ist das ein php-include oder html-include?
Wird der HTML-Schnippsel aus Post #1 überhaupt mit ausgeliefert, wenn du die Seite mit dem Browser aufrufst? Wenn ja, dann müssten dir die Developer Tools der gängigen Browser auch verraten können was sie machen und woran es liegt, dass der http Request schief geht.

 

[Cool Master]

Sollte eigentlich so gehen:

<link rel="stylesheet" href="/source/css/bootstrap.min.css" integrity="sha384-B0vP5xmATw1+K9KRQjQERJvTumQW0nPEzvF6L/Z6nronJ3oUOFUFpCjEUQouq2+l" crossorigin="anonymous">

 

[CheeseCakeMen]

Es funktioniert leider immer noch nicht. Die PHP Dateien kommen via PHP include und die CSS Datei via HTML Include.

Meine Index.php sieht folgendermaßen aus:

<?php
include(ROOT. "/source/views/header_view.php");
include(ROOT . "/source/views/navigation_view.php");

if(!isset($_GET['load'])){
    $load = 'start.php';
  } else {
    switch($_GET['load']){
      case 'games': $load = 'games.php'; break;
      default: $load = 'error_404.php'; exit;
    }
  }

  if(file_exists(ROOT .'/source/domains/' . $load)) {
    include ROOT .'/source/domains/' . $load ;
  } else {
    throw new \Exception('Ungültiger Zugriff');
  }

include(ROOT . "/source/views/footer_view.php" );


?>

Und meine header_view.php:

<!doctype html>
<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="../source/css/bootstrap.min.css" integrity="sha384-B0vP5xmATw1+K9KRQjQERJvTumQW0nPEzvF6L/Z6nronJ3oUOFUFpCjEUQouq2+l" crossorigin="anonymous">
   
    <title>Games</title>
  </head>
  <body>
  <div></div>

[]
Habe jetzt schon alles versucht, allerdings findet er irgendwie nicht die CSS Datei.

Mit dem Web Developer Tools habe ich geschaut, doch ich finde nicht die Möglichkeit um auszulesen, wie der Pfad heist oder wo was schief gelaufen ist.

 

[Cool Master]

Hab es mal bei mir nachgebaut. Zwei Punkte:

1. Deine HTML Datei ist nicht komplett - siehe Code unten.
2. Es liegt wohl an dem "integrity" im link, zumindest bei mir. Entferne ich diese und greife direkt auf die header_view.php zu sehe ich mein gelben test Kasten im body. Evtl. ist es die falsche Signatur? Da du auf kein CDN zurückgreifst würde ich das aber eh entfernen.

<!doctype html>
<html lang="en">
    <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="/source/css/bootstrap.min.css" integrity="sha384-B0vP5xmATw1+K9KRQjQERJvTumQW0nPEzvF6L/Z6nronJ3oUOFUFpCjEUQouq2+l" crossorigin="anonymous">
    
    <title>Games</title>
    </head>
    <header>
        <!-- Lorem Ipsum -->
    </header>
    <body>
        <!-- Lorem Ipsum -->
    </body>
    <footer>
        <!-- Lorem Ipsum -->
    </footer>
</html>

 

[chainr3action]

~/Websapce
├── public
│   ├── index.php
└── source
    ├── css
    │   ├── bootstrap.min.css
    ├── sites
    ├── js
    ├── views
       ├── header_view.php
    └── start.php

Also laut dieser Struktur lautet der Pfad zur CSS Datei "../css/bootstrap.min.css" und das nur für die header_view.php Datei, also wenn von dort eingebunden wird.
Die header_view.php liegt im Ordner views. Das bedeutet man befindet sich aktuell im Ordner views. Mit .. geht man in der Struktur einen Ordner nach oben. Also ist man nun im source Ordner. Dann geht man wieder runter in den css Ordner.
Hab jetzt die Ordnerstruktur nicht nachgebaut, aber wäre für mich logisch...

Allerdings muss ich hier auch anmerken, dass die Ordnerstruktur generell komplett falsch ist. Ich bin jetzt zwar nicht 100% aktuell im Bereich HTML, aber meiner Meinung nach es liegt IMMER eine index.html im root des Webservers. Daneben liegen Ordner wie css, js, etc. Ordnerstruktur so einfach wie möglich halten, weil sonst kommt es eben zu solchen Pfadkonstrukten wie hier und das für nur zu Problemen...

 

[Piktogramm]

Wenn du lokal testest und es gerade irgendwo anders als lokal läuft wären Hinweise gut, wo es gerade wie läuft. Samt Hinweisen dazu welche Rechte und welche Owner für die Ordner und Datei festgelegt sind (und unter welchem User der Webserver(?) läuft).

Und wenn du root/ schreibst, ich hoffe inständig, dass du keinen Server laufen hast, wo der root Nutzer einen public Ordner hat und wo der Webserver im home Ordner dieses Nutzer arbeiten kann!

CSS-Dateien werden Client-seitig geladen.

D.h. wenn du “../style.css” schreibst, wäre das auf “xyz.de/abc/def” die Datei “xyz.de/abc/Style.css” und auf “xyz.de” halt ungültig.

Lg

Es ist echt beeindruckend, wie viele Hilsesuchenden es immer wieder schaffen, reichlich die Hälfte der Fragen zu ignorieren.

Wenn die Prüfsumme nicht stimmt, sollte das in den Entwicklertools auftauchen, genauso wie nicht erreichbare Pfade. Fast so als wären die Entwicklertools die Werkzeuge zum debuggen eben solcher Fälle...

 

[CheeseCakeMen]

@Cool Master
Danke, aber auch ohne Signatur habe ich das gleiche Problem.


@Piktogramm
Außer einer lokalen Umgebung habe ich nirgends die Möglichkeit es zu testen ob es funktioniert. Lokal jedenfalls funktioniert es.
Nein, ich betreibe keinen eigenen Server sondern nutze All-Inkl.com

Die DevTools zeigen mir in Konsole nur folgende Meldung an:

GET https://webseite.de/css/bootstrap.min.css net::ERR_ABORTED 404

Egal ob ich im Link: : "../ voranstelle oder nicht, jedes mal die selbe Meldung.
Habe jetzt mal den Ordner css in den Source Ordner gelegt, welcher ja der übergeordnete ist, aber auch nichts.

Allerdings muss ich hier auch anmerken, dass die Ordnerstruktur generell komplett falsch ist. Ich bin jetzt zwar nicht 100% aktuell im Bereich HTML, aber meiner Meinung nach es liegt IMMER eine index.html im root des Webservers. Daneben liegen Ordner wie css, js, etc. Ordnerstruktur so einfach wie möglich halten, weil sonst kommt es eben zu solchen Pfadkonstrukten wie hier und das für nur zu Problemen...

Ist noch jemand anders der Meinung, dass die index.php ins Root Verzeichnis muss?

 

[BFF]

Du kannst dem Server sagen, das er die index.* in JWD suchen soll anstatt im / verzeichnis.

Aber ja. Es ist ganz nett, wenn die index.* im / zu finden ist.

 

[Piktogramm]

Vorsicht, die index.php im root Ordner zu haben bedeutet, dass die index.php im Rootverzeichnis des Webservers liegt! Wenn der Aufruf von webseite.de zum Laden der index.php führt, dann ist ~/Webspace/public das Rootverzeichnis welches der Webserver nutzt. An der Stelle ist es dann wie es Franz beschrieben hat, dass es schlicht und ergreifend nicht geht, dass der Browser einen Ebene aufsteigt. Selbst mit einem illegalem Request, müsste das der Webserver blocken, da es zu vermeiden gilt, dass Dritte sich zum / des Systems vorarbeiten.

Es müssten sich also schon alle Inhalte, die ein Browser anzeigen soll, unter dem "public" Ordner einfinden, den der Webserver als Rootverzeichnis der Webseite annimmt. Das PHP-Gerümpel kann auch oberhalb dieses Ordners liegen, die PHP-engine sollte ja mit den Pfaden des Hosts arbeiten.