Js Bilder anhand URL Downloaden?

let n = getElementsByTagName("img");

for(tip of n){

};

Doch ich weiß nicht wie ich diese Bilder Downlaoden kann.

Recherchiert hab ich doch da passiert nix.

2 Antworten

Vom Fragesteller als hilfreich ausgezeichnet

regex9

Von gutefrage auf Grund seines Wissens auf einem Fachgebiet ausgezeichneter Nutzer

Programm, programmieren, JavaScript

21.09.2022, 21:24

Du kannst zwar einen Link mit dem download-Attribut dynamisch erzeugen, doch so lange die Webseite selbst nicht über einen Webserver (bzw. eine Domain) ausgespielt wird, wird so eine Aktion direkt geblockt.

Wenn du deine Seite auf deinem eigenen Rechner ausführen möchtest, installiere dir einen Webserver. Das Sofwarepaket XAMPP bietet sich als einfach einrichtbare Option an. Es beinhaltet einen vorkonfigurierten Apache HTTP Server. Nach der Installation brauchst du den Webserver nur über das Control Panel starten und deine Seite in den htdocs-Ordner (der liegt im Installationsverzeichnis von XAMPP) legen. Im Browser sollte der Aufruf via http://localhost/deineseite.html die Seite mit dem Bild anzeigen.

Was zusätzlich noch hineinspielen kann, sind individuell festgelegte Browsereinstellungen, der Browser selbst (der bekannte Dateitypen immer selbst öffnet) oder Plugins, die einen Download blockieren. Über selbst gewählte Einstellungen / Plugins solltest du jedoch selbst am besten Bescheid wissen.

Zuletzt noch ein Kommentar zum download-Attribut: Wenn du einen Wert angibst, entspricht dieser dem Zielnamen für die Datei, die heruntergeladen werden soll. Nicht dem Zielpfad. Slashes oder Backslashes werden automatisch zu Unterstrichen umgewandelt.

FaTech

Von gutefrage auf Grund seines Wissens auf einem Fachgebiet ausgezeichneter Nutzer

programmieren, Programmieren & Softwareentwicklung

21.09.2022, 16:33

Die URL bekommst du per src Attribue abfrage. let linkVomBild = tip.src;

Dann könntest du sowas machen, da gibt es glaube ich mehrere Wege:

Dann auf das a einen Click Befehl ausführen und danach das a Element einfach wieder entfernen

Deffer

Fragesteller

21.09.2022, 17:06

number = 0

let n = document.getElementsByTagName("img");

for(tip of n){

console.log(tip.src)

var link = document.createElement('a');

link.href = tip.src;

link.download = "C:\\Users\\<User>\\Downloads\\Foto\\img new\\" + number +".png";

document.body.appendChild(link);

link.click();

document.body.removeChild(link);

number++

};

Ich werd dann zur url geleitet.

Doch ich mochte das bild auf mein disk downloaden.

FaTech

21.09.2022, 17:08

@Deffer

Das Download Attribute bekommt keinen Wert. Sollte man dennoch einen geben wollen, wäre dieser nur "download". Keine URL nichts. Dazu kann eine Website nicht auf ein lokales System zugreifen und somit ist es nicht möglich, den Zielpfad einzustellen

Deffer

Fragesteller

21.09.2022, 17:25

@FaTech

Gleiches ergebnis
number = 0
let n = document.getElementsByTagName("img");
for(tip of n){
console.log(tip.src)
var link = document.createElement('a');
link.href = tip.src;
link.download = 'Download.png';
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
number++
};
Der Download funktioniert nicht

ALso Donwload fenster kommt.
Kann ausuchen wo es gespeichert wird, doch der Download = failed 
number = 0
let n = document.getElementsByTagName("img");
for(tip of n){
console.log(tip.src)
var link = document.createElement('a');
link.href = 'images.jpg';
link.download = 'Download.png';
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
number++
};

FaTech

21.09.2022, 17:27

@Deffer

Wenn der Download fehlschlägt, ist irgendwo was anderes noch falsch. Debugge deinen Code. Nimmt der überhaupt die gewünschte URL korrekt in a href?

Deffer

Fragesteller

21.09.2022, 17:32

@FaTech

Die URL gibt es nicht.

Doch wenn ich eine URL benutze die es gibt, werde ich weiter geleitet.

FaTech

21.09.2022, 17:33

@Deffer

Dann ist irgendwas falsch eingestellt denke ich Mal ... Sonst Google mal

