exif photo blog

؟ مدونة صور EXIF

App-Overview.mp4

التطبيق التجريبي

https://photos.sambecker.com

سمات

• مصادقة مدمجة
• تحميل الصور مع استخراج EXIF
• تنظيم الصور بالعلامة
• التمرير اللانهائي
• وضع الضوء/الظلام
• توليد صور OG التلقائي
• قائمة CMD-K مع البحث عن الصور
• الدعم التجريبي للأوصاف التي تم إنشاؤها
• دعم محاكاة Fujifilm

تثبيت

1. نشر إلى Vercel

1. انقر فوق نشر
2. أضف التخزين المطلوب (Vercel Postgres + Vercel Blob) كجزء من تثبيت القالب
3. تكوين متغير البيئة لمجال الإنتاج في إعدادات المشروع
   • NEXT_PUBLIC_SITE_DOMAIN (على سبيل المثال ، photos.domain.com-يستخدم في الرابط الثابت وشوهد في NAV العلوي اليمين)

2. الإعداد مصادقة

1. توليد سر المصادقة وأضف إلى متغيرات البيئة:
   • AUTH_SECRET
2. أضف مستخدم المسؤول إلى متغيرات البيئة:
   • ADMIN_EMAIL
   • ADMIN_PASSWORD
3. الزناد إعادة النشر
   • تفضل بزيارة المشروع على Vercel ، وانتقل إلى علامة التبويب "Deployments" ، وانقر فوق الزر ••• بجوار أحدث النشر ، وحدد "إعادة النشر"

3. قم بتحميل صورتك الأولى؟

1. زيارة /admin
2. تسجيل الدخول مع بيانات الاعتماد المقدمة في الخطوة 2
3. انقر فوق "تحميل الصور"
4. إضافة عنوان اختياري
5. انقر فوق "إنشاء"

النمو محليا

1. رمز استنساخ
2. قم بتشغيل pnpm i لتثبيت التبعيات
3. إذا لزم الأمر ، قم بتثبيت Vercel CLI والتوثيق عن طريق تشغيل vercel login
4. قم بتشغيل vercel link لتوصيل CLI بمشروعك
5. قم بتشغيل vercel dev لبدء تشغيل خادم Dev مع متغيرات البيئة التي تديرها Vercel

مزيد من التخصيص

توليد النص التجريبي من الذكاء الاصطناعي

️ اقرأ قبل المتابعة

سيؤدي استخدام هذه الميزة إلى رسوم من Openai. عند تمكين توليد نص الذكاء الاصطناعي ، اتبع جميع عمليات التخفيف الموصى بها من أجل تجنب الرسوم والهجمات غير المتوقعة. تأكد من أن متغير البيئة المفتاح Openai Secret الخاص بك غير مسبوقة بـ Next_public.

1. إعداد Openai
   • إذا لم يكن لديك بالفعل حساب ، فقم بإنشاء حساب Openai وقم بتمويله (انظر هذا الموضوع إذا كنت تواجه مشكلات)
   • قم بإنشاء مفتاح API وتخزين في البيئة OPENAI_SECRET_KEY
   • حدود استخدام الإعداد لتجنب الرسوم غير المتوقعة ( الموصى بها )
2. أضف الحد من المعدل ( الموصى به )
   • كإجراء احترازي إضافي ، قم بإنشاء متجر Vercel KV وربطه بمشروعك من أجل تمكين الحد من معدل - أي تكوين إضافي ضروري
3. تكوين الحقول التي تم إنشاؤها تلقائيًا (اختياري)
   • قم بتعيين أي حقول نصية تلقائية عند تحميل صورة عن طريق تخزين قائمة مفصولة بفاصلة ، على سبيل المثال ، AI_TEXT_AUTO_GENERATED_FIELDS = title, semantic
   • القيم المقبولة:
     • all (افتراضي)
     • title
     • caption
     • tags
     • semantic
     • none

تحليلات الويب

1. مشروع مفتوح على Vercel
2. انقر فوق علامة التبويب "تحليلات"
3. اتبع تعليمات "تمكين تحليلات الويب" ( @vercel/analytics المتضمنة بالفعل)

رؤى السرعة

1. مشروع مفتوح على Vercel
2. انقر فوق علامة التبويب "Speed ​​Insights"
3. اتبع تعليمات "تمكين السرعة رؤى" ( @vercel/speed-insights المتضمنة بالفعل)

