成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

vue 使用jssdk分享

MrZONT / 1589人閱讀

摘要:背景在中使用微信分享需要安裝應(yīng)用判斷蘋果手機(jī)訪問后臺(tái)接口獲取微信參數(shù)必填,公眾號(hào)的唯一標(biāo)識(shí)必填,生成簽名的時(shí)間戳必填,生成簽名的隨機(jī)串必填,簽名,見附錄必填,需要使用的接口列表,所有接口列表見附錄分享標(biāo)題分享鏈接分

背景

在vue中使用jssdk微信分享

weixin-js-sdk mint-ui需要安裝npm install weixin-js-sdk mint-ui --save

mixins/wechat.js

//weixin-js-sdk應(yīng)用
const wx = require("weixin-js-sdk")
import { Toast } from "mint-ui"
export default {
  methods: {
    wechatShare(info) {
      // 判斷蘋果手機(jī)
      let _url = ""
      if (window.__wxjs_is_wkwebview === true) {
        _url = window.location.href.split("#")[0] || window.location.href
      } else {
        _url = window.location.href
      }
      // 訪問后臺(tái)接口獲取微信參數(shù)
      this.$store
        .dispatch("GetWxParam", { url: encodeURIComponent(_url) })
        .then(res => {
          wx.config({
            debug: false,
            appId: res.data.appId, // 必填,公眾號(hào)的唯一標(biāo)識(shí)
            timestamp: res.data.timestamp, // 必填,生成簽名的時(shí)間戳
            nonceStr: res.data.nonceStr, // 必填,生成簽名的隨機(jī)串
            signature: res.data.signature, // 必填,簽名,見附錄1
            jsApiList: [
              "previewImage",
              "hideAllNonBaseMenuItem",
              "showMenuItems",
              "onMenuShareTimeline",
              "onMenuShareAppMessage",
              "chooseWXPay"
            ] // 必填,需要使用的 JS 接口列表,所有JS接口列表見附錄2
          })
        })
        .catch(err => {
          console.log(err)
        })
      wx.ready(() => {
        const share_title = info.title
        const share_desc = info.desc
        const share_link = info.link
        const share_img = info.img
        wx.showOptionMenu()
        wx.onMenuShareTimeline({
          title: share_title, // 分享標(biāo)題
          link: share_link, // 分享鏈接
          imgUrl: share_img, // 分享圖標(biāo)
          success: function() {
            Toast("已成功分享到朋友圈")
          },
          cancel: function() {
            Toast("已取消分享")
          }
        })
        wx.onMenuShareAppMessage({
          title: share_title, // 分享標(biāo)題
          desc: share_desc, // 分享描述
          link: share_link, // 分享鏈接
          imgUrl: share_img, // 分享圖標(biāo)
          success: function() {
            Toast("已成功分享給您的朋友")
          },
          cancel: function() {
            Toast("已取消分享")
          }
        })
      })
    }
  }
}

使用方法
import wxShare from "@/mixins/wechat" //引用
export default {

mixins: [wxShare], // 
methods: {
 setShare() {
   const shareInfo = {
      title: `羽絨服低至199元!`,
      desc: `7月26日-8月3日,年中限時(shí)特惠,售完即止`,
      link: window.location.href,
      img: ".../logo.jpg"
    }
    // mixins
    this.wechatShare(shareInfo)
  },
},
created(){
    // 設(shè)置
    this.setShare()
}
}

文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/108130.html

相關(guān)文章

  • 微信 jssdk 邏輯在 vue 中的運(yùn)用

    摘要:微信在中的簡(jiǎn)單使用以上是微信官方給出的示例代碼,但是對(duì)于實(shí)際項(xiàng)目使用,還需要進(jìn)一步對(duì)代碼進(jìn)行封裝。 微信 jssdk 在 vue 中的簡(jiǎn)單使用 import wx from weixin-js-sdk; wx.config({ debug: true, appId: , timestamp: , nonceStr: , signature: , jsApiLi...

    anRui 評(píng)論0 收藏0
  • IOS微信上Vue單頁面應(yīng)用JSSDK簽名失敗解決方案

    摘要:路由守衛(wèi)內(nèi)觸發(fā)更新簽名獲取真實(shí)有效微信簽名此處需要自行處理在路由守衛(wèi)內(nèi)更新簽名,保證是使用當(dāng)前頁面,是使用目標(biāo)路由完整地址再加上域名使用簽名調(diào)用在使用的頁面通過取出緩存的微信簽名,然后進(jìn)行簽名。 背景 手機(jī)型號(hào): 型號(hào):iphone 7 / iphone xs max版本:ios 10.3.1 / ios 12.1微信版本:WeChat 6.7.3 問題還原: Vue應(yīng)用(vue-ro...

    lixiang 評(píng)論0 收藏0
  • jssdk 在history模式下安卓不能調(diào)用圖片上傳接口和分享接口

    摘要:配置先上配置每個(gè)頁面都調(diào)用微信授權(quán)配置注是我在暴露的接口這份配置主要是根據(jù)微信公眾號(hào)開發(fā)踩坑記錄配置而來。 首先說明,應(yīng)用環(huán)境是使用的是vue+vue-router,history模式開發(fā)的單頁應(yīng)用。 配置 先上配置??? // index.js const protocol = location.protocol + // + location.host; router.afterE...

    dkzwm 評(píng)論0 收藏0
  • vue項(xiàng)目接入微信JSSDK的坑

    摘要:微信說明文檔分享的坑根據(jù)的文檔,很多人都是在初始化的配置的時(shí)候,傳入的當(dāng)前的地址不正確。同樣的,給微信初始化的加入對(duì)應(yīng)的參數(shù)。 date: 2018-12-13 15:23:09 用于記錄接入微信JS-SDK的坑,以后方便查詢第一次接入公眾號(hào)微信支付、分享、定位等等的坑的時(shí)候,心里是迷茫而又恐懼。因?yàn)?,聽說坑特別多,后來發(fā)現(xiàn)自己的親身體驗(yàn)到了這一點(diǎn)。 支付的坑 1、當(dāng)前URL未注冊(cè) ...

    lieeps 評(píng)論0 收藏0
  • vue項(xiàng)目接入微信JSSDK的坑

    摘要:微信說明文檔分享的坑根據(jù)的文檔,很多人都是在初始化的配置的時(shí)候,傳入的當(dāng)前的地址不正確。同樣的,給微信初始化的加入對(duì)應(yīng)的參數(shù)。 date: 2018-12-13 15:23:09 用于記錄接入微信JS-SDK的坑,以后方便查詢第一次接入公眾號(hào)微信支付、分享、定位等等的坑的時(shí)候,心里是迷茫而又恐懼。因?yàn)椋犝f坑特別多,后來發(fā)現(xiàn)自己的親身體驗(yàn)到了這一點(diǎn)。 支付的坑 1、當(dāng)前URL未注冊(cè) ...

    jsdt 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<