微信支付

微信浏览器支付

//微信支付首先需要微信授权，这里是在登录之后做的授权具体如下：

var path = "http://lyl.sinopr.org/h5/index.html#/home"
    this.getOpenIdApi(path,res.data.message);
    
	async getOpenIdApi(path,state){//获取code  
	      path = "http://lyl.sinopr.org/h5/index.html#/home";
	      let urlNow=encodeURIComponent(path);
	      let scope='snsapi_userinfo';    //snsapi_userinfo  snsapi_base   //静默授权 用户无感知
	      let appid='wx9f6ae5f650b43bf1';
	      let url=`http://open.weixin.qq.com/connect/oauth2/authorize?appid=${appid}&redirect_uri=${urlNow}&response_type=code&scope=${scope}&state=${state}#wechat_redirect`;
	      location.href = url;
	        
    },

// 调用页面

	async getOpenIdApi(path,state){//获取code  
	      path = "http://lyl.sinopr.org/h5/index.html#/home";
	      let urlNow=encodeURIComponent(path);
	      let scope='snsapi_userinfo';    //snsapi_userinfo 用户需要手动点击确认授权     //  snsapi_base  静默授权 用户无感知
	      let appid='wx......bf1';
	      let url=`http://open.weixin.qq.com/connect/oauth2/authorize?appid=${appid}&redirect_uri=${urlNow}&response_type=code&scope=${scope}&state=${state}#wechat_redirect`;
	      location.href = url;
    
     },
//  需要支付的页面调用	
created(){
		var ua = window.navigator.userAgent.toLowerCase();
	        if(ua.match(/MicroMessenger/i) == 'micromessenger'){
	        	// 如果是微信浏览器需要先加载微信内置配置
	            wx.config({
	                debug:false,
	                appId:'wx9......3bf1',  // 后台返回或直接写死
	                jsApiList:["chooseWXPay"]
	            });
	        }
	}

var ua = window.navigator.userAgent.toLowerCase();
// 	判断浏览器内核
var ip = returnCitySN["cip"];
if(ua.match(/MicroMessenger/i) == 'micromessenger'){
	const msg = await this.$http.get("/mall/orderJsPayPrice/payJsapi", {
       params: {
             orderMasterId:this.masterId,
             payType : 1,
             payCode:1,
             ip:ip
         }
     });
     if(msg.data.status != 'success'){
         console.log("预支付失败");
         return;
     }
	// 是否是微信内置浏览器   
	// 微信浏览器需要获取后台返回微信支付的必要参数
	// 如果是微信浏览器执行以下代码

	wx.chooseWXPay({
		timestamp: messagemap.timeStamp, // 支付签名时间戳，注意微信jssdk中的所有使用timestamp字段均为小写。但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符
		
		nonceStr: messagemap.nonceStr, // 支付签名随机串，不长于 32 位
		
		package: messagemap.package, // 统一支付接口返回的   prepay_id参数值，提交格式如：prepay_id=***）
		
		signType: messagemap.signType, // 签名方式，默认为'SHA1'，使用新版支付需传入'MD5'
		
		paySign: messagemap.paySign, // 支付签名
		
		success: function(res) {
		  this.$router.push({path: '/order'});
		},
		fail: function(){  //失败
		  alert("用户失败");
		},
	
	});
}else{
	// 否则
	// 请求后台地址，返回支付宝支付链接，由于项目没有用到支付宝，所以暂时先不写
}

// 注意一点
//判断内核是否为微信，可以封装在main.js里面

Vue.prototype.$isWx = function() {
  var ua = window.navigator.userAgent.toLowerCase();
  return ua.match(/MicroMessenger/i) == 'micromessenger';
}

// 使用时在页面直接调用即可

alert(this.$isWx());

// vue获取本机ip地址

components: {  
    'remote-js': {
        render(createElement) {
            return createElement('script', { attrs: { type: 'text/javascript', src: this.src }});
        },
        props: {
            src: { type: String, required: true },
        },
    },
},
// 页面引用 
<remote-js src="https://pv.sohu.com/cityjson?ie=utf-8" ></remote-js>
// 直接获取
var ip = returnCitySN["cip"];