Die HTTPS-Verbindung ist aufgrund von Bildern "nicht sicher"

14

Ich arbeite zurzeit an einer Website und habe mein SSL-Zertifikat erfolgreich installiert.

Der GeoTrust SSL / TLS-Checker hat bestätigt, dass die Zertifikatskette (einschließlich der Zertifizierungsstelle) ordnungsgemäß installiert wurde. Auf Chrome sieht alles gut aus, aber mein Vorhängeschloss ist nicht grün und in Firefox heißt es tatsächlich, dass die Website nicht sicher ist, weil sich unverschlüsselte Elemente darauf befinden.

Ich habe einen Onlinedienst verwendet, um zu überprüfen, warum dies so ist, und es hat sich herausgestellt, dass meine Bilder tatsächlich nicht als sichere URLs gelten. Wie gehe ich mit dieser Situation um, oder wie binde ich Bilder sicher in meine Website ein?

mti_
quelle

Antworten:

32

Ihre Bild-Tags müssen derzeit so aussehen:

<img src="http://example.com/images/image.jpg">

Das httpbedeutet, dass das Image NICHT sicher geliefert wird. Ein Angreifer kann das Bild während der Übertragung ändern und dadurch das Erscheinungsbild Ihrer ansonsten sicheren Seite für Ihre Benutzer ändern.

Sie können stattdessen eine der folgenden Methoden verwenden, um die Bilder sicher bereitzustellen:

  • Link zu httpsexplizit:<img src="https://example.com/images/image.jpg">
  • Verwenden Sie die relative Verknüpfung zu Bildern in Ihrer eigenen Domain: <img src="/images/image.jpg">
  • Verwenden Sie die protokollbezogene Verknüpfung, um Bilder aus anderen Domänen zu verwenden: <img src="//example.com/images/image.jpg">

Explicit httpsliefert das Bild immer sicher (auch wenn die Seite nicht sicher geliefert wird), während relative Verknüpfungen das Bild nur dann sicher liefern, wenn die Seite sicher geliefert wird.

In Firefox und Chrome können Sie auf das Vorhängeschloss klicken und weitere Informationen zum Problem erhalten. Nachdem Sie dies getan haben, sehen Sie hier einen Screenshot von Firefox, der eine Liste aller Bilder auf der Seite zeigt. Es ist einfach, die Liste zu scannen und festzustellen, welche http:

Stephen Ostermiller
quelle
2
"Ein Angreifer könnte das Bild während der Übertragung ändern und dadurch das Aussehen Ihrer ansonsten sicheren Seite für Ihre Benutzer ändern." - oder sogar eine Sicherheitslücke im Renderer auslösen.
John Dvorak
2
Und entführen Cookies, die Zugriffstoken enthalten können.
Darkhogg
Es hört sich sehr nach dem an, was empfohlen wird. Dank dir habe ich es geschafft, mein grünes Vorhängeschloss zu bekommen, aber ein Freund sagte, dass das Verschlüsseln von Bildern die Seite verlangsamen könnte. Ist das ein Problem in meinem Fall?
mti_
3
Die Verschlüsselung ist sicherlich mit einem gewissen Aufwand verbunden, der jedoch heutzutage in der Regel nicht mehr als 10% beträgt. Diese Leistungsstrafe (auch für Bilder) ist der Preis, den Sie für eine sichere Site zahlen müssen.
Stephen Ostermiller
whynopadlock.com ist ein praktisches Tool, um die unsicheren Ressourcen unter einer bestimmten URL schnell zu lokalisieren.
Ville
5

Das Problem ist, dass Ihre Seite im Gegensatz zu https Links von einem http-Speicherort aus bereitstellt. Dies ist auf die Verwendung absoluter http-Links zu Referenzressourcen wie Bildern zurückzuführen. Es gibt zwei bessere Methoden, mit denen Sie auf Links in http oder https verweisen und dieses Problem vermeiden können.

Es erfordert, dass Sie diese Links finden und entweder ändern zu:

  1. Relative Links: dh./wp-content/yourtheme/images/image1.jpg
  2. Oder platzieren Sie // an der Vorderseite der Domain wie in //example.com/wp-content/wp-content/yourtheme/images/image1.jpg Dies wird dann diese Ressourcen über http oder https versorgen, je nachdem, welche Anforderung gestellt wurde.

Sowohl in Chrome als auch in Firefox können Sie auf das Vorhängeschlosssymbol und anschließend auf "Durchklicken" klicken, um eine Liste der fehlerhaften unsicheren Links anzuzeigen. Und wenn Sie keine im Browser hervorgehobenen Bilder oder anderen Ressourcen sehen können, aber dennoch Fehler auftreten, stellen Sie möglicherweise fest, dass es einen JavaScript-Aufruf gibt, der Verknüpfungen absolut über http referenziert .

