本地测试微信授权登录

本地测试微信授权登录，首先要下载一个微信开发者工具，因为微信回调域名不支持IP地址，所以我们要获取到一个域名，映射到本地ip，目前我尝试成功的有两种方法：

1，使用natapp：

注册一个natapp账号，购买一个免费隧道，具体可参考教程NATAPP1分钟快速新手图文教程
下载客户端，下载完成后，新建一个config.ini文件，具体配置参考使用本地配置文件config.ini
配置隧道，修改本机地地址为项目运行的ip地址，修改端口号等
最后，运行成功后，就可以获得一个代理服务器的地址

得到一个可用的域名之后（可先在浏览器打开看是否成功）
申请一个接口测试号，微信公众平台接口测试帐号申请
把测试账号的网页授权域名修改为得到的域名，就可以用这个域名在微信开发者工具打开，开始测试啦

2，修改本地hosts：

首先在本地ip运行一个项目

这里显示的是window的路径，打开hosts文件,添加映射: 本地ip->测试域名

得到一个可用的域名之后（可先在浏览器打开看是否成功）

申请一个接口测试号，微信公众平台接口测试帐号申请

把测试账号的网页授权域名修改为得到的域名，就可以用这个域名在微信开发者工具打开，开始测试啦

点击微信授权按钮，提示没有关注就去关注一下

再次点击授权按钮，这里可以看到已经成功获取到code啦，顺便把测试的vue代码贴出来参考一下。

<template><div class="page"><button @click="getWxAuth">微信授权</button>{{ code }}</div>
</template><script lang="ts">
import Vue from 'vue'
import Component from 'vue-class-component'
import Utils from '@/common/utils/utils'@Component({})
export default class WxComponent extends Vue {code = ''getWxAuth() {// 回调链接const redirectURL =window.location.origin + window.location.pathname + '#/wx-test'const appId = 'wx82b9adeb92815aea'const url ='https://open.weixin.qq.com/connect/oauth2/authorize?appid=' +appId +'&redirect_uri=' +encodeURIComponent(redirectURL) +'&response_type=code&scope=snsapi_base&state=STATE#wechat_redirect'window.location.href = url}created() {const code = Utils.getQueryString(window.location.href, 'code')console.log(code, 'wxcode')if (code) {this.code = code}}
}
</script>

这个ip映射的域名可以直接改成正式项目的域名，把这个域名配置到正式公众号，使用正式的appid，无缝对接上线
这种映射的方法只能在微信开发者工具测试哦

注意：本地的端口号要用80的，微信不支持别的端口

本地测试微信授权登录相关推荐

微信小程序微信授权登录，使用getPhoneNumber()部分手机无法获取动态令牌code（Taro）
今天在测试微信授权登录时,部分微信使用getPhoneNumber()方法无法获取动态令牌code, 查询微信小程序文档提示: 可以使用组件的方式获取兑换用户手机号的动态令牌. 使用方法: 需要将 b ...
微信授权登录mock（在没有真实微信账号的情况下测试大量微信账户授权登录的情况）...
场景介绍对于构建在微信公众号的系统,帐号体系往往使用微信授权登录(如各类微信商城应用系统). 这样操作不仅可以实现静默注册,对用户几乎是无感的,同时也达到了区分用户,获取用户基本信息(头像,昵称等) ...
微信授权登录(微信订阅号使用测试账号)
1.微信授权登录: 微信公众号测试登录: 准备: 1.1 花生壳! 下载地址:http://hsk.oray.com/download/ 1.2 微信公众号:https://mp.weixin.qq. ...
微信授权登录后，把获取的信息存储到本地数据库中（超详细有用）！
微信授权登录后,把获取的信息存储到本地数据库中(超详细有用)!下面一起来看看吧! <?php namespace Home\Controller; use Think\Controller; c ...
SpringBoot2.0（九）：实现微信授权登录并且获取用户信息
第一步:配置域名由于我是本地测试,需要一个域名映射工具,改工具使用非常简单,如果自己有域名可以使用自己的域名(自己的域名必须备案)如果没有可以在第一个输入框里面输入自己的域名前缀!微信授权登录端口必 ...
Vue 移动端 hash模式下微信授权登录
需求分析: 1.移动端微信公众号项目,需要获取微信授权进行登录 2.默认打开首页,在路由进入之前进行判断,有如下三种情况 3.本项目有两种账号类型:商家.企业,需在登录页进行选择未授权过,跳到微信授 ...
硅谷课堂 12_公众号消息和微信授权登录
硅谷课堂第十二天-公众号消息和微信授权登录文章目录硅谷课堂第十二天-公众号消息和微信授权登录一.公众号普通消息 1.实现目标 2.消息接入 2.1.公众号服务器配置 2.2.验证来自微信服务器消 ...
node.js实现微信授权登录，最详细最简单小白教程。。
使用到的中间件,如已安装请忽略 npm install express -g npm install request --save 首先想要微信授权,必须注册的有公众号,进入微信公众号平台-开发-开发 ...
慕课网_《微信授权登录》学习总结
时间:2017年08月12日星期六说明:本文部分内容均来自慕课网.@慕课网:http://www.imooc.com 教学源码:无学习源码:https://github.com/zccodere/ ...
code换取微信openid_微信授权登录开发的两种方式
本文主要针对微信公众号(公众平台的开发) 首先理解一个概念:OAuth: OAuth(开放授权)是一个开放标准,允许用户让第三方应用访问该用户在某一网站上存储的私密的资源(如照片,视频,联系人列表), ...

本地测试微信授权登录

1，使用natapp：

2，修改本地hosts：

本地测试微信授权登录相关推荐

最新文章

热门文章