आईओएस 6 सफारी छवि अपलोड - अभिविन्यास गलत

Question

मैंने एक वेब ऐप बनाया है जो आपको ब्राउज़र से एक फोटो अपलोड करने देता है। आईओएस 6 में इसका उपयोग करते समय, तस्वीरों को लैंडस्केप ओरिएंटेशन में समाप्त होने लगते हैं, भले ही उन्हें अपलोड होने पर पोर्ट्रेट में लिया गया हो। क्या मुझे छवि को सही तरीके से प्राप्त करने के लिए कुछ सर्वर साइड चेक करना चाहिए या क्या कुछ प्रकार के आईओएस विशिष्ट विशेषताओं/जावास्क्रिप्ट को मैं इसे ठीक करने के लिए अपलोड फॉर्म पर आवेदन कर सकता हूं?

अद्यतन

के रूप में अनुरोध किया है, यहाँ कोड मैं यह करने के लिए लिखा था है। पूर्व-आवश्यकताएं हैं कि मैं PHP और वाइड इमेज लाइब्रेरी का उपयोग कर रहा हूं (यह एक बहुत बड़ी स्क्रिप्ट से एक स्निपेट है ताकि आप छवि मैनिपुलेशन के लिए कुछ अलग इस्तेमाल कर सकें)।

// Load Image Into Wide Image 
$image=WideImage::load(IMG_UPLOAD_DIR.$result['name']); 
$exif=exif_read_data(IMG_UPLOAD_DIR.$result['name']); 
$orientation=$exif['Orientation']; 
$result['orientation']=$orientation; 

// Use Wide Image To Resize Images 
$full=$image->resize(IMG_FULL_H,IMG_FULL_H); 
$thumb=$image->resize(IMG_THUMB_W,IMG_THUMB_H); 

switch($orientation){ 
    case 2: 
     $full->mirror()->saveToFile(IMG_UPLOAD_DIR.$result['name'], 90); 
     $thumb->mirror()->saveToFile(IMG_UPLOAD_DIR.$thumbName, 90); 
     break; 

    case 3: 
     $full->rotate(-180)->saveToFile(IMG_UPLOAD_DIR.$result['name'], 90); 
     $thumb->rotate(-180)->saveToFile(IMG_UPLOAD_DIR.$thumbName, 90); 
     break; 

    case 4: 
     $full->rotate(180)->mirror()->saveToFile(IMG_UPLOAD_DIR.$result['name'], 90); 
     $thumb->rotate(180)->mirror()->saveToFile(IMG_UPLOAD_DIR.$thumbName, 90); 
     break; 

    case 5: 
     $full->rotate(90)->mirror()->saveToFile(IMG_UPLOAD_DIR.$result['name'], 90); 
     $thumb->rotate(90)->mirror()->saveToFile(IMG_UPLOAD_DIR.$thumbName, 90); 
     break; 

    case 6: 
     $full->rotate(90)->saveToFile(IMG_UPLOAD_DIR.$result['name'], 90); 
     $thumb->rotate(90)->saveToFile(IMG_UPLOAD_DIR.$thumbName, 90); 
     break; 

    case 7: 
     $full->rotate(-90)->saveToFile(IMG_UPLOAD_DIR.$result['name'], 90); 
     $thumb->rotate(-90)->saveToFile(IMG_UPLOAD_DIR.$thumbName, 90); 
     break; 

    case 8: 
     $full->rotate(-90)->saveToFile(IMG_UPLOAD_DIR.$result['name'], 90); 
     $thumb->rotate(-90)->saveToFile(IMG_UPLOAD_DIR.$thumbName, 90); 
     break; 

    default: 
     $full->saveToFile(IMG_UPLOAD_DIR.$result['name'], 90); 
     $thumb->saveToFile(IMG_UPLOAD_DIR.$thumbName, 90); 
     break; 
} 

Answer 1

चेक छवियों exif मेटाडाटा, iPhone कैमरा लेता छवियों 'घुमाया'।

Answer 2

आप (इस सूत्र के निचले भाग में) इस jQuery प्लगइन कोशिश कर सकते हैं

IOS6 and Safari Photo Uploading - File API + Canvas + jQuery Ajax Uploading and Resizing Files Asynchronously

Answer 3

ए-लाइव के जवाब के लिए एक विस्तार के रूप में:

आप गहरे लाल रंग का प्रयोग कर रहे हैं, RMagick एक auto_orient है तरीका। दस्तावेज़ीकरण से:

छवि के EXIF ​​अभिविन्यास टैग के आधार पर छवि को घुमाने या फ़्लिप करता है। ध्यान दें कि आधुनिक डिजिटल कैमरों के केवल कुछ मॉडल अभिविन्यास के साथ एक छवि टैग कर सकते हैं। अगर छवि में अभिविन्यास टैग नहीं है, या छवि पहले से ही ठीक से उन्मुख है, तो auto_orient छवि की एक सटीक प्रति रिटर्न देता है।

Answer 4

यह ध्यान देने योग्य है कि Cloudinary के माध्यम से आपकी छवि को चलाने से यह पता चलता है।

उस सेवा के माध्यम से रूटिंग करने से पहले मैंने अपने आईफोन के साथ ली गई तस्वीरों को घुमाएगी (प्रतीत होता है, कारण के बिना) केवल डेस्कटॉप पर प्रदर्शित होगा।

एक बार एक Cloudinary यूआरएल के पीछे, किसी भी छवि परिवर्तन समारोह के साथ, छवि उचित अभिविन्यास में दिया जाता है।

मैं उनकी भुगतान सेवा का उपयोग कर रहा हूं, लेकिन ऐसा लगता है कि उनके पास एक नि: शुल्क स्तर है।