الخطأ أنّه لا يسمح لك استخدام الصورة المتصفح الحديث يطلب أن يُسمح لك من قبل الخادم قبل تعديل الصورة أو الوصول لمعلوماته يجب أن يرسل الخادوم شيء مثل "Access-Control-Allow-Origin *" في ترويسة الـHTTP عمومًا لن تحدث المشكلة في موقع برمجتَه وكانت الصورة على نفس النطاق [1] :
سيظهر خطأ مثل:
Failed to execute 'getImageData' on 'CanvasRenderingContext2D': The canvas has been tainted by cross-origin data.
لهذا الإضافة ترجع قيمة صفرية عندما يحدث هذا الخطأ، جربها في متصفح قديم أو عطل الأمان في متصفحك؛ وستعمل بدون أي مشاكل، إذا كنت ستعرض الصور من خادمٍ لك لا تصدع رأسك بهذه المشكلة.
في مثالك هذا مع الصورة السّابقة في المثال الذي لم يعمل لن تعمل أيضًا، أنظر نفس الصورة تعمل في المثال الأول -فقط أضفتُ crossorigin="anonymous" إلى وسم الصورة كما هي موجودة في مثالك أيضًا كي أطلب من المتصفح والخادم استخدام الـCross Domain راجع الرابط في تعليقي السابق-:
رابط المكتبة التي وضعها @يوسف سيد تحلل الصورة و نتيجتها لون قيمته متوسط ألوان الصورة، و جربتها مع base64 و رابط مباشر للصورة، و كلاهمها يعمل بشكل سليم
في نفس رابط المكتبة للجواب الاساسي في stackoverflow، تحدثوا عن مكتبة أخرى تحلل الصورة و نتيجتها لون قيته أكثر لون مستخدم في الصورة، و هي مكتبة Color Thief و رابطها
مجتمع لمناقشة وتبادل الخبرات حول تطوير الويب. ناقش أحدث التقنيات، اللغات، والأدوات في عالم تطوير المواقع والتطبيقات. شارك مشاريعك، اسأل عن نصائح، وتعاون مع مطورين محترفين وهواة.