garth
quelle
2
//Am Anfang ist das kein Standard, und Browser wie Lynx werden sich beschweren.
Mirabilos
2
@mirabilos RFC 1808 ist der Standard für URLs und spezifiziert protokollbezogene Links (beginnend mit //) in Abschnitt 2.4.3. Der Standard ist jetzt 15 Jahre alt und wird von allen wichtigen Browsern implementiert, einschließlich Lynx
Stephen Ostermiller
#mirabilos Überprüfen Sie die empfohlenen Google-Repository-Links. Sie werden feststellen, dass Google sie seit vielen Jahren verwendet.
Garth
1

Es ist wirklich einfach. Wenn Sie Websites erstellen, die über SSL (https) bereitgestellt werden, werden bei Verweisen in Ihrem Code, denen kein https vorangestellt ist, - außer Links - Sicherheitswarnungen ausgegeben . Beachten Sie, dass die meisten (alle) Browser auch relative Links zu http standardmäßig verwenden. Wenn Sie also auf /uploads/12/5/img.jpg oder /js/jquery.js verweisen, lautet das Übertragungsprotokoll standardmäßig http - was wirklich ärgerlich ist.

Alle Browser behandeln die Warnungen ein wenig anders, aber Sie erhalten eine Art Nachricht. Eine allgemeine Aussage wäre, dass die Nachricht umso schwerwiegender ist, je neuer der Browser ist. Einige ältere Browser ignorieren diese Fehler praktisch, während neuere Browser so tun können, als ob Ihre Welt aufgrund der fehlenden "s" angegriffen wird.

blankip
quelle
10
"Die meisten (alle) Browser verwenden standardmäßig relative Links zu http" Err, was? Absolut alle Browser, sofern sie nicht kaputt sind, würden das aktuelle Protokoll verwenden, wenn Sie nicht explizit ein neues angeben.
Oleg V. Volkov
5
Oleg hat recht; das ist nicht "nervig": es ist völlig falsch.
Leichtigkeit Rennen mit Monica
3
Das ist völlig falsch. Ignorieren Sie diese Antwort.
17.
@martijnve - Wie ist meine Antwort falsch?
Blankip
4
@blankip siehe oleg V. Volkovs Kommentar. Alle Verweise, die http enthalten, sind falsch. Allen anderen geht es gut. (Protokoll relativ, Domain relativ, Pfad relativ). Und Sie sollten sowieso in fast allen Fällen relative Links verwenden.
Martijnve
1

Wenn keiner dieser Vorschläge dazu beiträgt, dass Bilder nicht angezeigt werden können, nachdem Sie SSL auf Ihrer Webseite aktiviert haben, überprüfen Sie die Einstellungen von cPanel für Hotlinks im Abschnitt Sicherheit des cPanel. Es ist sehr wahrscheinlich, dass Sie in dieser Einstellung Folgendes haben: http://example.comund http://www.example.comaktiviert sind, um den Zugriff auf die Bilder zu ermöglichen, während die httpsVersion von diesen nicht aktiviert ist.

Web Junk
quelle
-4

Überprüfen Sie Ihre sichere URL-Protokollkonfiguration in Ihrem cms / wordpress / magento oder jeder anderen Plattform, die Sie verwenden. Sie können auch einige Ihrer Bild-Tags freigeben, aber bei einfachen img src-Bildern treten diese Fehler nicht auf.

Die Image-Tag-Struktur ist wichtig, aber der Fokus Ihrer Frage hängt meiner Meinung nach vom auf Ihrer Site installierten SSL-Zertifikatstyp ab. Ein persönlicher Fall ist mir mit einem "Standard GoDaddy SSL Certificate" passiert.

In der Firefox-URL-Suchleiste wird ein Warnsymbol angezeigt, das besagt, dass möglicherweise unsichere Bilder oder Elemente auf Ihrer Website vorhanden sind. Soweit ich weiß, geht es nur darum, wie Firefox Informationen über das Zertifikat oder die darin enthaltenen Informationen verarbeitet. Dies geschieht nicht in Safari-, Chrome- oder anderen Browsern. Ich habe eine Lösung dafür gefunden, indem ich anstelle von "Standard SSL" ein "Premium SSL-Zertifikat oder EVC Extended Validation Certificate " installiert habe, das detailliertere Informationen über das Unternehmen der Website enthält. Sie erhalten eine grüne, vorhängeschlosssichere URL-Leiste.

Das Premium-SSL-Zertifikat könnte jedoch etwas teurer sein, etwa 150 bis 200 USD pro Jahr.

Bildbeschreibung hier eingeben

Gaio RoOts
quelle
5
Dies ist nicht wahr, weil: 1) <img src = "..."> Tags in der Tat diese Art von Fehler verursachen können, wenn Sie eine HTTP-URL (im Gegensatz zu einer HTTPS-URL) eingeben und 2) die Art des Zertifikats oder die Art und Weise, wie es verarbeitet wird, haben absolut nichts damit zu tun
fNek
Ich verwende für img src globale Medientags wie {{media url = "path / to / image.jpg"}} mit oder ohne SSL-Protokoll und bekomme keine Fehler. Übrigens weise ich auf Stephens Firefox ssl Fehler hin. Grüße.
Gaio RoOts
3
Wenn Sie relative URLs verwenden, treten keine Probleme auf, da diese relativ sind. Bitte lesen Sie die andere Antwort. Ich weiß, dass Sie sich auf Stephens Fehler beziehen. Zertifikatstypen haben noch nichts damit zu tun.
16.
Die Art des Zertifikats hat keinen Einfluss auf die sogenannte "Mixed-Content-Warnung". Heutzutage zeigen alle modernen Browser die Warnung an, einige deutlich, andere einfach, indem sie sich weigern, das Schlosssymbol anzuzeigen.
Martijn Heemels