फ़ाइल का उपयोग करके क्रोम में स्थानीय चित्र कैसे प्रदर्शित करें: // प्रोटोकॉल?

23

मैं Chrome का उपयोग करके http के माध्यम से वितरित वेब पेज पर एक छवि के लिए एक स्थानीय फ़ाइल पथ निर्दिष्ट करने में सक्षम होना चाहूंगा - क्या यह संभव है?

मैं IE का उपयोग कर यह याद है, लेकिन कैसे याद नहीं कर सकते! कुछ विश्वसनीय सेटिंग्स मुझे लगता है ...

google-chrome url pictures

— JSH
स्रोत

14

आप छवि को बेस -64 कोड में बदल सकते हैं, उदाहरण के लिए " http://duri.me/ " और ब्राउज़र पर परिणाम कॉपी करें! पसंद:

<img width='16' height='16'  src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAApklEQVQ4jWP8//8/Ay5Q4s6GU7Jn5y9GBgYGBiacuokELKTYSpQByKB68UkMMUExQ0ZkPsVeYEQPREZGRpK8gOGCdy/PwTEyH8ZGF8MbBgwMDAxC4kZ4xfAaALMFGfz//5+6gYjXBS+fXUHhaxjEMqKrQXGBglU8SgyIS+mgYHR5DAPIAYz////HavL5DQVwtmHABAyND44tZGRgwBMG2DRhAxR7AQBhgT3yD6eBRwAAAABJRU5ErkJggg=='>

— डायगो सीआईडी
स्रोत

7

यह जानकारी किसी के लिए कुछ काम की हो सकती है, लेकिन मुझे लगता है कि यह वास्तव में इस सवाल का जवाब नहीं देती है।

— जी-मैन का कहना है

12

चूंकि आपने 'क्रोम' का उल्लेख किया है, आप ऐसा करने के लिए क्रोम एक्सटेंशन का उपयोग कर सकते हैं, ताकि आपकी फ़ाइलों तक स्थानीय पहुंच को सक्षम किया जा सके।

इन कदमों का अनुसरण करें:

1) स्थानीय फ़ोल्डर में जहां आपकी छवि है, इस फ़ाइल को 'मैनिफ़ेस्ट.जॉन' नाम से बनाएँ और इसे दर्ज करें:

{
  "name": "File Exposer",
  "manifest_version": 2,
  "version": "1.0",
  "web_accessible_resources": ["*.jpg","*.JPG"]
}

2) रखो यह आपका क्रोम एड्रेस बार है: क्रोम: // एक्सटेंशन /

3) सुनिश्चित करें कि 'डेवलपर मोड' चेक किया गया है (पृष्ठ का शीर्ष दाईं ओर)

4) 'लोड अनपैक्ड एक्सटेंशन' बटन पर क्लिक करें

5) उस स्थानीय फ़ोल्डर में नेविगेट करें जहाँ छवि (s) और मेनिफ़ेस्ट। Json फ़ाइल है, ठीक पर क्लिक करें

6) विस्तार 'फ़ाइल एक्सपोजर' को अब सूची में सूचीबद्ध किया जाना चाहिए, और 'सक्षम' के खिलाफ एक चेक मार्क होना चाहिए। यदि फ़ोल्डर नेटवर्क ड्राइव या अन्य धीमी ड्राइव पर है या इसमें बहुत सारी फाइलें हैं, तो सूची में प्रदर्शित होने में 10-20 सेकंड या उससे अधिक समय लग सकता है।

7) 'आईडी' स्ट्रिंग पर ध्यान दें जो आपके एक्सटेंशन से संबद्ध है। यह EXTENSION_ID है

8) अब आपके HTML में आप फ़ाइल को एक्सेस कर सकते हैं, जो आपके एक्सटेंशन द्वारा बनाई गई ID को 'EXTERNSION_ID' में बदल सकता है:

<img src='chrome-extension://EXTENSION_ID/example1.jpg'>

ध्यान दें, कि * .jpg पुनरावर्ती है और यह स्वचालित रूप से निर्दिष्ट फ़ोल्डर और सभी उप फ़ोल्डर में फ़ाइलों से मेल खाएगा, आपको प्रत्येक उप फ़ोल्डर के लिए निर्दिष्ट करने की आवश्यकता नहीं है। इसके केस सेंसिटिव पर भी ध्यान दें।

'Img' टैग में आप उस फ़ोल्डर से अपने मूल फ़ोल्डर, उसके रिश्तेदार को निर्दिष्ट नहीं करते हैं, इसलिए केवल उप फ़ोल्डर्स को निर्दिष्ट करने की आवश्यकता होती है।

यदि आप मेनिफ़ेस्ट .json फ़ाइल को संशोधित करते हैं, तो आपको एक्सटेंशन के आगे 'रीलोड (Ctrl + R)' लिंक पर क्लिक करना होगा।

— रोब डोनोवन
स्रोत

8

गैर-स्थानीय वेब पेज क्रोम या किसी भी आधुनिक वेब ब्राउज़र में स्थानीय फ़ाइलों तक नहीं पहुँच सकते ।

आप लोकललिंक ( फ़ायरफ़ॉक्स के लिए ) का उपयोग करके इसे ओवरराइड कर सकते हैं , लेकिन यह केवल आपकी ही मशीन में काम करेगा।

— grawity
स्रोत

2

छवियों के लिए काम नहीं करेगा

— विलेम डी'हेसलेर

मुझे लगता है कि क्रोम गूंगा है, मैं एक about:blankपृष्ठ पर कोशिश कर रहा था और यह अनुमति नहीं दे रहा था, मैंने एक स्थानीय HTML फ़ाइल खोलते हुए थक गया और यह काम किया, यहां तक कि छवियों के बावजूद @ WillemD'Haeseleer ने भी कहा। मेरा कोड यह था:drawing = new Image(); drawing.src = "C:/Users/S/Videos/net.png";

