微信开发jssdk入门
一个项目需要在微信里获得当前位置,于是就开始了我的微信开发之旅...
微信JSSDK说明文档
http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html
JSSDK使用步骤
步骤一:绑定域名
绑定域名要求是一级域名.但是使用的时候可以二级域名下的网页仍然可以使用该接口.
步骤二:引入JS文件
http://res.wx.qq.com/open/js/jweixin-1.0.0.js
如果你的页面启用了https,务必引入 https://res.wx.qq.com/open/js/jweixin-1.0.0.js
步骤三:通过config接口注入权限验证配置
配置这个会比较麻烦,最后讲.
wx.config({
debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
appId: '', // 必填,公众号的唯一标识
timestamp: , // 必填,生成签名的时间戳
nonceStr: '', // 必填,生成签名的随机串
signature: '',// 必填,签名,见附录1
jsApiList: [] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2
});
步骤四:通过ready接口处理成功验证
wx.ready(function(){
// config信息验证后会执行ready方法,所有接口调用都必须在config接口获得结果之后,config是一个客户端的异步操作,所以如果需要在页面加载时就调用相关接口,则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口,则可以直接调用,不需要放在ready函数中。
});
步骤五:通过error接口处理失败验证
wx.error(function(res){
// config信息验证失败会执行error函数,如签名过期导致验证失败,具体错误信息可以打开config的debug模式查看,也可以在返回的res参数中查看,对于SPA可以在这里更新签名。
});
例如:获取地理位置接口
wx.ready(function(){
wx.getLocation({
type: 'wgs84', // 默认为wgs84的gps坐标,如果要返回直接给openLocation用的火星坐标,可传入'gcj02'
success: function (res) {
var latitude = res.latitude; // 纬度,浮点数,范围为90 ~ -90
var longitude = res.longitude; // 经度,浮点数,范围为180 ~ -180。
var speed = res.speed; // 速度,以米/每秒计
var accuracy = res.accuracy; // 位置精度
}
});
});
具体的还是看官方文档清楚些.
关于步骤三的Config说明:
var wxConfigJson = {
debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
appId: 'wx821bb7356e99a3a7', // 必填,公众号的唯一标识
timestamp: 1446184841, // 必填,生成签名的时间戳
nonceStr: '80262bec-7cd2-4b03-b366-97fab6e91cdd', // 必填,生成签名的随机串
signature: 'fd017d631d63cef32d5f25ea276911bcb0a29782', // 必填,签名,见附录1
jsApiList: ['getLocation'] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2
};
@Html.Raw(new WeChatJS_SDK_Config().GetConfig()) 生成上面的wxConfigJson
下面是我写的WeChatJS_SDK_Config类,见笑了.
public class WeChatJS_SDK_Config
{
private string _appId;
private int _timestamp ;// 必填,生成签名的时间戳
private string _nonceStr ;// 必填,生成签名的随机串
private string _url;
private string _sign; public WeChatJS_SDK_Config()
{
_appId = AccountConfig._appID;
_timestamp = Core.GetTimestamp();
_nonceStr = Guid.NewGuid().ToString();
_url = HttpContext.Current.Request.Url.ToString();
_sign =
String.Format("jsapi_ticket={0}&noncestr={1}×tamp={2}&url={3}", Jsapi_Ticket.GetJsapi_Ticket(),
_nonceStr, _timestamp, _url).Md5Entry("sha1").ToLower();
} /* Url方法的区别
*@Html.Raw("var originalString='"+HttpContext.Current.Request.Url.OriginalString+"';")
@Html.Raw("var rawUrl='"+HttpContext.Current.Request.RawUrl+"';")
@Html.Raw("var url='"+HttpContext.Current.Request.Url+"';") var originalString = 'http://xb.hnjdkj.cn:80/index/home';
var rawUrl = '/index/home';
var url = 'http://xb.hnjdkj.cn/index/home';*@
*/
public string GetConfig()
{
var res = string.Format(
"var wxConfigJson = {{debug: {0}, appId: '{1}', timestamp: {2},nonceStr: '{3}',signature: '{4}',jsApiList: ['getLocation'] }};", Kits.AppSettings("WeChatDebug"), _appId, _timestamp, _nonceStr, _sign);
return res;
} }
微信开发jssdk入门的更多相关文章
- 续关于C#的微信开发的入门记录一
前几天写了一篇博客<关于C#的微信开发的入门记录一>,原文地址:http://www.cnblogs.com/zhankui/p/4515905.html,现在继续完善: 目前很多小伙伴都 ...
- 微信开发----JS-SDK接口
2018.03.15:GitHub下载代码 208.3.6:更新:我们不再使用JosnHelp返回字典类或者强类型,而是直接返回动态类型,这样就会方便的多. JsonHelp更新详情:微信开发---- ...
- 关于C#的微信开发的入门记录一
在之前老是看到一些微信开发的例子,但是作为初学者会有很多问题,之前我也找了很多帖子,但是最终也没能解决,现在刚好手里有一个项目,总结一下分享给准备做却动不了手的朋友们,本文只是以我个人的经验作为浅谈( ...
- 微信开发-Jssdk调用分享实例
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.IO ...
- 前端工作日常爬坑之——单页面微信开发Jssdk相关,以及jssdk图片直传自己服务器的实现。
日常爬坑 遇到的情况大致说明: 项目基于Vue2全家桶实现,vue-router控制前端路由,路由模式是History(主要是领导追求太高,觉得hash带#号太丑,然后遇到了小坑...),主要是服务于 ...
- 关于C#的微信开发的入门记录二
在准备了空间和域名之后,现在来讲讲我们接下来的编码过程: 今天就先到这里了!没有服务器那些的请看我之前的博客:http://www.cnblogs.com/zhankui/p/4515905.html ...
- 转:微信开发获取地理位置实例(java,非常详细,附工程源码)
微信开发获取地理位置实例(java,非常详细,附工程源码) 在本篇博客之前,博主已经写了4篇关于微信相关文章,其中三篇是本文基础: 1.微信开发之入门教程,该文章详细讲解了企业号体验号免费申请与一 ...
- 微信开发获取地理位置实例(java,非常详细,附工程源码)
在本篇博客之前,博主已经写了4篇关于微信相关文章,其中三篇是本文基础: 1.微信开发之入门教程,该文章详细讲解了企业号体验号免费申请与一些必要的配置,以及如何调用微信接口. 2.微信开发之通过代理调试 ...
- C#微信开发-微信JS-SDK(1)之通过config接口注入权限验证配置
官方文档是微信JS-SDK的使用步骤http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html#JSSDK.E4.BD.B ...
随机推荐
- 【WEB】Tomcat基础使用知识
由于当前项目性质原因,从开始到现在使用的WEB服务器都是WAS,而Tomcat的基础知识也慢慢地被遗忘.由于种种原因,让我参与到了另外一个全新的项目,使用的是Tomcat6.X,所以复习是必须的,而写 ...
- TypeScript - Classes
简介 JavaScript语言基于函数和原型链继承机制的方式构建可重用的组件.这对于OO方面编程来说显得比较笨拙.在下一代的JavaScript标准ECMAScript 6为我们提供了基于class ...
- 免费打造自己的个人网站,免费域名、免费空间、FTP、数据库什么的,一个不能少,没钱,也可以这么任性
作为一名程序猿,拥有自己的个人网站,是一件多么有逼格的事~~至于个人网站的好处嘛?那是多的说都说不完啊~~例如我们可以放自己的作品,展示自己的风采,放自己女神的照片(女神看到后会怎么样,自己想吧,哈哈 ...
- 缓存篇~第七回 Redis实现基于方法签名的数据集缓存(可控更新,分布式数据缓存)
返回目录 本篇文章可以说是第六回 Microsoft.Practices.EnterpriseLibrary.Caching实现基于方法签名的数据集缓存(可控更新,WEB端数据缓存)的续篇,事实上,有 ...
- 大叔也说Xamarin~Android篇~原生登陆与WebView的网站如何共享Session
回到目录 事情是这样的,我们最近开了一个APP,主要使用xamarin做了一个登陆,它与服务器API进行数据通讯,当用户名密码正确去,跳转到新的activity,并在webview控件中打开服务端的H ...
- Atitit 发帖机实现(1)-----UsrQBm2008 页面上下文规范
Atitit 发帖机实现(1)-----UsrQBm2008 页面上下文规范 1.1. 网站绝对路径,页面绝对路径1 1.2. Java的javax.servlet.ServletContext1 ...
- js 优化
一.for循环的优化 <!doctype html> <html lang="en"> <head> <meta charset=&quo ...
- DOM_03之元素及常用对象
1.修改样式:访问内联样式:elem.style.css属性名:获得其他:var style=getComputerStyle(elem):*(* 获得焦点onfocus:失去焦点onblur:): ...
- 移动端BUG汇总
position:fixed问题 固定定位到底部会把最后一个元素盖住 你会发现最后一个字被盖住了,并且还滚动不下去. 解决方法: 给后一个元素添加一个高度,或者给body加margin-bottom ...
- CSS3的学习--实现瀑布流
基于CSS3实现瀑布流,使用CSS3的CSS 多栏(Multi-column). 可以到github上下载源码 : https://github.com/CraryPrimitiveMan/water ...