最近终于将公司的在线设计工具上线了，搞了一个多月，也挺辛苦的，但是也涨了很多知识

这几天客服告知，有用户反馈使用Chrome浏览器，在预览设计的时候，会出现图片只显示一部分的情况

既然有问题，就得排查，找出问题所在

先说说流程吧，在线设计工具使用的Canvas作为画板，用户设计完成之后，会通过Canvas生成图片，并且把图片编码为base64格式，提交到服务器

预览的时候，需要新打开一个窗口，所以就使用的表单提交这些数据，并且给表单设置target="_blank"

开始我测试了一张小图片，一切正常。然后我测试了下大图，果然出现了问题，图片只显示了一部分

通过进一步的排查，发现是因为提交的base64数据，被截断了，导致图片只显示一部分

进一步排查，发现了问题所在

是因为向表单添加input的时候，忘记加type="hidden"属性，导致input默认type="text"

但是在Chrome里，text最大的长度只能到72万，多余的字符，就被抛弃了，所以当图片较大的时候，base64就被截断了

当然，这个问题只有Chrome里会出现。然而我开发的时候，使用的火狐，所以就没发现这个问题

当然，这也是自己粗心大意造成的，所以以后千万不能忽略看似不起眼的地方