一个项目需要在微信里获得当前位置,于是就开始了我的微信开发之旅...

微信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}&timestamp={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入门的更多相关文章

  1. 续关于C#的微信开发的入门记录一

    前几天写了一篇博客<关于C#的微信开发的入门记录一>,原文地址:http://www.cnblogs.com/zhankui/p/4515905.html,现在继续完善: 目前很多小伙伴都 ...

  2. 微信开发----JS-SDK接口

    2018.03.15:GitHub下载代码 208.3.6:更新:我们不再使用JosnHelp返回字典类或者强类型,而是直接返回动态类型,这样就会方便的多. JsonHelp更新详情:微信开发---- ...

  3. 关于C#的微信开发的入门记录一

    在之前老是看到一些微信开发的例子,但是作为初学者会有很多问题,之前我也找了很多帖子,但是最终也没能解决,现在刚好手里有一个项目,总结一下分享给准备做却动不了手的朋友们,本文只是以我个人的经验作为浅谈( ...

  4. 微信开发-Jssdk调用分享实例

    using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.IO ...

  5. 前端工作日常爬坑之——单页面微信开发Jssdk相关,以及jssdk图片直传自己服务器的实现。

    日常爬坑 遇到的情况大致说明: 项目基于Vue2全家桶实现,vue-router控制前端路由,路由模式是History(主要是领导追求太高,觉得hash带#号太丑,然后遇到了小坑...),主要是服务于 ...

  6. 关于C#的微信开发的入门记录二

    在准备了空间和域名之后,现在来讲讲我们接下来的编码过程: 今天就先到这里了!没有服务器那些的请看我之前的博客:http://www.cnblogs.com/zhankui/p/4515905.html ...

  7. 转:微信开发获取地理位置实例(java,非常详细,附工程源码)

    微信开发获取地理位置实例(java,非常详细,附工程源码)   在本篇博客之前,博主已经写了4篇关于微信相关文章,其中三篇是本文基础: 1.微信开发之入门教程,该文章详细讲解了企业号体验号免费申请与一 ...

  8. 微信开发获取地理位置实例(java,非常详细,附工程源码)

    在本篇博客之前,博主已经写了4篇关于微信相关文章,其中三篇是本文基础: 1.微信开发之入门教程,该文章详细讲解了企业号体验号免费申请与一些必要的配置,以及如何调用微信接口. 2.微信开发之通过代理调试 ...

  9. C#微信开发-微信JS-SDK(1)之通过config接口注入权限验证配置

    官方文档是微信JS-SDK的使用步骤http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html#JSSDK.E4.BD.B ...

随机推荐

  1. js中的console很强大

    今天闲来没事,瞎逛, 发现了淘宝首页的这个: 想起来之前在百度的 页面中也曾看到过.于是乎自己试一试. 于是便见识到了console对象其实很强大,用好它对调试真的有很大帮助. 代码: <!DO ...

  2. [php入门] 5、初学CSS从中记下的一些基础点(For小白)

    CSS是层叠式样式表,主要用来控制页面的样式. 一.CSS概述 应用CSS: 1.外部样式表,CSS写在一个单独的.CSS文件中,在head里加<link rel="styleshee ...

  3. WaterfallTree(瀑布树) 详细技术分析系列

    前言 WaterfallTree(瀑布树) 是最强纯C#开源NoSQL和虚拟文件系统-STSdb专有的(版权所有/专利)算法/存储结构. 参考 关于STSdb,我之前写过几篇文章,譬如: STSdb, ...

  4. 我的第一个Linux C 程序

    说明:上篇博客把gcc安装了,接着我们就尝试一下她的厉害吧. 我用的是vi的超级版本vim.这条指令,也就是用vim打开这个文件,如果文件不存在的话,那么创建这个文件. 关于Linux文件的创建,也可 ...

  5. jQuery的选择器中的通配符[id^='code']

    1.选择器 (1)通配符: $("input[id^='code']");//id属性以code开始的所有input标签 $("input[id$='code']&quo ...

  6. Laravel5.0学习--02 实例进阶

    本文以laravel5.0.22为例. 本节以新建一个简单的博客作为实例. 准备工作 数据库配置 .env文件(也可以直接修改config/database.php) DB_HOST=localhos ...

  7. Atitit prj 项目管理与行政管理(1)------项目环境的概览与建立

    Atitit prj 项目管理与行政管理(1)------项目环境的概览与建立 1. 环境的4大特点 (1)多样性与复杂性. (2)差异性.(3)变异性.(4)关联性.2 2. 环境的分类,最常用使用 ...

  8. Atitit.java图片图像处理attilax总结  BufferedImage extends java.awt.Image获取图像像素点image.getRGB(i, lineIndex); 图片剪辑/AtiPlatf_cms/src/com/attilax/img/imgx.javacutImage图片处理titit 判断判断一张图片是否包含另一张小图片 atitit 图片去噪算法的原理与

    Atitit.java图片图像处理attilax总结 BufferedImage extends java.awt.Image 获取图像像素点 image.getRGB(i, lineIndex); ...

  9. 【管理心得之四十】中文“其他”、英文“other”、日文“その他”..........................................

    场景再现====================={某研讨会}本学期为:调查研究.整理总结阶段.本阶段的主要任务是: 一.学习理论,收集.汇编学习资料,提高自己的素质..... 二.通过对部分班级学生 ...

  10. WPF仿Win7便笺

    最近用WPF写了个仿WIN7下面的便笺小工具,还算是比较华丽的,相似度99%以上吧,在集成了便笺原有的功能以外,当然也做了略微的修改,比如加了关于作者版本信息和修改了原有删除便笺的系统弹出框.软件开机 ...