2012-02-07 7 views
5

मुझे लगता है कि निम्नलिखित की अनुमति देता है एक jQuery प्लगइन रहा हूँ:फसल और छवि अपलोड करें jQuery/जावा का उपयोग कर

  1. करें/ब्राउज एक छवि (उपयोगकर्ता के फाइल सिस्टम से)
  2. पूर्वावलोकन छवि, की क्षमता के साथ करने के लिए फसल
  3. सर्वर (जावा सर्वलेट) को फसली छवि

इस के लिए किसी भी संकेत दिए गए अपलोड करें?

पीएस : मुझे कई स्टैंडअलोन छवि क्रॉपिंग प्लगइन्स मिल गए हैं (जो प्री-डिफ़ाइंड छवियों पर काम करते हैं), लेकिन ऐसे नहीं हैं जो कस्टम छवि को अपलोड करने की अनुमति देते हैं (जावा सर्वलेट्स पर)।

उत्तर

1

एक तरीका, वास्तव में एचटीएमएल 5 समर्थित ब्राउज़र में सर्वर पर अपलोड करने से पहले छवि को फसल करने के लिए, here समझाया गया है। उल्लेखनीय समाधान का संयोजन है: जेसीआरओपी, JQuery, एचटीएमएल 5 की फाइल और कैनवास एपीआई।

(गैर एचटीएमएल 5 ब्राउज़र के लिए) जाने के लिए दूसरा रास्ता है:

  1. करें/ब्राउज़ छवि
  2. सर्वर पर अपलोड (अस्थायी छवि के रूप में)
  3. पूर्वावलोकन छवि, फसल की क्षमता के साथ
  4. संदेश फसल सर्वर
  5. फसल के लिए समन्वय करता है और सर्वर साइड पर छवि को बचाने
+0

मैंने कुछ समय पहले कुछ फसल/पूर्वावलोकन/अपलोड कार्यक्षमता के लिए एएसपी.NET के साथ जेसीआरपी/JQuery का उपयोग किया था। यह एक आश्चर्यजनक सुखद अनुभव था! – Scozzard

0

संक्षेप में आपको निम्नलिखित करने की आवश्यकता होगी।

उपयोग एचटीएमएल "बहुखण्डीय" फ़ॉर्म छवि एक "सार्वजनिक" फ़ोल्डर में इस फाइल को सर्वलेट को

<form name="frm" enctype="multipart/form-data" action="/saveimage" method="POST"> 
    <input type="file" name="filetoupload" />  
    <input type="submit" value="Upload" /> 
</form> 

सर्वलेट लिखने में इतना है कि यह ब्राउज़र के लिए सुलभ है पोस्ट करने के लिए। यदि आप Servlets का उपयोग कर रहे हैं तो आप इस उद्देश्य के लिए http://commons.apache.org/fileupload/ का उपयोग कर सकते हैं। यदि आप वेब ऐप ढांचे का उपयोग कर रहे हैं, तो ढांचा आपको बाइनरी डेटा अपलोड करने का एक तरीका प्रदान कर सकता है।

अपलोड छवि के लिंक/संदर्भ के साथ वापसी पृष्ठ। फ़ाइल संदर्भ टकराव से बचने के लिए आप किसी प्रकार की यादृच्छिक फ़ाइल नाम पीढ़ी एल्गोरिदम का उपयोग करना चाह सकते हैं।

<img src="/public/random-image.jpg"/> 

उपयोग JCrop http://deepliquid.com/content/Jcrop.html फसल निर्देशांक पाने के लिए। JCrop दस्तावेज़ इसका उपयोग करने के तरीके के बारे में बहुत verbose है। ध्यान दें कि आपको ऊपर दिए गए छवि संदर्भ से जुड़ने के लिए जेसीओआर को प्रारंभ करना होगा।

एक और सर्वलेट लिखें जिसमें आप पोस्ट किए गए कोस्टेटेट्स पोस्ट/प्राप्त कर सकते हैं और जो कुछ भी आप चाहते हैं उसे करें।