التكوين الاختياري

يمكن تغيير سلوك التطبيق من خلال تكوين متغيرات البيئة التالية:

موقع التعريف

• NEXT_PUBLIC_SITE_TITLE (شوهد في علامة التبويب المتصفح)
• NEXT_PUBLIC_SITE_DESCRIPTION (شوهد في NAV ، أسفل العنوان)
• NEXT_PUBLIC_SITE_ABOUT (شوهد في الشريط الجانبي للشبكة - علامات تنسيق غنية مقبولة: <b> ، <strong> ، <i> ، <em> ، <u> ، <br> )

سلوك الموقع

• NEXT_PUBLIC_GRID_HOMEPAGE = 1 يعرض تخطيط الشبكة على الصفحة الرئيسية
• NEXT_PUBLIC_DEFAULT_THEME = light | dark مجموعات NEXT_PUBLIC_DEFAULT_THEME = light | dark المميزة المفضلة (الافتراضية system عند عدم تكوينها)
• NEXT_PUBLIC_PRO_MODE = 1 يتيح تخزين صورة أعلى جودة (يؤدي إلى زيادة استخدام التخزين)
• NEXT_PUBLIC_STATICALLY_OPTIMIZE_PAGES = 1 يتيح تحسينًا ثابتًا للصفحات ، أي أن يقدم صفحات في وقت البناء (يؤدي إلى زيادة استخدام المشروع) - ️ تجريبي
• NEXT_PUBLIC_STATICALLY_OPTIMIZE_OG_IMAGES = 1 يتيح تحسينًا ثابتًا لصور OG ، أي أن يصنع الصور في وقت الإنشاء (يؤدي إلى زيادة استخدام المشروع) - ️ تجريبي
• NEXT_PUBLIC_MATTE_PHOTOS = 1 يقيد حجم كل صورة ، ويمكّن الحدود المحيطة (يحتمل أن تكون مفيدة للصور ذات نسب عرضية طويلة)
• NEXT_PUBLIC_BLUR_DISABLED = 1 يمنع تخزين بيانات طمس الصورة وعرضها (من المحتمل أن يكون مفيدًا للحد من استخدام ما بعد)
• NEXT_PUBLIC_GEO_PRIVACY = 1 يعطل جمع/عرض البيانات المستندة إلى الموقع ( ️ إعادة ضغط الصور التي تم تحميلها من أجل إزالة معلومات GPS)
• NEXT_PUBLIC_HIDE_REPO_LINK = 1 يزيل رابط تذييل إلى الريبو
• NEXT_PUBLIC_ALLOW_PUBLIC_DOWNLOADS = 1 يتيح تنزيلات الصور العامة لجميع الزوار ( ️ قد يؤدي إلى زيادة استخدام النطاق الترددي)
• NEXT_PUBLIC_PUBLIC_API = 1 يمكّن واجهة برمجة التطبيقات العامة المتاحة في /api
• NEXT_PUBLIC_IGNORE_PRIORITY_ORDER = 1 يمنع الحقل priority_order
• NEXT_PUBLIC_HIDE_SOCIAL = 1 يزيل زر x من وسيط مشاركة
• NEXT_PUBLIC_HIDE_FILM_SIMULATIONS = 1 يمنع محاكاة Fujifilm تظهر في الشريط الجانبي /grid و CMD-K
• NEXT_PUBLIC_HIDE_EXIF_DATA = 1 يخفي بيانات EXIF ​​في تفاصيل الصورة وصور OG (من المحتمل أن تكون مفيدة للمحافظ ، والتي لا تركز على التصوير الفوتوغرافي)
• NEXT_PUBLIC_GRID_ASPECT_RATIO = 1.5 مجموعة نسبة العرض إلى الارتفاع لبلاط الشبكة (الافتراضيات إلى 1 - تزيل إلى 0 القيد)
• NEXT_PUBLIC_SHOW_LARGE_THUMBNAILS = 1 يضمن الصور المصغرة الكبيرة على مشاهدات شبكة الصور
• NEXT_PUBLIC_OG_TEXT_ALIGNMENT = BOTTOM يحافظ على محاذاة نص صورة OG (الافتراضي هو الأعلى)

مقدمي التخزين البديل

