Afbeelding wordt niet weergegeven in browser?

Ik ben momenteel aan het oefenen met JSP en ik probeer deze html-code om een webpagina te maken op NetBeans IDE 7.0, maar als ik de pagina aan het bouwen en uitvoeren ben, geen fout in de code, maar de afbeelding wordt niet weergegeven in de browser.

p>

Bewerkt:

Hier heb ik de schermafbeelding van de NetBeans IDE gegeven, waar je kunt zien dat de afbeelding in de Web-INF-map en de index.jsp-pagina ook bestaat en ik heb geprobeerd met "/"voor de afbeelding naam, maar het werkt niet. Het exacte pad van mijn project is C:\Users\VIRK\Documents\NetBeansProjects\practiceJSP .

<img  src="/66.jpg" width="400" height="400" ></img>

Antwoord 1, autoriteit 100%

Ik ontdek hoe ik het afbeeldingspad moet instellen, verwijder gewoon de "/"voor de doelmap als "images/66.jpg"niet "/images/66.jpg"En het werkt prima voor mij.


Antwoord 2, autoriteit 22%

Je plaatst in de img-tag fysiekpad je afbeelding. In plaats daarvan moet je een virtueelpad (volgens de root van de webapplicatie) naar je afbeelding plaatsen. Deze waarde is afhankelijk van de locatie van uw afbeelding en uw html-pagina.

bijvoorbeeld als u het volgende heeft:

/yourDir
-page.html
-66.jpg

in uw page.html zou het zoiets moeten zijn:

<img  src="66.jpg" width="400" height="400" ></img>

tweede scenario:

/images
-66.jpg
/html
page.html

Dus je img zou er als volgt uit moeten zien:

<img  src="../images/66.jpg" width="400" height="400" ></img>

Antwoord 3, autoriteit 11%

Uw pad zou er als volgt uit moeten zien: “http://websitedomain//folderpath/66.jpg”>

<img  src="https://websitedomain/folderpath/66.jpg" width="400" height="400" ></img>

Antwoord 4

Ik weet niet waar je de site op je computer uitvoert, maar je hebt een absoluut bestandspad naar je C-schijf: C:\Users\VIRK\Desktop\66.jpg

Probeer dit in plaats daarvan:

<img  src="[PATH_RELATIVE_TO_ROOT]/66.jpg" width="400" height="400" />

UPDATE:

Ik weet niet waar je $PROJECTHOMEop is ingesteld. Maar stel dat uw sitebestanden zich bijvoorbeeld bevinden in C:\Users\VIRK\MyWebsite. En laten we zeggen dat uw afbeeldingen zich in een map ‘afbeeldingen’ op uw hoofdsite bevinden, zoals: C:\Gebruikers\VIRK\MijnWebsite\afbeeldingen.

Vervolgens kun je in je HTML eenvoudig verwijzen naar de afbeelding in de afbeeldingenmap ten opzichte van de site, zoals:

<img  src="images/66.jpg" width="400" height="400" />

Of, ervan uitgaande dat u host in de root van localhost en niet in een andere virtuele map, kunt u dit doen (let op de schuine streep in het begin):

<img  src="/images/66.jpg" width="400" height="400" />

Antwoord 5

het enige wat u hoeft te doen is met de rechtermuisknop op de jsp-pagina in de browser te klikken, die eruit zou kunnen zien als “localhost:8080/images.jpg, dit kopiëren en plakken waar de afbeelding wordt gegenereerd


Antwoord 6

Ik had hetzelfde soort probleem in Netbeans.

Ik heb de afbeeldingslocatie in het project bijgewerkt en toen ik het jsp-bestand uitvoerde, werd de afbeelding niet op de pagina geladen.

Vervolgens heb ik het project schoongemaakt en gebouwd in Netbeans. Toen werkte het prima.

Hoewel u moet controleren of de afbeelding echt bestaat of de afbeeldings-URL niet in de browser gebruikt.


Antwoord 7

Ik had een probleem waarbij de afbeeldingen niet werden weergegeven en het was niet het relatieve pad. Ik heb zelfs het eigenlijke pad hard gecodeerd en de afbeelding werd nog steeds niet weergegeven. Ik had mijn webserver gewijzigd om op poort 8080 te draaien en geen van beide

<img src="c:/public/images/<?php echo $image->filename; ?>" width="100" />
<img src="c:/public/images/mypic.jpg" width="100" />

zou niet werken.

<img src="../../images/<?php echo $photo->filename; ?>" width="100" />

Werkte ook niet. Dit werkte wel:

<img src="https://localhost:8080/public/images/<?php echo $image->filename; ?>" width="100" />

Antwoord 8

plaats *jsp of *html niet in de hoofdmap van de webapp en afbeeldingen die u in dezelfde hoofdmap wilt weergeven, browser kan de afbeelding in de WEB-INF-map niet openen


Antwoord 9

Ik had ook een soortgelijk probleem en heb al het bovenstaande geprobeerd, maar niets werkte.
En toen merkte ik dat de afbeelding goed laadde voor het ene bestand en niet voor het andere. De reden was: Mijn afbeelding heette image.jpg en een pagina met de naam about.html kon het niet laden terwijl login.html dat wel kon. Dit kwam omdat image.jpg onder ongeveer en boven login stond. Dus ik denk dat login.html zou kunnen verwijzen naar de afbeelding en about.html het niet kon vinden.
Ik hernoemde about.html naar zabout.html en hernoemde het terug. Werkte.
Hetzelfde kan het geval zijn voor afbeeldingen in mappen.


Antwoord 10

de gemakkelijke manier om dit te doen is door de afbeelding in webinhoud te plaatsen en er vervolgens met de rechtermuisknop op te klikken en deze vervolgens te openen met uw eclipse- of netbeans-webbrowser. Het toont de pagina waar u de URL kunt zien, wat het exacte pad is kopieer vervolgens de URL en plaats deze op src=” plakken URL” ;


Antwoord 11

Als we asp.net “FileUpload”-besturing gebruiken en een voorbeeld van de afbeelding willen bekijken voordat we ze uploaden, kunnen we onderstaande code gebruiken.

<asp:FileUpload ID="fileUpload" runat="server" Style="border: none;" onchange="showpreview(this);" />
<img id="previewImage" src="C:\fakepath\natureImage.jpg">
<script>
    function showpreview(Imagepath) {
        var reader = new FileReader();
        reader.onload = function (e) {
            $("#previewImage").attr("src", e.target.result);
        }
        reader.readAsDataURL(Imagepath.files[0]);
    }
</script>

Antwoord 12

Een andere willekeurige reden waarom uw afbeeldingen mogelijk niet worden weergegeven, is vanwege iets dat base href="http://..."wordt genoemd, waardoor de images-bestand werkt niet zoals het zou moeten. Verwijder die regel en je zou goed moeten zijn.


Antwoord 13

U moet uw afbeelding importeren uit de afbeeldingsmap.
import name_of_image from '../imageFolder/name_of_image.jpg';

<img src={name_of_image} alt=''>

Zie hier.
https://create-react-app.dev/docs/ add-images-fonts-and-files

Other episodes