ब्राउज़र डॉक्यूमेंट एनोटेशन स्टूडियो कैसे बनाएं

कॉन्ट्रैक्ट्स, इनवॉइस या सबूतों के साथ काम करने वाली टीमों को केवल एक साधारण व्यूअर से कहीं अधिक की आवश्यकता होती है। उन्हें संवेदनशील फाइलों को सर्वर पर अपलोड किए बिना विभिन्न स्रोतों से पेजों को इकट्ठा करने के तरीके की आवश्यकता होती है।

आप TypeScript, Vite और Dynamsoft टूल्स का उपयोग करके क्लाइंट-साइड डॉक्यूमेंट एनोटेशन स्टूडियो बना सकते हैं।

यह ऐप आपको अनुमति देता है:

Technical Stack:

Key Logic:

वर्तमान फ़ाइल को बदलने के बजाय, पेजों को जोड़ने के लिए doc.loadSource(source, index) का उपयोग करें। यह आपको कई अलग-अलग इमेज और PDFs से एक एकल डॉक्यूमेंट बनाने की अनुमति देता है।

स्कैनर के लिए, Dynamic Web TWAIN ब्रिज का उपयोग करें। चूंकि ब्राउज़रों में मानक स्कैनर API की कमी होती है, इसलिए DWT हार्डवेयर के साथ कनेक्शन प्रदान करता है। आप स्कैन की गई इमेज को PDF blob में बदल सकते हैं और उन्हें तुरंत अपने व्यूअर में जोड़ सकते हैं।

सुरक्षा के लिए, रेडैक्शन एनोटेशन (redaction annotations) का उपयोग करें। आप संवेदनशील टेक्स्ट के ऊपर एक काला आयत (rectangle) बना सकते हैं। उपयोगकर्ता इसे डॉक्यूमेंट पर स्थायी रूप से लागू करने से पहले इस मार्क को मूव या रीसाइज कर सकते हैं।

एक्सपोर्ट करना लचीला है। आप विभिन्न PDF मोड चुन सकते हैं:

यह दृष्टिकोण सभी प्रोसेसिंग को क्लाइंट-साइड पर रखता है। आपका डेटा निजी और सुरक्षित रहता है।

Source: https://dev.to/yushulx/how-to-build-a-browser-document-annotation-studio-with-pdf-image-and-scanner-capture-in-typescript-5e5c