वेब ब्राउज़र के भीतर पीडीएफ प्रदर्शित करें

84

मैं एक। Html पृष्ठ पर एक वेब ब्राउज़र के भीतर एक पीडीएफ कैसे प्रदर्शित कर सकता हूं?

html  pdf  browser 
— CodeGuy
स्रोत

जवाबों:

120

मैं Google डॉक्स एम्बेड करने योग्य पीडीएफ दर्शक का उपयोग करता हूं। डॉक्स को Google डॉक्स पर अपलोड करने की आवश्यकता नहीं है, लेकिन उन्हें ऑनलाइन उपलब्ध होना चाहिए।

<iframe src="http://docs.google.com/gview?url=http://path.com/to/your/pdf.pdf&embedded=true" 
style="width:600px; height:500px;" frameborder="0"></iframe>
— bradenkeith
स्रोत
3
इस समाधान के साथ कुछ उपयोगकर्ता पीडीएफ फाइल नहीं देखते हैं, लेकिन Google द्वारा पहले लॉग इन करने के लिए कहा जाता है।
— फिलिप जेडलर
41
मेरे पास इस समाधान के बारे में एक प्रश्न है। क्या Google अपने सर्वर में मेरी पीडीएफ फाइल की एक प्रति संग्रहीत करेगा? क्या मेरी सामग्री की गोपनीयता संरक्षित रहेगी?
— एच.डी.
@ पता करने के लिए सुनिश्चित करें, प्रयास करें ... मैं कोशिश करूंगा -: //docs.google.com/gview? Url =: //path.com/to/your/pdf.pdf&embedded=true, iframe src
— bradenkeith के रूप में
यह iFrame के src को सीधे pdf में सेट करने के लिए @ विल के समाधान से अलग / बेहतर कैसे है? मुझे लगता है कि प्रत्यक्ष लिंकिंग वास्तव में पीडीएफ प्रदर्शित करने के लिए सॉफ्टवेयर क्लाइंट की तरफ निर्भर करेगा, लेकिन क्या Google डॉक्स भी ऐसा नहीं करेगा?
— फेलिक्स गगनोन-ग्रेनियर
3
@hd। हां, Google अपने एम्बेडेड प्रदर्शन के माध्यम से बस पीडीएफ प्रदर्शित करता है। मुझे नहीं लगता कि वे एक प्रति रखते हैं, हालांकि उन्हें इसे पृष्ठ प्रदर्शन द्वारा पृष्ठ में अनुवाद करना होगा, इसलिए कुछ बिंदु पर मुझे उम्मीद है कि वे पृष्ठ-दर-पृष्ठ आधार पर पीएनजी में परिवर्तित हो जाएंगे। इस उत्तर का उपयोग करने वाले किसी के लिए, कृपया ध्यान दें कि Google के पास गैर-Google दस्तावेज़ दस्तावेज़ों के लिए बैंडविड्थ सीमा है। एक बार थक जाने के बाद, पीडीएफ प्रदर्शित नहीं होता है, बस एक संदेश जो बैंडविड्थ से अधिक हो गया है और बाद में फिर से प्रयास करने के लिए।
— जॉन
36

इसके बजाय iframe और तीसरे पक्ष के आधार पर फ्लेक्सपेपर, या pdf.js. का उपयोग करने पर निर्भर करता है।

मैंने PDF.js का उपयोग किया , यह मेरे लिए ठीक काम करता है। यहाँ डेमो है ।

— navins
स्रोत
3
यह थर्ड पार्टी कैसे नहीं है?
— एलेक्स
41
यह थर्ड पार्टी सर्विस के बजाय थर्ड पार्टी कोड है।
— कॉलिन एंडरसन
वीपीएन पर्यावरण के लिए आवेदन के लिए बेहतर समाधान।
— एरलान
19

ऑब्जेक्ट टैग का उपयोग करने से पहले

<object data='http://website.com/nameoffolder/documentname.pdf#toolbar=1' 
        type='application/pdf' 
        width='100%' 
        height='700px'>

कृपया ध्यान दें कि आप http://www.w3schools.com/tags/tag_object.asp पर जाने वाले किसी भी मान के लिए चौड़ाई और ऊँचाई बदल सकते हैं