Deffer

Fragesteller

21.09.2022, 17:46

@FaTech

Es wird auf den Link geclickt.

Villeicht gucken Sie auf den Code und ergänzen ihn?

FaTech

21.09.2022, 17:51

@Deffer

Versuch es selber Mal zu finden, dann kann ich immer noch helfen:)

Deffer

Fragesteller

21.09.2022, 18:02

@FaTech

Nun deine Hilfe wäre er Mutivieren, doch wirklich das Problem zu erklären und eine lösung zu geben, da ich das Problem anscheinend nicht finde?

FaTech

21.09.2022, 18:03

@Deffer

Ich müsste selber das Testen und Recherchieren. Da ich gerade verhindert bin und du das genau so kannst, kannst du es ja tun :)

Deffer

Fragesteller

21.09.2022, 18:10

@FaTech

Ich komm mir getrollt vor

Deffer

Fragesteller

21.09.2022, 18:12

@FaTech

Bei einiegen sachen musste man nur auf den Code schauen ums zu verstehen.

Und wenn du verhindert bist wie kannst du helfen.

Helf wenn du kannst;

FaTech

21.09.2022, 19:54

@Deffer

link.download = 'Download.png';

Entferne den mal. Das sehe ich jetzt erst. Ich habe gesagt, man füllt download nicht und wenn man es tut, dann nur mit download. Aber Download.png ist nicht download

regex9

21.09.2022, 21:02

@FaTech

Ich habe gesagt, man füllt download nicht und wenn man es tut, dann nur mit download.

Das Attribut dient dazu, einen Zielnamen für die Datei anzugeben, die heruntergeladen werden soll. Deine Vorgabe, der Wert dürfte nur download lauten, ist falsch.

FaTech

21.09.2022, 21:03

@regex9

Naja gut, dann habe ich mich wohl geirrt. Kann passieren. :)

Deffer

Fragesteller

21.09.2022, 21:05

@FaTech

Ich hab herrausgefunden der link.download = ...

1. Darf kein Link sein.

2. Die Bilder führen zu einer weiteren seite wo die Original große ist.

3. Ich muss auf das Bild klicken und dann von der weiterleitung aus Downloaden.

Also

Img auf der seite downlaoden

1.Ist das möglich

2.Danke das Sie versuchen mir zu helfen

Ähnliche Fragen

Wieso funktioniert array.push() nicht?

Bei folgendem Code funktioniert die array.push-Funktion nicht.

let XArray = [];

function Xcoordinate() {
  for (let i = 0; i <= width; i+= 30) {
    XArray.push(i);
  }
}
//width ist die breite des Canvas

Das Array füllt sich nicht.

Ich arbeite mit p5.js.

Kann mir jemand helfen?

VG Finja

...zur Frage

PDF Datei auf Website zum Download bereitstellen?

Hallo zusammen,

ich möchte auf meiner Website PDF Dateien zum Download anbieten. Der Nutzer soll also auf ein Img oder einen Button klicken und die entsprechende Datei downloaden.

Wie kann ich das in HTML, CSS, JS und oder PHP umsetzen?

Vielen Dank!

...zur Frage

JS ARRAYS + RECHNEN?

Also ich habe ein Programm wo man per Knopfdruck über einen Prompt etwas schreiben kann und das steht dann im Array, aber es soll so sein das wenn man auf einen anderen Button drückt ein Allert kommt in dem steht wie viel alles zusammen ist also ich möchte es + rechnen.

Falls es hilfreich ist hier mein Code:

<html>

<head>

</head>

<body>

<h1>Stromverbrauch</h1>

<button onclick="addNewItem(); updateList();">Neuen Verbrauch hinzufügen</button>

</ul>

let shoppingItems = getShoppingItemsFromLocalStorage();

updateList();

function getShoppingItemsFromLocalStorage() {

let items = localStorage.getItem('shoppingItems');

if (items == null || items == '') {

items = [];

} else {

items = items.split(',');

}

return items;

}

