网站改版html,网站软件开发,市场调研报告,在天猫开店需要什么条件与费用uniapp因为要兼容小程序等#xff0c;会重写wx对象#xff0c;导致引入的jweixin-1.6.0.js中对象不生效。
综合网络资料#xff0c;有两种解决方案#xff1a;
一#xff0c;通过npm工具引入
npm install jweixin-module --save 实际上是借用了wx的另一个对象jWeixin
…uniapp因为要兼容小程序等会重写wx对象导致引入的jweixin-1.6.0.js中对象不生效。
综合网络资料有两种解决方案
一通过npm工具引入
npm install jweixin-module --save 实际上是借用了wx的另一个对象jWeixin
//main.jsimport jWeixin from jweixin-module
Vue.prototype.$wx jWeixin
// index.jsthis.$wx.config({debug: true,appId,timestamp,nonceStr,signature,jsApiList,
})
this.$wx.ready(() {}) 参考文章uniapp开发h5 调用微信sdk 全网最全指南 血泪史!
二手动引入
鉴于uniapp会重写wx的特性在初始化后可以再手动引入js覆盖原有的wx对象
// 新增模板 template.html
!DOCTYPE html
html langzh-CNheadmeta charsetutf-8 /meta http-equivX-UA-Compatible contentIEedge /title% htmlWebpackPlugin.options.title %/title!-- Open Graph data --!-- meta propertyog:title contentTitle Here / --!-- meta propertyog:url contenthttp://www.example.com/ / --!-- meta propertyog:image contenthttp://example.com/image.jpg / --!-- meta propertyog:description contentDescription Here / --scriptvar coverSupport CSS in window typeof CSS.supports function (CSS.supports(top: env(a)) || CSS.supports(top: constant(a)))document.write(meta nameviewport contentwidthdevice-width, user-scalableno, initial-scale1.0, maximum-scale1.0, minimum-scale1.0 (coverSupport ? , viewport-fitcover : ) /)/scriptlink relstylesheet href% BASE_URL %static/index.% VUE_APP_INDEX_CSS_HASH %.css //headbodynoscriptstrongPlease enable JavaScript to continue./strong/noscriptdiv idapp/div!-- built files will be auto injected --/body!-- scriptwindow.wx {}/scriptscript typetext/javascript srchttp://res.wx.qq.com/open/js/jweixin-1.2.0.js/script --
/html// manifest.json
h5 : {optimization : {treeShaking : {enable : true}},sdkConfigs : {maps : {}},router : {// base : /process-client/,mode : history},devServer : {disableHostCheck : true,proxy : {/api : {target : http://xxx.xx.xxx.xxx:xxx,changeOrigin : true,secure : false,logLevel : debug,pathRewrite : {^/api : }}},https : false},template : template.html}
// utils/wx-sdk.jsexport const createdScript (callback) {window.wx nullconst script1 document.createElement(script)script1.setAttribute(type, text/javascript)script1.setAttribute(src, https://res.wx.qq.com/open/js/jweixin-1.2.0.js)document.head.appendChild(script1)script1.onload function () {window.wx window.jWeixincallback callback()}
}// App.vuescript
import { createdScript } from /utils/wx-sdk.js
export default {onShow: function () {console.log(App Show)createdScript(() {api({url: window.location.href}).then(([err, res]) {if (err) {return}wx.config({debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来若要查看传入的参数可以在pc端打开参数信息会通过log打出仅在pc端时才会打印。appId: res.appId, // 必填企业微信的corpIDtimestamp: Number(res.timestamp), // 必填生成签名的时间戳nonceStr: res.nonceStr, // 必填生成签名的随机串signature: res.signature, // 必填签名见 附录-JS-SDK使用权限签名算法jsApiList: []})})})},
}
/script