— बकारि शगमेबे
स्रोत
जैसे आपने पोस्ट किया है वह उत्तर के लिए कोई अधिक जानकारी प्रदान नहीं करता है।
— डेनियल डब्ल्यू। क्रॉम्पटन
2
सवाल यह है कि मैं एक। html पृष्ठ पर एक वेब ब्राउज़र के भीतर एक पीडीएफ कैसे प्रदर्शित कर सकता हूं? HTML 5 ऑब्जेक्ट टैग का उपयोग करने से ... <ऑब्जेक्ट चौड़ाई = "400" ऊंचाई = "400" डेटा = "helloworld.swf"> </ ऑब्जेक्ट> इस तत्व का उपयोग मल्टीमीडिया एम्बेड करने के लिए करें (जैसे ऑडियो, वीडियो, जावा एप्लेट,) आपके वेब पृष्ठों में ActiveX, PDF और Flash)।
— बकरीगढ़ी 19
आप पूरी तरह से सही हैं, हालांकि w3schools का लिंक उत्तर को पूरक करने के लिए कोई और जानकारी नहीं देता जैसा आपने लिखा था।
— डैनियल डब्ल्यू। क्रॉम्पटन
अगर आपके ब्राउज़र में कोई पीडीएफ दर्शक नहीं है तो यह काम नहीं करेगा
— उमर हामिद
1
हाँ वह सच है। ऑब्जेक्ट टैग के बारे में एक अच्छी बात यह है कि यह पता लगा सकता है। और यह आपको आगंतुकों को पृष्ठ को देखने के लिए gdrive, onedrive और आदि <ऑब्जेक्ट डेटा = ' example.com/path.pdf#toolbar=1'type='application/pdf ' चौड़ाई = = के माध्यम से आगे के विकल्प चुनने की अनुमति देता है । 100% 'ऊंचाई =' 700px '> <p> ऐसा प्रतीत होता है कि आपका वेब ब्राउज़र पीडीएफ फाइलों को प्रदर्शित करने के लिए कॉन्फ़िगर नहीं किया गया है। कोई चिंता नहीं, बस <a href= 'example.com/path.pdf'> PDF फ़ाइल डाउनलोड करने के लिए यहां क्लिक करें। </a> या <a href = " drive.google.com/ Isdrive path] / view? Us? = साझा करना "> देखने के लिए यहां क्लिक करें </a> </ p> </ object>
— BAKARI SHEGHEMBE
19

सबसे सरल तरीका है कि आइफ्रेम बनाएं और स्रोत को पीडीएफ के URL पर सेट करें।

(ducks पागल HTML डिजाइनर) इसे खुद किया, ठीक काम करता है, क्रॉस ब्राउज़र (बंकर में क्रॉल)।

8
यदि आपके पास IE
— Collin एंडरसन
3
यह कैसे स्पष्ट है? "क्रॉस-ब्राउज़र" के लिए एक उपयोगी परिशिष्ट की तरह लगता है।
— शोदेव
1
यह अन्य सभी तीसरे पक्ष की तुलना में स्थापित करना इतना आसान था। मुझे नहीं पता कि 2011 में इसका प्रदर्शन कैसा था लेकिन 2016 में यह बहुत तेज़ और उपयोगी विशेषताओं से भरा है। साथ ही यह क्रोम, एफएफ और आईई
— स्लॉ जूल
1
यह एंड्रॉइड फोन पर क्रोम में मेरे लिए काम नहीं करता है: यह पीडीएफ डाउनलोड करता है और इसे अलग ऐप में खोलता है (यदि आपके पास एक है)। और मैं सफारी के अन्य पेजों को iOS पर स्क्रॉल नहीं कर सकता। मैं सिर्फ pdf का पहला पेज देखता हूँ।
— वासिली ज्वेरेव
7

ब्राउज़र का प्लगइन उन सेटिंग्स को नियंत्रित करता है, जिससे आप इसे बाध्य नहीं कर सकते। हालाँकि, आप <a href="whatver.pdf">इसके बजाय एक साधारण कर सकते हैं <a href="whatever.pdf" target="_blank">।

— jschorr
स्रोत
अंत में कोई है जो जानता है कि वे इस उत्तर के बारे में क्या बात कर रहे हैं। यह सबसे अच्छा उत्तर है और सबसे सरल है। @jschorr बिल्कुल सही है। ब्राउज़र इन सेटिंग को नियंत्रित करता है। सबसे कुशल!!
— वैल
4

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

<e>
  <a target="_blank" alt="StackExchange Handbook" title="StackExchange Handbook"
     href="pdfs/StackExchange_Handbook.pdf">StackExchange Handbook</a>

निरपेक्ष रास्तों के लिए इंजन U nified R esource L ocator तक जाएंगे और इसे खोलेंगे। इसलिए, लक्ष्य विशेषता को दबाएं।

<e>
  <a alt="StackExchange Handbook" title="StackExchange Handbook"
     href="protocol://url/StackExchange_Handbook.pdf">StackExchange Handbook</a>

ब्राउजर दोनों मामलों में भरोसेमंद अच्छा काम करेगा।

— ftcosta
स्रोत
इस समाधान ने मेरे लिए स्वीकृत उत्तर की तुलना में बेहतर तरीके से काम किया। यह भी ध्यान दिया जाना चाहिए कि मैं कुछ संवेदनशील जानकारी के साथ काम करता हूं, इसलिए मेरे दस्तावेज सार्वजनिक रूप से उपलब्ध नहीं होना मेरे लिए महत्वपूर्ण था।
— कैस्पर विल्क्स
3