يمكن استخدام محول تخزين واحد فقط - BLOB BLOB أو CloudFlare R2 أو AWS S3 - في وقت واحد. من الناحية المثالية ، تم تكوين هذا قبل تحميل الصور (انظر العدد رقم 34 لاعتبارات الترحيل). إذا كان لديك محولات متعددة ، فيمكنك تعيين واحدة على أنها مفضلة عن طريق تخزين "AWS-S3" أو "CloudFlare-R2" أو "Vercel-Blob" في NEXT_PUBLIC_STORAGE_PREFERENCE .

Cloudflare R2

1. دلو الإعداد
   • قم بإنشاء دلو R2 مع إعدادات افتراضية
   • إعداد الكورس تحت إعدادات دلو:

   [{
       "AllowedHeaders" : [ " * " ],
       "AllowedMethods" : [
         " GET " ,
         " PUT "
       ],
       "AllowedOrigins" : [
          " http://localhost:3000 " ,
          " https://{VERCEL_PROJECT_NAME}*.vercel.app " ,
          " {PRODUCTION_DOMAIN} "
       ]
   }]

   • تمكين الاستضافة العامة من خلال القيام بواحد مما يلي:
     • حدد "Connect Custom Domain" واختر مجال CloudFlare
     • أو
     • حدد "السماح للوصول" من R2.dev Subdude
   • تخزين التكوين العام:
     • NEXT_PUBLIC_CLOUDFLARE_R2_BUCKET : اسم دلو
     • NEXT_PUBLIC_CLOUDFLARE_R2_ACCOUNT_ID : معرف الحساب (الموجود في صفحة نظرة عامة على R2)
     • NEXT_PUBLIC_CLOUDFLARE_R2_PUBLIC_DOMAIN : إما "your-custom-domain.com" أو "pub-jf90908 ... s0d9f8s0s9df.dev" ( لا تشمل "https: //" في مجالك )
2. إعداد بيانات الاعتماد الخاصة
   • قم بإنشاء رمز API عن طريق تحديد "إدارة الرموز المميزة لـ R2 API" ، والنقر فوق "إنشاء رمز API"
   • حدد "كائن قراءة وكتابة" ، "اختر" ، قم بتطبيق دلاء محددة فقط "، وحدد الدلو الذي تم إنشاؤه في الخطوة 1
   • تخزين بيانات الاعتماد ( ️ تأكد من عدم وجود مفاتيح الوصول مع NEXT_PUBLIC ):
     • CLOUDFLARE_R2_ACCESS_KEY
     • CLOUDFLARE_R2_SECRET_ACCESS_KEY

AWS S3

1. دلو الإعداد
   • قم بإنشاء دلو S3 مع "ACLS Enbed" و "حظر جميع وصول الجمهور"
   • إعداد الكورس تحت أذونات دلو:

     [{
      "AllowedHeaders" : [ " * " ],
      "AllowedMethods" : [
        " GET " ,
        " PUT "
      ],
      "AllowedOrigins" : [
        " http://localhost:* " ,
        " https://{VERCEL_PROJECT_NAME}*.vercel.app " ,
        " {PRODUCTION_DOMAIN} "
      ],
      "ExposeHeaders" : []
     }]

   • تخزين التكوين العام
     • NEXT_PUBLIC_AWS_S3_BUCKET : اسم دلو
     • NEXT_PUBLIC_AWS_S3_REGION : منطقة دلو ، على سبيل المثال ، "US-East-1"
2. إعداد بيانات الاعتماد الخاصة
   • إنشاء سياسة IAM باستخدام محرر JSON:

     {
       "Version" : " 2012-10-17 " ,
       "Statement" : [
         {
           "Effect" : " Allow " ,
           "Action" : [
             " s3:PutObject " ,
             " s3:PutObjectACL " ,
             " s3:GetObject " ,
             " s3:ListBucket " ,
             " s3:DeleteObject "
           ],
           "Resource" : [
             " arn:aws:s3:::{BUCKET_NAME} " ,
             " arn:aws:s3:::{BUCKET_NAME}/* "
           ]
         }
       ]
     }

   • قم بإنشاء مستخدم IAM عن طريق اختيار "إرفاق سياسات مباشرة" ، واختيار السياسة التي تم إنشاؤها أعلاه. قم بإنشاء "مفتاح الوصول" ضمن "بيانات اعتماد الأمان" ، واختر "تطبيق تشغيل AWS خارجًا" ، وتخزين بيانات الاعتماد ( ️ تأكد من عدم وجود مفاتيح الوصول مع NEXT_PUBLIC ):
     • AWS_S3_ACCESS_KEY
     • AWS_S3_SECRET_ACCESS_KEY

