前端公众号授权

公众号设置

0、首先用IIS创建一个空目录的网站用于公众号域名验证,接着把该网站内网穿透出去,推荐用utools工具,官网:https://u.tools/ 下载安装好后搜索内网穿透并做好配置



1、进入公众号管理后台:开发-基本配置,把公众号开发信息里对的AppSecret、IP白名单设置好(记得保存好AppSecret因为配置好后会不可见)

2、进入公众号后台菜单:开发-接口权限-网页授权-网页授权获取用户基本信息-修改,配置好业务域名、JS接口安全域名、网页授权域名(配置域名填写域名目录的话,只有该目录下生效,并不是该域名所有目录生效,例如:配置www.qq.com/wx,那么www.qq.com和www.qq.com/qq都不会生效)

公众号授权

看了官方的文档,我们都知道,公众号授权有两种方式,一种是静默授权,用户无感知,但无法获取用户的基础信息,如果要想拉取到用户信息,则需要使用另一种授权方式,由于这种方式涉及到隐私,所以需要用户同意才行。

// 新建util.js
export default {
wxAuthorize() {
let link = window.location.href;
let params = this.getUrlParams(link); // 地址解析
// 已经授权登录过的就不用再授权了
//if (store.state.token) return; // 如果拿到code,调用授权接口,没有拿到就跳转微信授权链接获取
if (params.code) {
// 调用后台接口,授权
} else {
let appid = '公众号的appid';
let uri = encodeURIComponent(link);
let authURL = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${appid}&redirect_uri=${uri}&response_type=code&scope=snsapi_userinfo&state=123#wechat_redirect`;
window.location.href = authURL;
}
}, getUrlParams(name) {
var params = {};
location.search.replace(/[?&]+([^=&]+)=([^&]*)/gi, function (str, key, value) {
params[key] = value;
}); return params[name] || params;
}
}
// 在main.js引入util.js
import util from "./util/util.js"
Vue.prototype.util = util
// 在App.vue中的启动方法中开启授权,打开任意页面都会获得授权
onLaunch: function() {
console.log('App Launch');
this.util.wxAuthorize();
}

