移动端微信微信公众号作题小游戏踩的小坑

         前几天公司接到一个在微信公众号中要开发一个作题的小游戏，里面大概内容是作八道题，根据答对多少题，最后生成一个图片格式的聘书。微信默认长按图片能够发给好友，点击分享能够分享到朋友圈，可是不能直接将图片分享到朋友圈，须要先保存图片到本地才能够往朋友圈发，或者分享带连接的地址，微信默认分享朋友圈连接是没有缩略图的，自定义能够添加。

          首先项目使用的是vue.js写的界面，数据都是放到js中的，里面的题都是单选，每当有选中的选项就会跳到第二页，以此类推，知道最后一题，有选中的就会出现提交按钮，提交以后，根据答题对的个数，判断相应的职位，而后将职位回显到html页面上，而后经过 “html2canvas.js” 这么一个canvas插件将图片生成放到最顶层便可，这时候会出现一个问题，生成的图片不清晰，朕也是在网上各类教程超看，绝大多数人说将页面放大到两倍，生成图片缩小便可，但是我试了好屡次最终失败告别了这个方案，决定放弃使用清晰的图片。后来想一想，客户看到确定回不满意，怎么办！ 怎么办！ 

         以后下班回到家，又作了个demo.各类测试。各类调试，依然失败，后来把页面顺便又看了一遍，忽然发现head中有这么一句代码  “

        <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />”

        这段代码相信你们都不陌生，过多的不解释了， 我把这段代码修改为 “<meta name="viewport" content="user-scalable=no" />”  神奇的事情就发生了，再次生成图片的时候图片竟然和html同样清晰，我反复试了好屡次，对页面没什么影响，ok，搞定，大快人心啊！这个坑我用了两天时间解决