— शयन

2

क्रोम में ऐसा दिखता है

file:///C:/sample.txt

— KutscheraIT
स्रोत

मैं ऐसा कुछ करने के बाद, वेब पर होस्ट किया गया, लेकिन एक उपयोगकर्ता स्थानीय फ़ाइलों को देख रहा हूं .... <! DOCTYPE html PUBLIC "- // W3C // DTD XHTML 1.0 स्ट्रिक्ट // EN" " w3.org/TR /xhtml1/DTD/xhtml1-strict.dtd "> <html xmlns =" w3.org/1999/xhtml "> <head> <मेटा http-equiv =" सामग्री-प्रकार "सामग्री =" पाठ / एचटीएमएल; charset = utf -8 "/> <शीर्षक> उदाहरण </ शीर्षक> </ सिर> <शरीर> <img src =" फ़ाइल: /// c: /graphics/image.jpg "ऊँचाई =" 200px "चौड़ाई =" 200px "/ > <h1> आपका स्वागत है </ h1> <p> नमस्ते दुनिया! </ p> </ body> </ html>

— JSH

1

मैंने अभी-अभी .html और .jpg फाइलों के साथ फाइल की कोशिश की: /// नोटेशन, दोनों को सही ढंग से रेंडर किया गया। क्या आप एक स्क्रीनशॉट पोस्ट कर सकते हैं जो पता बार और कुछ सामग्री दिखाता है?

— कुत्सचेरा

कोशिश jsh.learningict.net - जाहिर है कि छवि आपके पास नहीं होगी, लेकिन कोड आपको दिखाता है कि मैं क्या हूँ

— JSH

मैं केवल यह अनुमान लगा सकता हूं कि आप उस छवि टैग का जिक्र कर रहे हैं, जो तब भी ठीक काम करता है जब मैं src को <img src = "फ़ाइल: /// c: \ test.jpg" height = "200px" width = "200px" से प्रतिस्थापित करता हूं > c: \ test.jpg उस पथ में एक वैध jpg है और ठीक दिखाता है।

— कुत्सचेरा

आश्चर्य है कि अगर यह एक osx बात है? Chrome के एड्रेस बार में src Ref अकेले काम करता है, सिर्फ HTML कोड में नहीं

— JSH

2

यदि आप लाइव साइट पर स्थानीय छवि का परीक्षण करना चाहते हैं, तो आप स्थानीय वेब सर्वर चला सकते हैं और DevTools का उपयोग करके पृष्ठ पर http://127.0.0.1:8123/img.jpg जैसे URL सेट कर सकते हैं

वेब सर्वर को चलाने के लिए अलग-अलग तरीके हैं: 1. परिभाषित फ़ोल्डर के साथ ब्राउज़र "क्रोम के लिए वेब सर्वर" का विस्तार https://chrome.google.com/webstore/detail/web-server-for-chrome/ofhbbkphhbhbhhhikjpcbhemlocggbbbbbbbbbbbbbbbbbbbbb

यदि आपके पास अजगर है तो चुने हुए फ़ोल्डर में एम्बेडेड http सर्वर चलाएं

python3 -m http.server 8123 # python 3 संस्करण
python -m SimpleHTTPServer 8123 # अजगर 2 संस्करण
निगनेक्स , अपाचे जैसे उत्पादन तैयार सर्वर का उपयोग करें

— koxt
स्रोत

0

मेरे मामले में, मुझे केवल यह देखने की ज़रूरत थी कि विभिन्न उत्तरदायी आकारों में एक छोटी छवि का बदलाव कैसा दिखेगा। इसे सहेजना सबसे आसान था ... डेस्कटॉप पर एक पूर्ण वेबपेज और फिर इसके बजाय इसे खोलें। मैं छवि src का निरीक्षण और संपादन करता हूं।

— changokun
स्रोत

ऐसा बिल्कुल नहीं प्रतीत होता है कि ओपी क्या पूछ रहा था, संबंधित भी नहीं। कृपया प्रश्नों को ध्यान से पढ़ें, और जब तक आपके पास जोड़ने के लिए प्रासंगिक जानकारी न हो, तब तक उत्तर या टिप्पणी न करें।

— म्यूजिक 2 साल का

1

लेकिन यह वही है जिसकी मैं तलाश कर रहा था

— सैमुअल थॉम्पसन

-1

ठीक है, आप अपने स्थानीय फ़ाइल सिस्टम को किसी और को नहीं दे सकते हैं! आपको Apache जैसी सर्वर-सेवा की आवश्यकता होगी, अपने कंप्यूटर को दिन में 24 घंटे चलने दें, सुनिश्चित करें कि यह ज़्यादा गरम नहीं होगा, अच्छी सुरक्षा की देखभाल करेगा और इसे और भी अधिक संभव बना देगा। और क्योंकि सर्वर-प्रशासन महंगा और समय लेने वाला है, इसलिए अधिकांश लोग हमारे (वेबहोस्टिंग) के लिए प्रो के होस्ट को अपना सामान रखने देते हैं।

अंत में, यदि आप अपना स्वयं का सर्वर नहीं चलाना चाहते हैं, तो इसे अपनी पसंद के वेबहोल्डर पर अपलोड करना बहुत आसान है।

— user759576
स्रोत

2

सवाल यह है कि स्थानीय प्रणाली पर बड़ी पहुँच फ़ाइलों में इंटरनेट देने के बारे में नहीं है।

— xenoid 13