موفري قواعد البيانات البديلة (التجريبية)

يمكن تحويل Vercel Postgres إلى مزود آخر متوافق مع Postgres ومتوافق مع تحديث POSTGRES_URL . يعمل بعض مقدمي الخدمات فقط عند تعطيل SSL ، والذي يمكن تكوينه عن طريق إعداد DISABLE_POSTGRES_SSL = 1 .

supabase

1. تأكد من تعيين سلسلة الاتصال على "وضع المعاملة" عبر المنفذ 6543
2. تعطيل SSL عن طريق الإعداد DISABLE_POSTGRES_SSL = 1

التعليمات

كيف أتلقى تحديثات القالب؟

بالنسبة إلى إعادة الشحن ، انقر فوق "رمز" ، ثم "تحديث فرع" من صفحة الريبو الرئيسية. إذا قمت باستنساخ الرمز في الأصل ، فيمكنك إنشاء شوكة من GitHub ، ثم قم بتحديث اتصال GIT الخاص بك من إعدادات مشروع Vercel. بمجرد الانتهاء من ذلك ، قد تحتاج إلى الانتقال إلى صفحة نشر المشروع الخاصة بك ، انقر فوق ••• ، حدد "إنشاء النشر" ، واختر main .

كيف أقوم بتحرير صور متعددة؟

على سطح المكتب ، حدد ••• قائمة في الجزء العلوي الأيمن بجوار عنوان الموقع واختر ، "حدد MOUNTION." على الهاتف المحمول ، يمكن الوصول إلى "تحديد صور متعددة" من قائمة البحث. من هناك ، يمكنك إجراء الإجراءات بالجملة والمفضلة وحذف الإجراءات.

لماذا لا تظهر تغييرات صورتي على الفور؟

يعمل هذا القالب على تحسين المشاهدات الأساسية بشكل ثابت مثل / و /grid لتقليل أوقات تحميل الزوار. وبالتالي ، عند إضافة الصور أو تحريرها أو إزالتها ، قد يستغرق الأمر عدة دقائق لتلك التغييرات التي يجب نشرها. إذا كان يبدو أن التغيير لا يسري ، فحاول التنقل إلى /admin/configuration والنقر فوق "Clear Cache."

لماذا لا تبدو صوري الأقدم صحيحة؟

مع تطور القالب ، تمت إضافة حقول exif (مثل العدسات) ، ويتم إنشاء بيانات طمس من خلال طريقة مختلفة ، وتم إضافة ميزات الذكاء الاصطناعي/الخصوصية. من أجل إحضار الصور القديمة ، إما انقر فوق الزر "Sync" بجوار صورة أو استخدام صفحة الصور القديمة ( /admin/outdated ) لإجراء تحديثات الدُفعات.

لماذا لا يتم تحميل صور OG الخاصة بي عندما أشارك الرابط؟

تتطلب العديد من الخدمات مثل iMessage و Slack و X ، استجابات شبه ثابتة عند تحرير المحتوى القائم على الارتباط. من أجل ضمان استجابة كافية ، فكر في تقديم الصفحات وأصول الصور في وقت مبكر عن طريق تمكين التحسين الثابت عن طريق تعيين NEXT_PUBLIC_STATICALLY_OPTIMIZE_PAGES = 1 و NEXT_PUBLIC_STATICALLY_OPTIMIZE_OG_IMAGES = 1 . ضع في اعتبارك أن هذا سيزيد من استخدام النظام الأساسي.

لماذا تأخذ الصور العمودية مساحة كبيرة؟

بشكل افتراضي ، يتم عرض جميع الصور عرضًا كاملًا ، بغض النظر عن التوجه. تمكين الحصير لعرض الصور الأفقية والعمودية على مقاييس مماثلة عن طريق تعيين NEXT_PUBLIC_MATTE_PHOTOS = 1 .

لماذا صورة المصغرة الخاصة بي صغيرة جدًا؟

