إيموجي مخصصة محملة من S3/R2 تتجاوز توجيه CDN

نظرة عامة

عند استخدام S3 أو Cloudflare R2 للرفع إلى جانب عنوان URL مخصص لـ CDN، لا تحترم عمليات رفع الرموز التعبيرية (الإيموجي) المخصصة إعدادات الـ CDN، وتحاول التحميل مباشرة من عنوان URL الأصلي للحاوية (Bucket).

المشكلة

عندما يقوم المسؤول برفع رمز تعبيري مخصص، ينشئ نظام الرفع سجل upload ويحفظ عنوان URL الأصلي للحاوية في قاعدة البيانات (على سبيل المثال: //my-bucket.s3.amazonaws.com/... أو //my-bucket.r2.cloudflarestorage.com/...) — وهذا هو السلوك القياسي في Discourse.

ومع ذلك، عندما يقوم الملف app/models/emoji.rb بإنشاء ذاكرة التخزين المؤقت للرموز التعبيرية الخاصة بـ /site.json، فإنه يمرر upload.url مباشرة إلى كائن emoji:

e.url = emoji.upload&.url

وبما أنه يتخطى دالة مساعدة الـ CDN، يتلقى الواجهة الأمامية عنوان URL الأصلي للحاوية. لذلك، اعتمادًا على مدى صرامة سياسات الوصول الخاصة بالحاوية، يؤدي ذلك إلى ظهور صور معطلة أو يجبر Discourse على توجيه الرموز التعبيرية عبر avatar_proxy الداخلي.

الحل

لقد قمت بفتح طلب سحب (PR) يلتف حول تعيينات عناوين URL باستخدام Discourse.store.cdn_url()، مما يجعل محمل الرموز التعبيرية المخصصة يتماشى مع طريقة توجيه صور المنشورات الرمزية والصور الرمزية القياسية.

حل مؤقت

أثناء انتظار مراجعة طلب السحب ودمجه، قمت بإنشاء مكون سمة (Theme Component) خفيف الوزن يستبدل عنوان URL الأصلي للحاوية بعنوان CDN الصحيح مباشرة قبل عرض الرمز التعبيري المخصص في DOM (يعمل لكل من المنشورات والدردشة).

إذا كنت تواجه هذا الخطأ على موقعك، يمكنك تثبيت هذا المكون وتكوين سلاسل S3 الخاصة بك في إعدادات إدارة السمة لإصلاح أي رموز تعبيرية مخصصة معطلة:

ملاحظة: إذا كنت قد قمت بالفعل برفع رموز تعبيرية مخصصة وهي حاليًا معطلة، فإن تشغيل الأمر discourse remap "//my-raw-bucket-url.com" "https://my-cdn.com" داخل الحاوية (container) سيقوم بإصلاح القديمة منها في قاعدة البيانات، بينما سيقوم مكون السمة بإصلاح أي رموز جديدة يتم رفعها حتى يتم دمج إصلاح طلب السحب في النسخة الأساسية.

3 إعجابات

اختبار مجموعة الرموز التعبيرية الافتراضية

:smiley:

اختبار رمز تعبير مخصص

:falco:

نعم، ربما يكون هذا الأمر خاصًا بخدمة Cloudflare R2 فقط. فهي تسبب مشاكل في نسختي. ويبدو أن المشكلة تحدث فقط مع الملفات المرفوعة حديثًا.

بدون إصلاح مكون الثيم، يجب أن أعمل عملية إعادة تعيين الروابط في كل مرة أرفع ملفًا جديدًا. قد يحتاج طلب الدمج (PR) إلى بعض التحسينات - لست خبيرًا في كود الرموز التعبيرية.

إعجاب واحد (1)

يستخدم Discourse إعدادًا يتضمن شبكتين لتوزيع المحتوى (CDN)، واحدة للموارد والأخرى تعمل كبروكسي للتطبيق.

تستخدم الرموز التعبيرية القياسية شبكة CDN واحدة، بينما تستخدم الرموز التعبيرية المخصصة الشبكة الأخرى، لكن كلاهما محمي بشبكة CDN في موقع إلكتروني مُعد بشكل صحيح مع إعداد يعمل لشبكتين لتوزيع المحتوى.

لقد غطيت ذلك في الموضوع الأول ذي الصلة هنا

هل يحتوي موقعك على إعداد شبكتين لتوزيع المحتوى وهما تعملان بشكل صحيح؟

إعجابَين (2)

أوه، سأضطر لألقاء نظرة - لم أكن أعرف ذلك. شكراً!

تعديل:

كتبت القسم الخاص بـ Cloudflare R2، فهل أفترض أنني قمت بإعداده بشكل صحيح؟ ما الذي قد أغفلته؟

أريد فقط أن أؤكد هنا أنني قمت بتثبيت واختبار فرع PR بعد التغييرات الأخيرة عليه، وقد أصلح المشكلة.