15.【nuxt起步】-Nuxt使用jsweixin sdk
npm install weixin-js-sdk --save 这个不行,这个是vue前端用的
网上找了一些vue jsweixin的案例 不能直接用 因为nuxt是后端运行,windows对象取不到,通过查找到了一个可用的案例
就是把js注入到前端


其中jssdkInfo和要分享的appid,noncestr等参数要去接口后端请求过来,核心代码复制如下:
wxInit(){
  const script = document.createElement('script');
  // 返回一个独立的promise
  script.src = 'https://res.wx.qq.com/open/js/jweixin-1.2.0.js';
  new Promise((resolve, reject) => {
  let done = false;
  script.onload = script.onreadystatechange = () => {
  if (
    !done &&
    (!script.readyState ||
      script.readyState === 'loaded' ||
      script.readyState === 'complete')
    ) {
      done = true;
      // 避免内存泄漏
      script.onload = script.onreadystatechange = null;
      resolve(script);
      }
    };
    script.onerror = reject;
    document
      .getElementsByTagName('head')[0]
      .appendChild(script);
      }).then(res => {
      wx.config({
        debug: false,
        appId: this.jssdkInfo.AppId,
        timestamp: this.jssdkInfo.TimeStamp,
        nonceStr: this.jssdkInfo.NonceStr,
        signature: this.jssdkInfo.Signature,
        jsApiList: ['onMenuShareTimeline', 'onMenuShareAppMessage', 'onMenuShareQQ', 'onMenuShareWeibo', 'onMenuShareQZone']
});
 
												
											15.【nuxt起步】-Nuxt使用jsweixin sdk的更多相关文章
- ERROR  EPERM: operation not permitted, mkdir 'C:\Users\Administrator\Desktop\text\nuxt\basic\.nuxt\components'
		
C:\Users\Administrator\Desktop\text\nuxt>cd basic C:\Users\Administrator\Desktop\text\nuxt\basic& ...
 - 14.【nuxt起步】-Pm2 和nuxt服务运行
		
1.安装pm2 npm install pm2 -gd 2.启动 Pm2 start ./bin/www 3. pm2 save 4.Pm2 startup 5.Pm2 save修改 package. ...
 - 13.【nuxt起步】-部署到正式环境
		
已经购买centos服务器,并安装了nodejs环境 Secure CRT链接 Cd / Cd /var/www Mkdir test.abc.cn 用ftp 除了node_modules,其他都上传 ...
 - 11.【nuxt起步】-登录验证
		
1.新建/pages/login.vue 2.安装cookie Cnpm install js-cookie --s 3.Login.vue增加 import Cookie from 'js-cook ...
 - 10.【nuxt起步】-引用mintui
		
这时候我们完成了list.vue,但是怎么返回index.vue,这时候需要这个头部返回 1.我们使用现成的minu-ui,eleme的开源移动端 ,参考 https://www.cnblogs.co ...
 - 9.【nuxt起步】-scroll分页加载
		
面是单页,下面实现一个列表页和分页加载的例子 1.新建pages/list.vue <template> <div> 分页加载列表页面 </div> </te ...
 - 7.【nuxt起步】-Nuxt与后端数据交互
		
接下来就是对接服务端接口,展示真实的数据 1.做了个虚拟接口地址:http://test.yms.cn/testjson.asp 输出数据: { "title": "单间 ...
 - 6.【nuxt起步】-完成一个静态的页面
		
1.接下来新建/component/maincontent.vue 把这些html代码copy到maincontent.vue 发现格式比较难看,就格式化一下 2.插件安装 beautify,安装后重 ...
 - 5.【nuxt起步】-swiper组件
		
接下来是一个比较常用,也比较重要的组件 swiper,可以自行搜索 vue swiper,有很多开源组件,我这里就复用之前一个熟悉的, 1.新建component/banner.vue 刷新报错: 要 ...
 
随机推荐
- BugKu 2B+基于python的opencv的安装-------CTF 盲水印的套路
			
BugKu杂项-2B 下载图片后,binwalk下跑一跑,发现有个zip,分离. 值得一提的是,这个zip是伪加密的. 但是你在分离的时候,伪加密的图片也给你分离出来了.这两个图片2B和B2肉眼看起来 ...
 - Bugku杂项-convert
			
一进去就发现一堆二进制数,然后考虑怎么才能把这个和隐写扯上关系.首先,二进制我们肉眼就是看不懂再说什么的,这里就想到了转换,再联想上hex将原始数据转化为16进制.我们可以先把2进制转化为16进制,然 ...
 - 踩坑 PHP Fatal Error Failed opening required File
			
使用 require 引用文件时,报错如下: require 'https://dev.ryan.com/test.php'; [Sat Mar 19 23:10:50 2011] [warn] mo ...
 - 最少的硬币数量组合出1到m之间的任意面值(贪心算法)
			
题目描述: 你有n种不同面值的硬币,每种面值的硬币都有无限多个,为了方便购物,你希望带尽量少的硬币,并且要能组合出 1 到 m 之间(包含1和m)的所有面值. 输入描述: 第一行包含两个整数:m ,n ...
 - ROM+VGA 图片显示
			
内容 1.将一幅图片制成mif文件,初始化rom,图片像素为 120 * 60 2.驱动VGA,将图片显示在屏幕上 1.VGA 时序 下面是我的笔记截图,感觉更好理解. 2.640*480 60hz ...
 - Linux 的软件管理及配置 - 安装、卸载、升级、依赖
			
1. 对比:Windows 和 Linux 上软件的安装与卸载 大部分 Linux 使用者都是从 Windows 转过来的,先对这俩做个对比,有助理解. 就像在 Windows 下,很多软件也有安装版 ...
 - [oldboy-django][4python面试]有关yield那些事
			
1 yield 在使用send, next时候的区别(举例m = yield 5) 无论send,next首先理解m = yield 5 是将表达式"yield 5 "的结果返回给 ...
 - SQL Server 2014存储过程的备份和还原
			
Sql Server 2014存储过程备份和恢复... 1 1. 备份存储过程:... 1 2. 还原... 8 Sql Server 2014存储过程备份和恢复 1. 备份存储过 ...
 - Spring Cloud Eureka简单入门
			
步骤: 1.创建父工程 2.创建EurekaServer工程 3.创建EurekaClient工程 父工程pom.xml <?xml version="1.0" encodi ...
 - 安装配置apache sentry服务
			
环境 系统环境:Centos6.7 Hadoop版本:CDH5.10 jdk版本:jdk7 注:本文并未集成kerberos组件 安装Sentry Server 选择安装hive的节点进行安装测试: ...