تعتمد كثافة شبكة Thumbnail (شوهد على /grid ، نظرة عامة على العلامات ، ومجموعات الصور الأخرى) على تكوين نسبة العرض إلى الارتفاع (نسب 1 أو أقل تحتوي على المزيد من الصور لكل صف). يمكن تجاوز هذا عن طريق تعيين NEXT_PUBLIC_SHOW_LARGE_THUMBNAILS = 1 .

ما مدى أمان الصور "المخفية"؟

في حين أن جميع المسارات المخفية ( /tag/hidden/* ) تتطلب المصادقة ، تظل الروابط الأولية لأصول الصور الفردية متاحة للجمهور. عناوين URL التي تم إنشاؤها عشوائيًا من مزودي التخزين آمنة فقط عن طريق الغموض. استخدم بحذر.

لقد انخفضت الصور/المحتوى الخاص بي مع قاعدة البيانات الخاصة بي و/أو لم يعد موقع الإنتاج الخاص بي يتطابق مع التطوير المحلي. ماذا أفعل؟

انتقل إلى /admin/configuration وانقر فوق "مسح ذاكرة التخزين المؤقت".

أرى أخطاء وقت التشغيل من جانب الخادم عند تحميل صفحة بعد تحديث شوكة الشوكة. ماذا أفعل؟

انتقل إلى /admin/configuration وانقر فوق "مسح ذاكرة التخزين المؤقت". إذا لم يساعد هذا ، افتح مشكلة.

لماذا مربع المصغرة الخاص بي؟

التكوين الغائب ، نسبة عرض الشبكة الافتراضية هي 1 . يمكن تعيين NEXT_PUBLIC_GRID_ASPECT_RATIO على أي رقم (على سبيل المثال ، 1.5 ل 3: 2 صور) أو تجاهلها عن طريق الإعداد إلى 0 .

لماذا لا تستورد عمليات محاكاة Fujifilm إلى جانب بيانات EXIF؟

يتم تخزين بيانات محاكاة Fujifilm في ثنائيات Makernote الخاصة بالبائع المضمنة في بيانات EXIF. في ظل ظروف معينة ، يجوز للوسيط تجريد هذه البيانات. على سبيل المثال ، هناك مشكلة معروفة على iOS حيث يؤدي تحرير صورة ، على سبيل المثال ، اقتصاصها ، إلى فقدان بيانات Makernote. إذا بدا أن بيانات المحاكاة مفقودة ، فحاول استيراد الملف الأصلي كما تم تخزينه بواسطة الكاميرا. بالإضافة إلى ذلك ، إذا تمكنت من تأكيد وضع المحاكاة ، فيمكنك تحرير الصورة وتحديدها يدويًا.

لماذا تظهر صوري مقلوبة/تدور بشكل غير صحيح؟

لعدة أسباب ، يتم دعم التوجهات الخارجة فقط: 1 و 3 و 6 و 8. التوجهات 2 و 4 و 5 و 7 - التي تستفيد من النسخ المتطابق - غير مدعومة.

لماذا تبدو ضبابية العنصر النائب عن الصورة مختلفة عن الصورة إلى الصورة؟

ولدت الإصدارات السابقة من هذا القالب بيانات طمس على العميل ، والتي تباينت بصريًا من المتصفح إلى المتصفح. يتم إنشاء البيانات الآن باستمرار على الخادم. إذا كنت ترغب في تحديث بيانات الضبابية للحصول على صورة معينة ، فقم بتحرير الصورة المعنية ، وعدم إجراء أي تغييرات ، واختيار "تحديث".

لماذا لا تنتهي التحميلات الكبيرة المتعددة الفوتو؟

المهلة الافتراضية لمعالجة التحميلات المتعددة هي 60 ثانية (حد حسابات الهواية). يمكن تمديد ذلك إلى 5 دقائق على حسابات Pro عن طريق تعيين maxDuration = 300 في src/app/admin/uploads/page.tsx .

لقد أضفت مفتاح Openai الخاص بي ، لكن لا يبدو أن يجعله يعمل. لماذا أرى أخطاء اتصال؟

قد تحتاج إلى الاعتمادات قبل الشراء قبل الوصول إلى API Openai. انظر العدد رقم 110 للمناقشة.

هل يمكن أن يعمل هذا القالب في صورة Docker؟

ربما. انظر العدد رقم 116 للمناقشة.