आप इस कोड का उपयोग कर सकते हैं:

<embed src="http://domain.com/your_pdf.pdf" width="600" height="500" alt="pdf" pluginspage="http://www.adobe.com/products/acrobat/readstep2.html">

या Google डॉक्स एम्बेड करने योग्य पीडीएफ दर्शक का उपयोग करें:

<iframe src="http://docs.google.com/gview?url=http://domain.com/your_pdf.pdf&embedded=true" 
style="width:600px; height:500px;" frameborder="0"></iframe>
— हि ले
स्रोत
1

आपके पास यह सरल GoogleDoc दृष्टिकोण भी हो सकता है।

<a  style="color: green;" href="http://docs.google.com/gview?url=http://domain//docs/<?php echo $row['docname'] ;?>" target="_blank">View</a>

यह आपके प्रवाह को विकृत किए बिना डॉक्टर को देखने के लिए एक नया पृष्ठ बनाएगा।

— Asuquo12
स्रोत
यह ठीक काम करता है, धन्यवाद। लेकिन अगर उपयोगकर्ता इंटरनेट कनेक्शन के बिना पीडीएफ देखना चाहता है, तो इस मामले में क्या होगा?
— यूजर
आप JQuery पुस्तकालय जैसे कि pdf.js github.com/mozilla/pdf.js .. का उपयोग कर सकते हैं । 2. पीडीएफ फाइलों को HTML फ़ाइलों में एम्बेड करने के लिए एक जावास्क्रिप्ट लाइब्रेरी है जो PDFObject देखें। यह ब्राउज़र की संगतता को बहुत अच्छी तरह से संभालता है और IE8 पर सबसे अधिक संभावना काम करेगा।
— Asuquo12
0

इसका सरल उपाय यह है कि इसे iframe में रखा जाए और आशा है कि उपयोगकर्ता के पास प्लग-इन है जो इसका समर्थन करता है।

(मुझे नहीं पता, एक्रोबेट प्लगइन ऐसा संसाधन हॉग और अस्थिरता का स्रोत है कि मैं इसे किसी भी ब्राउज़र से हटाने के लिए एक बिंदु बनाता हूं जो इसे छूता है)।

जटिल, लेकिन सापेक्ष लोकप्रिय समाधान इसे एक फ्लैश एप्लेट में प्रदर्शित करना है।

— क्वेंटिन
स्रोत
0

हम पीडीएफ फाइल पेज को जेपीडाल (एक जावा लाइब्रेरी) का उपयोग करते हुए सर्वर पर पीएनजी फाइलों के रूप में प्रस्तुत करते हैं । यह, कुछ जावास्क्रिप्ट के साथ संयुक्त, हमें दृश्य और नेविगेशन पर उच्च नियंत्रण प्रदान करता है।

— Carles Barrobés
स्रोत
मुझे लगता है कि यह बहुत अच्छा है, लेकिन इसके लिए बहुत सारे संसाधन चाहिए।
— ईवेवन्स
लेकिन उपयोगकर्ता पीएनजी से पाठ को कॉपी / पेस्ट नहीं कर सकते हैं।
— वसीली ज़ेवरेव
0

मुझे हाल ही में एक .pdf डॉक्यूमेंट के अधिक मोबाइल-फ्रेंडली, रिस्पॉन्सिबल वर्जन प्रदान करने की आवश्यकता थी, क्योंकि संकीर्ण फोन स्क्रीन के लिए दाएं और बाएं बहुत स्क्रॉल करने की आवश्यकता होती है। केवल ऊर्ध्वाधर स्क्रॉलिंग की अनुमति देने और क्षैतिज स्क्रॉलिंग से बचने के लिए, निम्न चरणों ने मेरे लिए काम किया:

  • Chrome ब्राउज़र में .pdf खोलें
  • Google डॉक्स के साथ ओपन पर क्लिक करें
  • फ़ाइल> डाउनलोड> वेब पेज पर क्लिक करें
  • इसे अनज़िप करने के लिए डाउनलोड किए गए दस्तावेज़ पर क्लिक करें
  • क्रोम ब्राउज़र में इसे खोलने के लिए अनज़िप्ड HTML डॉक्यूमेंट पर क्लिक करें
  • Chrome देव उपकरण खोलने के लिए fn F12 दबाएँ
  • कॉपी कॉपी (डॉक्यूमेंट। क्लिपबोर्ड पर ट्विक किए गए दस्तावेज़ को कॉपी करने के लिए
  • एक पाठ संपादक (जैसे, नोटपैड), या मेरे मामले में VSCode, पेस्ट खोलें, और एक .html एक्सटेंशन के साथ सहेजें।

परिणाम अच्छा लग रहा था और डेस्कटॉप और मोबाइल वातावरण दोनों में उपयोग करने योग्य था।

— मार्कस
स्रोत
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.