web-dev-qa-db-fra.com

Pourquoi ne puis-je pas faire <img src = "C: /localfile.jpg">?

Cela fonctionne si le fichier html est local (sur mon lecteur C), mais pas si le fichier html se trouve sur un serveur et si le fichier image est local. Pourquoi donc?

Des solutions possibles?

javascripthtmlfilesystemssrc
83
PeterV

Ce serait une faille de sécurité si le client pouvait demander des fichiers de système de fichiers locaux puis utiliser JavaScript pour déterminer le contenu de ces fichiers.

La seule solution consiste à créer une extension dans un navigateur. Les extensions Firefox et les extensions IE peuvent accéder aux ressources locales. Chrome est beaucoup plus restrictif.

54
Bjorn Tipling

ne devriez-vous pas utiliser "file: // C: /localfile.jpg" au lieu de "C: /localfile.jpg"?

28
AndreDurao

Les navigateurs ne sont pas autorisés à accéder au système de fichiers local, sauf si vous accédez à une page HTML locale. Vous devez télécharger l'image quelque part. S'il se trouve dans le même répertoire que le fichier html, vous pouvez utiliser <img src="localfile.jpg"/>

25
Newtang

C: n'est pas un schéma d'URI reconnu. Essayez file://c|/... à la place.

15
Ignacio Vazquez-Abrams

Honnêtement, le moyen le plus simple était d'ajouter l'hébergement de fichiers sur le serveur.

  • Ouvrez IIS

  • Ajouter un répertoire virtuel sous le site Web par défaut

    • chemin virtuel sera ce que vous voulez parcourir dans le navigateur. Donc, si vous choisissez " nomServeur/images , vous pourrez y accéder en accédant à http: // nomServeur/images =
    • Ajoutez ensuite le chemin physique sur le lecteur C:

  • Ajoutez les autorisations appropriées au dossier du lecteur C: pour "NETWORK SERVICE" et "IIS AppPool\DefaultAppPool".

  • Actualiser le site Web par défaut

  • Et tu as fini. Vous pouvez maintenant naviguer vers n’importe quelle image de ce dossier en accédant à http: //votreServeurNom/wheelYourFolderNames/votreImage.jpg et utiliser cette URL dans votre img src.

J'espère que cela aide quelqu'un

4
foremaro

IE 9: Si vous souhaitez que l'utilisateur examine l'image avant de l'envoyer au serveur: L'utilisateur doit AJOUTER le site Web à la "liste des sites Web de confiance".

3
United4Peace

L'observation de Newtang sur les règles de sécurité mises à part, comment allez-vous savoir que toute personne visitant votre page aura les bonnes images sur c:\localfile.jpg? Tu ne peux pas. Même si vous pensez que vous pouvez, vous ne pouvez pas. Cela présuppose un environnement Windows, d’une part.

2
Jack Kelly

Je vois deux possibilités pour ce que vous essayez de faire:

  1. Vous voulez que votre page Web, fonctionnant sur un serveur, trouve le fichier sur l'ordinateur que vous avez conçu à l'origine?

  2. Vous voulez le récupérer depuis le PC qui consulte la page?

L'option 1 n'a tout simplement aucun sens :)

L'option 2 serait une faille de sécurité, le navigateur interdisant à une page Web (diffusée depuis le Web) de charger du contenu sur la machine du visualiseur.

Kyle Hudson vous a dit ce que vous devez faire, mais c'est tellement fondamental que j'ai du mal à croire que c'est tout ce que vous voulez faire.

1
Juan Mendes

si vous utilisez le navigateur Google chrome, vous pouvez l'utiliser comme ceci

<img src="E://bulbpro/pic_bulboff.gif"   width="150px" height="200px">

Mais si vous utilisez Mozila Firefox, vous devez ajouter un "fichier" ex.

<img src="file:E://bulbpro/pic_bulboff.gif"   width="150px" height="200px">
1
Sachindra N. Pandey

qu'en est-il d'avoir une image sélectionnée par l'utilisateur? Utiliser une balise input: file puis, après avoir sélectionné l'image, l'afficher sur la page Web côté client? C'est faisable pour la plupart des choses. À l'heure actuelle, j'essaie de le faire fonctionner pour IE, mais comme pour tous les produits Microsoft, il s'agit d'un cluster fork ().

0
Fallenreaper

Si vous déployez un site Web local uniquement pour vous-même ou certains clients, vous pouvez contourner ce problème en exécutant mklink /D MyImages "C:/MyImages" dans le répertoire racine du site Web en tant qu'administrateur dans cmd. Ensuite, dans le code HTML, faites <img src="MyImages/whatever.jpg"> et le lien symbolique établi par mklink connectera le lien src relatif au lien sur votre lecteur C. Cela a résolu le problème pour moi, alors cela pourrait aider les autres qui en viennent à cette question.

(Évidemment, cela ne fonctionnera pas pour les sites Web publics car vous ne pouvez pas exécuter facilement les commandes cmd sur les ordinateurs des utilisateurs).

0
takanuva15

nous pouvons utiliser le javascript FileReader () et c'est readAsDataURL (fileContent ) fonction pour afficher le fichier de lecteur/dossier local. Liez change event à image puis appelez la fonction showpreview de javascript. Essaye ça -

<!doctype html>
<html>

<head>
    <meta charset='utf-8'>
    <meta name='viewport' content='width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=no;'>
    <meta http-equiv='Content-Type' content='text/html; charset=utf-8'>
    <title></title>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

    <script type="text/javascript">
    function showpreview(e) {
        var reader = new FileReader();
        reader.onload = function (e) {
            $("#previewImage").attr("src", e.target.result);
        }
        //Imagepath.files[0] is blob type
        reader.readAsDataURL(e.files[0]);
    }
    </script>
</head>
<body >
    <div>
    <input type="file" name="fileupload" value="fileupload" id="fileupload" onchange='showpreview(this)'>
    </div>
    <div>
        &nbsp;
    </div>
    <div>
    <img width="50%" id="previewImage">
    </div>
</body>
</html>
0
Ravindra Vairagi

Vous devez également télécharger l'image, puis la relier à l'image sur le serveur.

0
Kyle Hudson