function addNewItem() {

let item = prompt('Welchen Verbrauch hast du?');

if (item != null) {

shoppingItems.push(item);

localStorage.setItem('shoppingItems', shoppingItems);

}

function removeItem(itemIndex) {

shoppingItems.splice(itemIndex, 1);

localStorage.setItem('shoppingItems', shoppingItems);

}

function updateList() {

document.getElementById('list').innerHTML = '';

for (let index = 0; index < shoppingItems.length; index += 1) {

document.getElementById('list').innerHTML += '<li>' + shoppingItems[index] +

' <button onclick="removeItem(' + index + '); updateList();">X</button></li>';

}

</script>

</body>

</html>

...zur Frage

Browserfehler: "0: Unable to get property 'SavePersonalAndPaymentData' of undefined or null reference"?

Hallo,

ich habe eine Aufgabe gemacht und mein Browser gibt diesen Fehler aus:

0: Unable to get property 'SavePersonalAndPaymentData' of undefined or null reference

Ich glaube aber, dass die Aufgabe richtig ist!

Ich habe es auch einen Freund geschickt und bei ihm funktioniert es ebenfalls nicht.

HTML:

<!DOCTYPE html>
<html>
  <head lang="de">
    <meta charset="UTF-8" />
    <style type="text/css"></style>
    <title>Lieblings Professor</title>
  </head>
  <body>
    <form>
      <fieldset>
        <legend>Notenberechnung<br>Teilaufgaben</legend>

        <label for="aufgabe1">Aufgabe 1:</label>
        <input type="number" name="Augabe1" id="a">
        <br><br>

        <label for="aufgabe2">Aufgabe 2:</label>
        <input type="text" name="Aufgabe2" id="b">
        <br><br>

        <label for="aufgabe3">Aufgabe 3:</label>
        <input type="number" name="Augabe3" id="c">
        <br><br>

        <label for="aufgabe4">Aufgabe 4:</label>
        <input type= "number" name="Augabe4" id="d">
        <br><br>

        <button id="069" value="069">druck berechne</button>
      </fieldset>
    </form>
    <h1>Note</h1>
    <div id="note"></div>
    <script src="x1.js"></script>
  </body>
</html>
</form>
<h1>Note</h1>
<div id="note"></div>
<script src="x1.js"></script>
</body>
</html>

JavaScript:

"use strict"

window.addEventListener("load", init);

function init() {
  console.log("Fenster ist geladen");
  let btn = document.getElementById("069");
  btn.addEventListener("click", btnfk);

  function btnfk() {
    console.log("ich wurde geklickt!!!!");

    let aufgabe1 = document.getElementById("a").value;
    console.log(aufgabe1);
    let aufgabe2 = document.getElementById("b").value;
    console.log(aufgabe2);
    let aufgabe3 = document.getElementById("c").value;
    console.log(aufgabe3);
    let aufgabe4 = document.getElementById("d").value;
    console.log(aufgabe4);

    aufgabe1 = Number(aufgabe1);
    aufgabe2 = Number(aufgabe2);
    aufgabe3 = Number(aufgabe3);
    aufgabe4 = Number(aufgabe4);

    let note = document.getElementById("note");
    global = global + aufgabe1 + aufgabe2 + aufgabe3 + aufgabe4;

    note.textContent = global;
    let note5 = document.createElement("div");
    document.body.appendChild(note5);

    if (global < 12) {
      note5.textContent = "Ihre Note ist 5!!!!!";
    }

    if (global >= 12 && global <= 15) {
      note5.textContent = "Ihre Note ist 4 ...";
    }

    if (global >= 15 && global <= 18) {
      note5.textContent = "Ihre Note ist 3";
    }

    if (global >= 18 && global <= 21) {
      note5.textContent = "Ihre Note ist 2 super";
    }

    if (global >= 21) {
      note5.textContent = "Ihre Note ist 1 WOW";
    }
  }
}

let global = 0;

Wenn ich statt Zahlen aber Buchstaben eingebe, werden sie gespeichert. Ansonsten mit Zahlen werden sie nicht gespeichert und verschwindet sofort.

...zur Frage

QR Code Generator Download button API generietes Bild?

Hallo, ich möchte gerade einen QR Code Generator programmieren. Dafür benutze ich die Library qrserver und jetzt möchte ich auch einen Download button hinzufügen. Ich habe ja aber keine feste source also habe ich probiert dem download einfach die selbe ID wie dem Img ohne source zu geben. Das hat aber nicht funktioniert, hat jemand eine Idee?

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>QR Code Generator</title>


    <script src="js/script.js"></script>


    <link rel="stylesheet" href="styles.css" />
  </head>
  <body>
    <h1>QR Code Generator</h1>


    <div class="container">
      <p>Enter URL</p>
      <div class="ButonInput">
        <input type="text" placeholder="Your URL" id="qrText" />
        <button onclick="GenerateQR()" id="btn">Generate</button>
      </div>
      <div id="imgBox">
        <img src="" alt="" id="QrImg" />
      </div>
      <a href="" download="QrImg.src " id="QrImg"> download</a>
    </div>


    <script>
      let imgBox = document.getElementById("imgBox");
      let QrImg = document.getElementById("QrImg");
      let qrText = document.getElementById("qrText");


      function GenerateQR() {
        QrImg.src =
          "https://api.qrserver.com/v1/create-qr-code/?size=150x150&data=" +
          qrText.value;
      }
    </script>
  </body>
</html>

...zur Frage

Wie in CSS img source ändern?

Hey:)
Ich habe hier ein Profilbild das rot ist.
<img src=“avatar.png” class=“avatar”>
und es soll gelb werden bei .avatar:hover

Habe deshalb das Selbe Bild nochmal in gelb mit dem namen avatar2.

Wie kann ich das jetzt machen?
.avatar:hover{
src: url(“avatar2.png”);
}
geht leider nicht und ja, die bilder sind im gleichen ordner;/

Danke für Hilfe❤️

...zur Frage

Wie kann ich in Node.js eine JSON-Datei von einer URL fetchen?

Hallo, allerseits.

In einem Projekt will ich Die UUID eines Minecraft-Spielers herausfinden. dazu gehe ich auf https://api.mojang.com/users/profiles/minecraft/Player Name. Das ist eine JSON Datei. Diese möchte ich jetzt als String in JS haben, damit ich das ID-Element (=UUID) weiterverwenden kann. Ich habe schon einiges recherchiert, aber nichts gefunden. Hat jemand eine Idee, wie ich universell Json Dateien runterladen und als String speichern kann?

Vielen Dank im Vorraus.

...zur Frage

JavaScript EventListener funktioniert nicht richtig?

Mein JS-Code:

'use strict'

let lines = document.getElementsByClassName("src-line");
let activeLine = -1;

for (let i1 = 0, i2 = lines.length; i1 < i2; i1++) {
  lines[i1].addEventListener("mouseover", function(){
    lines[i1].style.cursor = "text";
  });
  lines[i1].addEventListener("click", function(){
    activeLine = i1;
    console.log(activeLine);
  });
}
addEventListener("keydown", keypressed(e));

function keypressed(e) {
  if (activeLine != -1) {
    if (e.key == "Backspace") {
      console.log("Backspace");
      ediText[activeLine] = ediText[activeLine].substring(0, ediText[activeLine].length - 1);
    }
    else if (e.key == "Tab") {
      ediText[activeLine] += "&nbsp;&nbsp;&nbsp;&nbsp;";
    }
    else if (e.key == "Shift") {
      return;
    }
    else if (e.key == "Space") {
      ediText[activeLine] += "&nbsp;";
    }
    else {
      ediText[activeLine] += e.key;
    }

    console.log(e.key)
    charCompiler(ediText);
  }

  return 0;
};

Wenn ich nun auf ein Element mit der Klasse src-line klicke, wird in der Konsole immer der Listenindex angezeigt. Ich habe momentan zwei, also zeigt es immer 0 oder 1 an.

Wenn ich jetzt allerdings anfange, Buchstaben einzugeben, wird das zuletzt angeklickte Element verändert. Jedoch kann ich jetzt nicht mehr das Element wechseln, denn klicke ich jetzt auf das andere Element, wird das click-Event nicht mehr aufgerufen. D.h. activeLine wird nicht mehr geändert. Ich habe keinen Plan, warum.

Ist evtl. am Code was falsch, weil ich habe keine Ahnung warum das click-Event nach dem keydown einfach ignoriert wird, obwohl es davor ja noch ging. Btw wird auch in der Konsole beim Klicken danach nichts mehr angezeigt.

...zur Frage

Stromteiler Elektrotechnik?

Kann mir jemand anhand der Stromteilerregel I3 berechnen(ohneKnotenverfahren) und es mir erklären. ich versteh die Formel bei solchen komplizierten Aufgaben nicht.

ich denke es müsste ja : I3/I1=Rges/R3 sein, aber da kommt ein falsches ergebnis raus. Ist keine Hausaufgabe, sondern eine zusatzübung für die kommende Prüfung.

[URL=https://www.directupload.net/file/d/5502/x2b4u4f9_jpg.htm][IMG]https://s17.directupload.net/images/190703/temp/x2b4u4f9.jpg[/IMG][/URL]

...zur Frage

Wieso funktioniert meine "Browser Extension" nicht auf dieser Seite?

Mir ist unter Linux aufgefallen das ich gar nicht den Auto-Scroll von Windows habe in zb. Google Chrome wenn man auf das Mauspad klickt, nutze ich gerne und dachte mir als Challenge ohne Chat Gpt dass ich mal schnell probieren könnte ein eigenes zu programmieren.

Ich weiß da gibt es fertige Software und Extension's, die laufen ohne Probleme und Ressourcen sparender wahrscheinlich.

Hab das erst in einer Html Datei (Extension in "") gemacht zum testen dann in anderen Websites den JS Code in eine Konsole eingefügt und es funktioniert eigentlich ganz gut.

Das Problem ist das ich nicht verstehe wieso er nicht hier funktioniert https://www.tennon.io/ , mir fällt beim inspizieren nichts auf und es scheint mit Next JS umgesetzt zu sein.

<!DOCTYPE html>
<html lang="de">


<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Auto Scroll Extension</title>
    <style>
        html {
            min-width: 100%;
        }
    </style>
</head>


<body>
    <script>
        /* Render Dummy Content, cursor change wont work with min-height */
        for (let i = 0; i < 1000; i++) {
            document.body.innerHTML += "Lorem Ipsum ";
        }
        const scrollSpeed_Up = -1;
        const scrollSpeed_Down = 1;
        const middlehalf = window.innerHeight / 2;
        let AutoScroll_Interval; /* Global acess */
        let isScrolling = false;
        let isScrollingUp = false; /* Default Scrolling Down, Prevent Errors */


        const ToggleScrolling = Enable => {
            if (Enable) {
                console.log("Auto Scroll Active");
                document.body.style.cursor = "all-scroll";
                AutoScroll_Interval = setInterval(AutoScroll, 1);
                isScrolling = true; /* Prevent Multiple Interval's */
            } else if (!Enable && isScrolling) {
                /* Stop Interval , Reset Cursor and Variables */
                console.log("Auto Scroll Stopped");
                document.body.style.cursor = "auto";
                clearInterval(AutoScroll_Interval);
                isScrolling = false;
            }
        }


        const AutoScroll = () => {
            /* Get Current Vertical Scroll Position : console.log(window.scrollY); */
            isScrollingUp ? window.scrollBy(0, scrollSpeed_Up) : window.scrollBy(0, scrollSpeed_Down);
        }


        window.addEventListener("mousemove", e => {
            e.clientY > middlehalf ? isScrollingUp = false : isScrollingUp = true;
        });


        /* Check if Scroll Button is Pressed */
        window.addEventListener("mousedown", e => {
            e.button === 1 && !isScrolling ? ToggleScrolling(true) : ToggleScrolling(false);
        });


        /* ############## IGNORE ##############
        Check if Client has reached Bottom
        const scrollableHeight = document.documentElement.scrollHeight - window.innerHeight;
        if (window.scrollY >= scrollableHeight) { 
            // Reached Bottom Code ... 
        } else {
            // Code ...
        }
        */
    </script>
</body>


</html>

...zur Frage

Html/CSS/Javascript Website Bild wird nicht angezeigt?

Hi, will dass das erste Bild direkt angezeigt wird und das der Beispieltext rechts steht. Wegen Zeichen kurz gehalten. Danke!

<div class="mySlides" id="expandedImg">
<img src="bilder/schuh.jpg" style="width:35%">
</div>
<div class="mySlides">
<img src="bilder/schönschuh.jpg" style="width:35%">
</div>
<div class="mySlides">
<img src="bilder/mann.jpg" style="width:35%">
</div>
<div class="mySlides">
<img src="bilder/lederschuh.jpg" style="width:35%">
</div>
<div class="mySlides">
<img src="bilder/basketball.jpg" style="width:35%">
</div>
<div class="caption-container">
<p id="caption"></p>
</div>
<div class="row">
<div class="column">
<img class="demo cursor" src="bilder/schuh.jpg" style="width:90%" onclick="currentSlide(1)" alt=""></div>
<div class="column">
<img class="demo cursor" src="bilder/schönschuh.jpg" style="width:90%" onclick="currentSlide(2)" alt="">
</div>
<div class="column">
<img class="demo cursor" src="bilder/mann.jpg" style="width:90%" onclick="currentSlide(3)" alt="">
</div>
<div class="column">
<img class="demo cursor" src="bilder/lederschuh.jpg" style="width:90%" onclick="currentSlide(4)" alt="">
</div>
<div class="column">
<img class="demo cursor" src="bilder/basketball.jpg" style="width:90%" onclick="currentSlide(5)" alt="">
</div>
</div>
</div> 
<div class="text">
<a>Beispieltext</a>
<p>Beispieltext...</p>
</div>
* {box-sizing: border-box;}
.container {
position: relative;
margin-top: 80px;
}
.mySlides {
display: none;
margin-bottom: -45px;
margin-top: 65px;
margin-left: 10px;}
.cursor {cursor: pointer;}
.prev,
.next {
cursor: pointer;
position: absolute;
top: 300px;
width: auto;
padding: 16px;
color: rgb(0, 0, 0);
font-weight: bold;
font-size: 20px;
border-radius: 0 3px 3px 0;
user-select: none;
-webkit-user-select: none;}
.next {
right: 0;border-radius: 3px 0 0 3px;} 
.prev:hover,
.next:hover {background-color: rgba(211, 211, 211, 0.8);}
.caption-container {text-align: center; background-color: rgb(255, 255, 255);color: white;}
.row:after {content: ""; display: table; clear: both;}
.column {float: left; width: 7%;}    
.demo {opacity: 0.6;}
.active,
.demo:hover {opacity: 1;}
.row {margin-top: 65px; margin-left: 10px;}
.text {display: flex; justify-content: flex-end; width: 40%;}
var slideIndex = 1;
showSlides(slideIndex);

function plusSlides(n) {
showSlides(slideIndex += n);
}

function currentSlide(n) {
showSlides(slideIndex = n);}

function showSlides(n) {
var i;
var slides = document.getElementsByClassName("mySlides");
var dots = document.getElementsByClassName("demo");
var captionText = document.getElementById("caption");
if (n > slides.length) {slideIndex = 1}
if (n < 1) {slideIndex = slides.length}
for (i = 0; i < slides.length; i++) {
slides[i].style.display = "none";}
for (i = 0; i < dots.length; i++) {
dots[i].className = dots[i].className.replace(" active", "");}
slides[slideIndex-1].style.display = "block";
dots[slideIndex-1].className += " active";
captionText.innerHTML = dots[slideIndex-1].alt;}

...zur Frage

hinzufügen von formdata funktioniert nicht in js?

Ich möchte bilder via ajax an mein backend versenden, best practice scheint ja wohl dafür ein FromData object zu machen und dort dann die files zu appenden. Irgendwie functioniert append aber nicht:

// Fetch DOM
const saveBtn = $('#saveBtn')[0];
console.log(saveBtn);
saveBtn.addEventListener('click', saveImage);


function saveImage() {   
  const fd = makeFormData();
  console.log(fd);
  console.log('clicks'); }
  
  
  function makeFormData() {
   const title = $('#title');
   const service = $('#service');
   const colors = $('#colors');
   const logo = $('#logo').files;
   const img = $('#img').files;

   let fd = new FormData();
   fd.append('test', 'test');
  
  
   return fd; }

...zur Frage

Node.js und Bilddateien ueber Webserver?

Ich benutze node.js und express als webserver. Wenn Leute wissen in welchen Ordner auf meinem Webserver Bilder sind koennen die direkt ueber die URL das Bild abrufen, weil in der HTML Seite welche der Webserver zurueck gibt stehen in den IMG Tags die direkten URLs zu den Bildern.

Wenn ich will kann ich zwar im Express Router die IP Adresse von jeder Anfrage checken und nur bestimmten ip adressen erlauben die HTML Seite zu bekommen, aber wie gesagt kann jeder ueber die direkten Links die Bilder abrufen, weil da ist irgendwie kein router dazwischen.

Wie kann man das Problem loesen das auch dir Bilder nur an erlaubte IP Adressen gesendet werden?

...zur Frage

Ordnerstruktur bei HTML Webseiten für Fonts?

Hallo. Ich frage mich, wo ich meine Schriftarten (Fonts) in meinem HTML-Project unterbringen soll. Meine derzeitige Struktur sieht wie folgt aus:

Ordner

↳index.html

↳css
 ↳style.css

↳js
 ↳script.js

↳img
 ↳Alle meine Bilder

Wo soll ich die .tff- oder .otf-Dateien unterbringen? Wie macht ihr das? In etwa so:

↳fonts
 ↳Schriftart.tff

Oder wie ?

...zur Frage

Was möchtest Du wissen?

Deine Frage stellen