|
| 1 | +# JSSDK |
| 2 | + |
| 3 | +JSSDK 用于提供微信内置浏览器接口的能力,例如转发控制、调用摄像头权限(拍照、视频)、文件上传、关闭窗口、唤起扫码窗口,等等。 |
| 4 | + |
| 5 | +要在内置浏览器中只用 JSSDK,分为“服务端获取签名信息”和“网页端配置 JSSDK”两步。 |
| 6 | + |
| 7 | +## 服务端获取签名信息 |
| 8 | + |
| 9 | +后端通过 `JSSDKHelper.GetJsSdkUiPackageAsync()` 方法即可自动获取前端所需的所有 JSSDK 运行所需参数: |
| 10 | + |
| 11 | +```cs |
| 12 | +public async Task Index() |
| 13 | +{ |
| 14 | + var jssdkUiPackage = await JSSDKHelper.GetJsSdkUiPackageAsync(appId, appSecret, Request.AbsoluteUri()); |
| 15 | + return View(jssdkUiPackage); |
| 16 | +} |
| 17 | +``` |
| 18 | + |
| 19 | +> 本项目参考文件: |
| 20 | +> |
| 21 | +> /Controllers/**_WeixiJSSDKnController.cs_** |
| 22 | +
|
| 23 | +## 网页端配置 JSSDK |
| 24 | + |
| 25 | +后端配置完成的参数,直接在前端 JS 中使用 `wx.config` 进行设置,例如以下代码将完成在转发网页时自定义转发消息的标题和图片: |
| 26 | + |
| 27 | +```js |
| 28 | +wx.config({ |
| 29 | + debug: false, // 开启调试模式 |
| 30 | + appId: "@Model.AppId", // 必填,公众号的唯一标识 |
| 31 | + timestamp: "@Model.Timestamp", // 必填,生成签名的时间戳 |
| 32 | + nonceStr: "@Model.NonceStr", // 必填,生成签名的随机串 |
| 33 | + signature: "@Model.Signature", // 必填,签名 |
| 34 | + jsApiList: ["checkJsApi", "onMenuShareTimeline", "onMenuShareAppMessage"], |
| 35 | +}); |
| 36 | + |
| 37 | +wx.error(function (res) { |
| 38 | + console.log(res); |
| 39 | + alert("验证失败"); |
| 40 | +}); |
| 41 | + |
| 42 | +wx.ready(function () { |
| 43 | + var url = "https://sdk.weixin.senparc.com"; |
| 44 | + var link = url + ""; |
| 45 | + var imgUrl = url + "/images/v2/ewm_01.png"; |
| 46 | + |
| 47 | + //转发到朋友圈 |
| 48 | + wx.onMenuShareTimeline({ |
| 49 | + title: "JSSDK朋友圈转发测试", |
| 50 | + link: link, |
| 51 | + imgUrl: imgUrl, |
| 52 | + success: function () { |
| 53 | + alert("转发成功!"); |
| 54 | + }, |
| 55 | + cancel: function () { |
| 56 | + alert("转发失败!"); |
| 57 | + }, |
| 58 | + }); |
| 59 | + //转发给朋友 |
| 60 | + wx.onMenuShareAppMessage({ |
| 61 | + title: "JSSDK朋友圈转发测试", |
| 62 | + desc: "转发给朋友", |
| 63 | + link: link, |
| 64 | + imgUrl: imgUrl, |
| 65 | + type: "link", |
| 66 | + dataUrl: "", |
| 67 | + success: function () { |
| 68 | + alert("转发成功!"); |
| 69 | + }, |
| 70 | + cancel: function () { |
| 71 | + alert("转发失败!"); |
| 72 | + }, |
| 73 | + }); |
| 74 | +}); |
| 75 | +``` |
| 76 | + |
| 77 | +> 提示:在 MVC 中传递 ViewModel 需要在 .cshtml 文件顶部定义: |
| 78 | +> |
| 79 | +> ```cs |
| 80 | +> @model Senparc.Weixin.MP.Helpers.JsSdkUiPackage |
| 81 | +> ``` |
| 82 | +
|
| 83 | +> 本项目参考文件: |
| 84 | +> |
| 85 | +> /Views/WeixinJSSDK/**_Index.cshtml_** |
| 86 | +
|
| 87 | +更多设置详情请参考:[JS-SDK 说明文档](https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html)。 |
0 commit comments