`
chenfeng_lian
  • 浏览: 10396 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

微信内部浏览器分享支付功能

 
阅读更多
1、注册一个微信公众账号 地址:https://mp.weixin.qq.com/cgi-bin/loginpage?t=wxm2-login&lang=zh_CN
2、进入开发者中心,点击接口测试申请系统。在改页面添加:JS接口安全域名,测试地址跨域是ip,如果有端口号要带上端口号。
3、获取签名(关键)。这一步必须要和后台交互。
    a、获取签名时前端要和后台进行一次交互,需要传一个参数url,这个参数是动态获取的当前页面的url出去#好和#号后面的部分。
    b、后台在第二步的开发者中心拿到:AppId和AppSecret,然后根据前台传过去的url计算签名。详细文档:http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html,附录1-JS-SDK使用权限签名算法。
    c、后台返回的数据格式JSON,字段包括:noncestr,jsapi_ticket,timestamp,url
4、拿到3-c中的数据配置微信分享。
var shareMsg = {
        title: '这里是TITLE',
        desc: '在长大的过程中,我才慢慢发现,我身边的所有事,别人跟我说的所有事,那些所谓本来如此,注定如此的事,它们其实没有非得如此,事情是可以改变的。更重要的是,有些事既然错了,那就该做出改变。',
        link: 'http://movie.douban.com/subject/25785114/',
        imgUrl: 'http://demo.open.weixin.qq.com/jssdk/images/p2166127561.jpg',
        trigger: function (res) {
            alert('用户点击发送给朋友');
        },
        success: function (res) {
            alert('已分享');
        },
        cancel: function (res) {
            alert('已取消');
        },
        fail: function (res) {
            alert(JSON.stringify(res));
        }
    };
//xxxxx 后台返回的数据
wx.config({
            debug: true,
            appId: 'xxxxx',
            timestamp: xxxxx,
            nonceStr: xxxxx,
            signature: xxxxx,
            jsApiList: [
                'checkJsApi',
                'onMenuShareTimeline',
                'onMenuShareAppMessage',
                'onMenuShareQQ',
                'onMenuShareWeibo'
            ]
        });
wx.ready(function() {
            wx.checkJsApi({
                jsApiList: ['onMenuShareAppMessage'],
                success: function (res) {
                    alert('checkJsApi success: ' + JSON.stringify(res));
                },
                fail: function(res) {
                    alert('checkJsApi error: ' + JSON.stringify(res));
                }
            });
            //分享到朋友圈
            wx.onMenuShareTimeline(shareMsg);
            //分享给朋友
            wx.onMenuShareAppMessage(shareMsg);
            //分享给QQ好友
            wx.onMenuShareQQ(shareMsg);
            //分享到微博
            wx.onMenuShareWeibo(shareMsg);
        });
5、如果是开发者测试账号,要关注改测试账号才能测试。
6、如果是线上的 需要在公众账号设置,功能设置里面添加JS接口安全域名非ip。
7、关于支付目录的配置:单页面应用
    a:IPhone 例如支付最终进入页面的路由为 /ab/cd/pay,但是入口路由为 /ab/cd 支付目录只需要配置收到/ab/
    b:Android 接 a 部分,Android手机的配置目录就必须配置到 /ab/cd/

 

分享到:
评论

相关推荐

    微信浏览器调用支付宝浏览器中打开

    博文中资源

    H5外部浏览器直接调起微信手机网站调用微信分享

    H5外部浏览器直接调起微信 tml5手机网站调用微信分享,其中示例包括 1. 获取网络类型 2. 调起客户端的图片播放组件 3. 调用微信扫描二维码 4. 判断是否安装对应的应用 5. 发送邮件 6. 分享到微信朋友圈

    微信支付如何实现内置浏览器的H5页面支付

    因为项目需要,要在H5页面中加入微信支付,所以便去尝试,只想说真的很坑,尤其调试起来不方便 这是微信的官方API文档 微信API 微信支付的准备工作 申请公众号,申请开通支付,这个很简单,自行百度 申请好之后 在...

    微信遮罩层解决微信浏览器不能用支付宝问题

    在移动互联网领域,微信与支付宝是两大支付巨头,但有时在微信内部的网页环境中,由于微信的限制,可能无法直接唤起支付宝进行支付。针对这个问题,开发者们采取了一种巧妙的解决方案,即通过创建“遮罩层”来引导...

    微信遮罩层 在微信中打开后会提示用本地浏览器

    3. **使用微信JS-SDK**:微信提供了JS-SDK,它可以让你访问一些微信特有的功能,如分享、支付等。同时,部分API可以帮助优化在微信内部的显示效果。 4. **服务端检测**:在服务器端识别请求来自微信内置浏览器,...

    微信跳转 微信遮罩层.zip

    在微信生态系统内,由于安全和用户体验的考虑,通常不允许直接在微信内部打开外部链接,而是通过一种叫做“微信跳转”的方式,引导用户从微信环境转到外部浏览器,如Safari或Chrome,以便完整浏览网页内容。...

    微信在其他浏览器打开遮罩

    微信支付通常要求在微信内部完成,因为这样可以确保支付过程的安全性,避免在其他浏览器中可能存在的安全隐患。 微信的这种策略也对开发者提出了挑战,他们需要考虑如何在不违背微信规则的情况下,为用户提供顺畅的...

    iOS 原生加载微信支付链接跳转支付宝方法封装

    为了提供用户友好的体验,开发者有时需要在应用内部实现从微信支付链接无缝跳转到支付宝支付的过程。本篇文章将详细讲解如何在iOS原生环境中封装这个功能,特别是在使用WKWebView时可能会遇到的问题和解决方案。 1....

    微信扫描二维码提示在浏览器中打开

    比如,某些网页可能需要JavaScript、Flash或者其他Web插件支持,这些在微信内部浏览器中可能不被允许或不完全支持。此外,出于安全考虑,微信可能会限制在内部浏览器中打开某些链接,以防恶意网站或钓鱼攻击。 接...

    java微信支付demo

    java版微信支付demo,包含原生支付、jsapi支付、app支付参数生成规则。调用微信内部浏览器。

    vue项目前端微信JSAPI与外部H5支付相关实现过程及常见问题

    JSAPI使用场景为微信内部,而H5支付则是使用在非微信下的外部浏览器。 1.JSAPI 在微信内部可以直接唤起微信浏览器的内置对象 WeixinJSBridge 废话不多说直接上代码: // 调用后端接口拿到JSAPI支付所需参数,我在...

    web页在微信中访问增加遮罩层 右上角弹出在浏览器中打开

    微信内嵌了一个基于WebKit的浏览器引擎,名为Webview,用于在微信内部展示网页内容。虽然方便,但Webview相比独立的浏览器可能有一些功能上的限制,比如JavaScript执行效率、API支持、安全性设置等。这可能会导致...

    Java整合微信支付支付宝支付|best-pay-demo-master.zip

    4. App支付:对于移动应用,你可以调用微信支付的App支付接口,将预支付ID封装在App内部,引导用户在微信客户端完成支付。 5. 异步通知与同步验证:微信支付完成后,会向你设定的回调URL发送异步通知。你需要验证...

    javascript 判断是否是微信浏览器的方法

    `WeixinJSBridge`是微信提供的一套JavaScript接口,用于在微信内置浏览器中调用微信功能,如分享、支付等。如果页面能够访问到这个对象,那么几乎可以肯定用户是在微信内部浏览。但这种方式需要在实际运行环境中才能...

    支付宝 微信 手机网页 app支付

    其App内有“微信钱包”功能,涵盖了购物、餐饮、出行等各类生活场景的支付需求。微信支付还推出了小程序,使得商家可以无缝接入支付系统,提高用户体验。 手机网页支付是指用户在手机浏览器中进行的在线交易,通常...

    小程序微信支付.txt

    基于vue的小程序,微信内部浏览器支付以及外部浏览器微信支付。两种方法的实现以及H5还是小程序的判断支付方式

    微信支付工具包

    Native支付是微信为移动应用设计的支付接口,它使得用户在应用内部可以直接启动微信支付流程,无需跳转到微信客户端完成支付。这个过程通常包括以下步骤: - 商户服务器生成订单信息,包括商品详情、金额等,并发...

    DZ3.2PC支付宝+PC微信扫码+手机支付宝+微信内支付免签约充值插件

    此插件还支持在微信内置浏览器中的支付功能,这意味着用户在分享链接或者通过微信访问网站时,可以直接在微信内部完成购买,简化了用户操作步骤,提高了转化率。 6. 免签约功能: 这款插件的一大亮点是免签约功能...

    微信H5 PC支付SDK

    SDK会生成适用于PC端的支付二维码,用户通过微信客户端扫描后,同样会在微信内部完成支付流程。 退款接口是微信支付系统中的一个重要组成部分,它允许商家在必要时对已完成的交易进行退款操作。开发者使用此SDK可以...

    java微信支付(H5、小程序)实例和SDK

    开发者需要先通过SDK的统一下单接口生成预支付交易单,然后将生成的预支付交易单的参数通过JavaScript传递给前端,前端展示一个二维码或者直接发起支付请求,用户在微信内置浏览器中完成支付。 4. **小程序支付**:...

Global site tag (gtag.js) - Google Analytics