基于.net5 wtm框架、uni-app微信公众号开发一、公众号授权的更多相关文章

  1. 微信公众平台开发-OAuth2.0网页授权(含源码)

    微信公众平台开发-OAuth2.0网页授权接口.网页授权接口详解(含源码)作者: 孟祥磊-<微信公众平台开发实例教程> 在微信开发的高级应用中,几乎都会使用到该接口,因为通过该接口,可以获 ...

  2. 黄聪:微信公众平台开发OAuth2.0网页授权(转)

    微信公众平台开发 OAuth2.0网页授权认证 网页授权获取用户基本信息 作者:方倍工作室 微信公众平台最近新推出微信认证,认证后可以获得高级接口权限,其中一个是OAuth2.0网页授权,很多朋友在使 ...

  3. APP微信支付报错《商户号该产品权限未开通,请前往商户平台>产品中心检查后重试》

    问题 最近项目使用MUI,HBuilder.开发打包H5的app 在开发H5 plus支付的时候,遇到以下问题: App微信支付调官方的统一下单接口返回错误信息 {return_msg=商户号该产品权 ...

  4. Java微信公众平台开发之公众号支付(微信内H5调起支付)

    官方文档点击查看准备工作:已通过微信认证的公众号,必须通过ICP备案域名(否则会报支付失败)借鉴了很多大神的文章,在此先谢过了 整个支付流程,看懂就很好写了 一.设置支付目录 在微信公众平台设置您的公 ...

  5. 微信公众平台开发 OAuth2.0网页授权认证

    一.什么是OAuth2.0 官方网站:http://oauth.NET/   http://oauth.Net/2/ 权威定义:OAuth is An open protocol to allow s ...

  6. Java微信公众平台开发(十一)--开发中微信公众平台/开放平台/商户平台的关联

    转自:http://www.cuiyongzhi.com/post/55.html 微信公众平台(map.weixin.qq.com)/开放平台(open.weixin.qq.com)/商户平台(pa ...

  7. 【微信开发】公众号后台设置错误导致的微信redirect_uri参数错误【图】

    在微信开发中,如微信网页授权登录,分享到朋友圈自定义内容,微信h5支付时 可能会遇到微信redirect_uri参数错误的情况. 此时除了检查自己代码正确性外,还要检查一下是否正确地设置了公众号后台的 ...

  8. 微信公众平台开发(71)OAuth2.0网页授权

    微信公众平台开发 OAuth2.0网页授权认证 网页授权获取用户基本信息 作者:方倍工作室 微信公众平台最近新推出微信认证,认证后可以获得高级接口权限,其中一个是OAuth2.0网页授权,很多朋友在使 ...

  9. 微信公众号开发之网页中及时获取当前用户Openid及注意事项

    目录 (一)微信公众号开发之VS远程调试 (二)微信公众号开发之基础梳理 (三)微信公众号开发之自动消息回复和自定义菜单 (四)微信公众号开发之网页授权获取用户基本信息 (五)微信公众号开发之网页中及 ...

随机推荐

  1. 一次数独生成及解题算法的剖析(Java实现)

    数独生成及解题算法剖析(Java实现) 关键词 数独9x9 数独生成算法 数独解题算法 序言 最近业务在巩固Java基础,编写了一个基于JavaFX的数独小游戏(随后放链接).写到核心部分发现平时玩的 ...

  2. kali2020创建root用户

    自kali更新到2020版后,默认取消了root用户的登录权限.只能用普通用户登录,这样做的优点在于对于kali的新手,在不懂的部分命令的情况下对系统的损害有所降低,也就说安全性提高了.但是普通用户权 ...

  3. php 文件上传错误

    假设文件上传字段的名称img,则: $_FILES['img']['error']有以下几种类型 1.UPLOAD_ERR_OK 其值为 0,没有错误发生,文件上传成功. 2.UPLOAD_ERR_I ...

  4. K8S构建1台master2台node+Harbor_笔记

    部署环境: master.node:centos7虚拟机 网络使用本地网卡共享到VMnet1(仅主机),虚拟机使用VMnet1. 准备文件: CentOS-7-x86_64-Minimal-1810. ...

  5. Websocket---认识篇

    为什么需要 WebSocket ? 了解计算机网络协议的人,应该都知道:HTTP 协议是一种无状态的.无连接的.单向的应用层协议.它采用了请求/响应模型.通信请求只能由客户端发起,服务端对请求做出应答 ...

  6. Python科学计算库Numpy

    Python科学计算库Numpy NumPy(Numerical Python) 是 Python 语言的一个扩展程序库,支持大量的维度数组与矩阵运算,此外也针对数组运算提供大量的数学函数库. 1.简 ...

  7. linux操作系统及常用命令

    GUN:GUN is Not UnixGPL:General Public License.通用公共许可证,版权 Copyright,Copyleft 开源协议LGPL:lesserGPLv2GPLv ...

  8. C# 并发编程 (异步编程与多线程)

    并发:同时做多件事情 多线程:并发的一种形式,它采用多个线程来执行程序. 并行处理:把正在执行的大量的任务分割成小块,分配给多个同时运行的线程.并行处理是多线程的一种,而多线程是并发的一种. 异步编程 ...

  9. C# HTTP1.0 1.1 2.0与HTTPS 、TCP/IP协议的UDP与TCP、 Socket介绍与WebSocket

    一.HTTP1.0 1.1 2.0和HTTPS 1.HTTP协议是什么? HTTP协议是超文本传输协议的缩写,英文是Hyper Text Transfer Protocol.它是从WEB服务器传输超文 ...

  10. JQuery生成二维码,有资源下载

    原文链接:http://www.yxxrui.cn/article/65.shtml 没时间或者懒得看的,可以直接看加粗部分(或试试手感▼). 使用jquery.qrcode来生成二维码,qrcode ...