zhaojiemin
/
tourist


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209
							<!DOCTYPE html>

<html>

<head>

<meta charset="utf8">

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />

<title>测测你国庆该去哪里玩</title>

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

<!-- <link rel="shortcut icon" href="favicon.ico"> -->

<meta name="apple-mobile-web-app-capable" content="yes">

<meta content="yes" name="apple-touch-fullscreen">

<meta name="apple-mobile-web-app-status-bar-style" content="black">

<meta http-equiv="Expires" content="0">

<meta http-equiv="Pragma" content="no-cache">

<meta http-equiv="Cache-control" content="no-cache">

<meta http-equiv="Cache" content="no-cache">

<link rel="stylesheet" href="css/bske.css">

<script type="text/javascript" src='js/jquery.js'></script>

<script src="https://cdn.bootcss.com/html2canvas/0.5.0-beta4/html2canvas.js"></script>

<script type="text/javascript" src='js/test.js'></script>

<script type="text/javascript" src='js/es6-promise.js'></script>

<script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>

</head>

<body>

<div class="content">

	<div class="share" id="canvas">

		<div class="shareBox">

            <div class="shareTop">

                <span>赵铁柱</span>在国庆该去的目的地是

            </div>

            <div class="shareInfor">

                <div class="infor inforBg"></div>

                <div class="infor inforBox">

                    <div class="inforAdress">火星的奥林匹山</div>

                    <div class="inforLabel">

                        <div class="colLabel">

                            <div class="titLabel">性格<br />特征</div>

                            <div class="Label">豪迈、沧桑</div>

                        </div>

                        <div class="colLabel">

                            <div class="titLabel">气质<br />速写</div>

                            <div class="Label">自然的崇拜者</div>

                        </div>

                    </div>

                    <div class="explain">

                        <p><span>赵铁柱</span>乘坐探险者一号飞船顺利着陆，跨出舱的第一步激起了飘扬的火星尘，这是整个太阳系最高的山脉，能看到远处蓝宝石般的地球。</p>

                        <p>这次旅行费用需要<span>赵铁柱</span><br/><em>在山西挖煤挖到300000斤</em>方可成行。</p>

                    </div>

                </div>


            </div>


        </div>

	</div>

	
</div>

<script>

    $(function(){

        function getUrlParms(name){

           var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");

           var r = window.location.search.substr(1).match(reg);

           if(r!=null) return unescape(r[2]); return null;

        };

        var pick = getUrlParms("pick");

        if( !pick ){

            window.location.href='index.html';

            return

        };

        init.showIndicator();

        $.ajax({  

            type:'get',  

            url : 'http://wx.yingyinglicai.com/question/pick?pick='+pick,

            dataType:'JSON',

            contentType:"application/json; charset=utf-8",

            success:function(data) {  

                if(data.success){

                    var imgSrc = "";

                    getCanvasBase64(imgSrc).then(function (base64) {

                        console.log("方式二》》》》》》》》》",base64);

                        getImg();

                    }, function (err) {

                        console.log(err);

                    });

                }

                
            },  

            error:function() {  

                init.hideIndicator();

            }  

        }); 

        function getBase64Image(img, width, height) {

            var canvas = document.createElement("canvas");

            canvas.width = width ? width : img.width;

            canvas.height = height ? height : img.height;

            var ctx = canvas.getContext("2d");

            ctx.drawImage(img, 0, 0, canvas.width, canvas.height);

            var dataURL = canvas.toDataURL();

            return dataURL;

        }

        function getCanvasBase64(img) {

            var image = new Image();

            //至关重要

            image.crossOrigin = '';

            image.src = img;

            //至关重要

            var deferred = $.Deferred();

            if (img) {

                image.onload = function () {

                    deferred.resolve(getBase64Image(image));//将base64传给done上传处理

                    // document.getElementById("container2").appendChild(image);

            }

                return deferred.promise();//问题要让onload完成后再return sessionStorage['imgTest']

            }

        }

        // 分享

        var wxParam = {};

        var wx_share = function(param, url) {

            $.ajax({

                url:  'http://wx.yingyinglicai.com/checkJsAuth?url='+url,

                type: "GET",

                dataType:'JSON',

                contentType:"application/json; charset=utf-8",

                success: function(res) {

                    if (res.code == 0) {

                        var data = res.data;

                        wxParam = param;


                        // 分享配置

                        wx.config({

                            debug: false,

                            appId: data.app_id, // 必填，企业号的唯一标识

                            timestamp: data.timestamp, // 必填，生成签名的时间戳

                            nonceStr: data.nonceStr, // 必填，生成签名的随机串

                            signature: data.signature,// 必填，签名，见附录1

                            jsApiList: ['onMenuShareTimeline','onMenuShareAppMessage'] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2

                        });

                    }

                },  

                error : function(res) {}

            })

        };

        wx_share({

            title: "1分享标题分享标题1",

            desc: "分享描述分享描述" ,

            link: "http://wx.yingyinglicai.com/index",

            imgUrl: "http://bbs.eqxiu.com/uc_server/avatar.php?uid=2745371&size=small",

            successFn: function(){

                // 用户确认分享后执行的回调函数

            },

            cancelFn: function(){

                // 用户取消分享后执行的回调函数

            }

        },window.location.href);

       
        wx.ready(function () {

            wx.onMenuShareTimeline({//分享到朋友圈

                title: wxParam.title,

                link: wxParam.link,

                imgUrl: wxParam.imgUrl,

                success: function () {

                    if (wxParam.successFn) {wxParam.successFn();}

                }, cancel: function () {

                    if (wxParam.cancelFn) {wxParam.cancelFn();}

                }

            });

            wx.onMenuShareAppMessage({//分享给朋友

                title: wxParam.title,

                desc: wxParam.desc,

                link: wxParam.link,

                imgUrl: wxParam.imgUrl,

                success: function () {

                    if (wxParam.successFn) {wxParam.successFn();}

                }, cancel: function () {

                    if (wxParam.cancelFn) {wxParam.cancelFn();}

                }

            });

        });

        function getImg(){

            var canvas2 = document.createElement("canvas");

            let _canvas = document.querySelector('#canvas');

            var w = parseInt(window.getComputedStyle(_canvas).width);

            var h = parseInt(window.getComputedStyle(_canvas).height);

            canvas2.width = w * 2;

            canvas2.height = h * 2;

            canvas2.style.width = w + "px";

            canvas2.style.height = h + "px";

            var context = canvas2.getContext("2d");

            context.scale(2, 2);

            html2canvas(document.querySelector('#canvas'), { canvas: canvas2 }).then(function(imgUrl) {

                let oImg = document.createElement('img');

                oImg.id = 'oImg';

                oImg.className = 'o-img';

                oImg.src= imgUrl.toDataURL();//imgUrl是html2canvas返回的截图的base64码

                document.body.appendChild(oImg);//将生成的截图放到页面中

                $("#canvas").hide();

                init.hideIndicator();

            });

        };

        $("#goWeChat").on('click',function(){

            window.location.href='https://mp.weixin.qq.com/mp/profile_ext?action=home&__biz=MzAwMTAzNTAwMA==#wechat_redirect';

        })

    });

</script>

</body>

</html>