1、网页界面中的红框中的图片为跨二级域名所调用的图片,如图1

2、网页源代码,红框中的图片地址为相对于当前网页地址的二级域名,如图2

3、基于 html2canvas 实现的截图,球队LOGO已经消失,如图3

4、访问:http://backend.kaiqiu_shujujiexi_api.dev/team_logo/GZHOU.png ,响应如图4

5、由于图片服务器为Nginx,设置允许跨域访问,重启Nginx,如图5
在nginx.conf里找到server项,并在里面添加如下配置:
add_header Access-Control-Allow-Origin *;

6、再次访问:http://backend.kaiqiu_shujujiexi_api.dev/team_logo/GZHOU.png ,响应如图6

7、js的截图代码中添加2行:allowTaint: true, useCORS: true,如图7

8、截图成功,html2canvas 在跨二级域名下的无法截图的问题得到解决,如图8

9、此种解决方案,即使是跨顶级域名也是支持的,如图9

需要长期技术维护或远程问题排查?
我是拥有 15+ 年经验的 PHP / Go 后端工程师,长期关注已有系统维护、Bug 修复、性能优化、服务器排查、WordPress 网站维护和小功能迭代。
如果你的项目遇到以下情况,可以先从一次小问题排查开始合作:
- ✅ PHP / Laravel / Yii2 老项目无人维护
- ✅ Go / Gin 后端接口需要排查或优化
- ✅ WordPress 网站访问慢、报错或插件冲突
- ✅ Nginx / MySQL / Redis / Linux 服务器异常
- ✅ CDN / Cloudflare / DNS / HTTPS 配置问题
- ✅ 需要长期远程技术支持或兼职维护
更多介绍请查看:关于我 & 合作
微信:13980074657
邮箱:shuijingwanwq@gmail.com
Telegram:@shuijingwan
GitHub:https://github.com/shuijingwan

发表回复