如何用JavaScript实现获取背景图片颜色深浅，对文字颜色进行黑/白调整？

Question

我现在在做一个页面，背景图片是从一个图片库里随机获取的，有些颜色较深，有些颜色较浅，我想实现用js自动判断，当图片颜色深时，将字体颜色设置为白色，当图片颜色浅时设置为黑色。
就像iOS锁屏时间的颜色会根据壁纸颜色深浅自动变化一样。
请问如何才能实现判断图片颜色深浅这一步呢？

Answer 1

利用canvas获取图片像素值，然后对像素进行采样，然后就不用我说了吧？

---

那就把计算像素的工作交给后端，后端计算好了把图片和结果一起返回给前端。不过这样就得改api了，前一种方法实际上也得改api。可以增加接口，而不改动现有接口（但实现还是要改），每次随机获取图片后后端就在session中记录这个会话上一次获取的图片的唯一id，然后再提供一个接口获取上一次随机的图片，或者上一次随机的图片的平均像素值。