- Notifications
You must be signed in to change notification settings - Fork32
qutz/vue-mall
Folders and files
Name | Name | Last commit message | Last commit date | |
---|---|---|---|---|
Repository files navigation
微信公众号测试项目
图片引用地址SegmentFault
这种授权在第4步请求服务器返回token后,vue客服端直接重定向到最开始进入的页面
let params = { ...to.query } // api接口登录 wxmp.login(params).then(res => { setToken(res.data.token) window.location.href = window.location.origin + getToUrl() })
微信分享使用的是history模式实现自定义分享
经过测试实现步骤如下:
- 授权后进入router.beforeEach时判断系统类型,是IOS系统就记录当前URL到vuex中
注意:如果进入路由有重定向,需要加入重定向后的路由名称,比如'/'重定向到'/home'
if (!Vue.device.isAndroid) { if (!store.state.app.iosJsUrl) { let landingPage = document.URL // 如果进入路由有跳转需要加入跳转后的路由名称,比如/跳转到/home if (to.name === HOME && landingPage.indexOf(HOME) === -1) { landingPage = landingPage + HOME } store.commit(types.SET_WX_JS_URL, {iosJsUrl: landingPage}) } }
- 进入router.afterEach时判断系统类型,获取不同的jssdk签名地址
router.afterEach(to => { // store.commit(types.UPDATE_LOADING_STATUS, {isLoading: false}) let _url = window.location.origin + to.fullPath if (!Vue.device.isAndroid) { _url = store.state.app.iosJsUrl.split('#')[0] } wechat.getJSSDK(_url)})
- vue全局公用函数实现分享
Vue.prototype.wxShare = wechat.setWxShare setWxShare (title, desc, link, imgUrl) { Vue.wechat.ready(() => { // 分享给朋友 Vue.wechat.onMenuShareAppMessage({ title: title, // 分享标题 desc: desc, // 分享描述 link: link, // 分享链接 默认以当前链接 imgUrl: imgUrl, // 分享图标 success () { }, cancel () { } }) // 分享到朋友圈 Vue.wechat.onMenuShareTimeline({ title: title, // 分享标题 desc: desc, // 分享描述 link: link, // 分享链接 默认以当前链接 imgUrl: imgUrl, // 分享图标 success () { }, cancel () { } }) }) }
- 页面中调用wxShare实现自定义分享
activated () { this.share() }, methods: { share () { let link = window.location.href.split('#')[0] this.wxShare('首页', '首页内容', link, 'https://o3e85j0cv.qnssl.com/tulips-1083572__340.jpg') } }
# install dependenciesnpm install# serve with hot reload at localhost:8080npm run dev# build for production with minificationnpm run build# build for production and view the bundle analyzer reportnpm run build --report# run unit testsnpm run unit# run e2e testsnpm run e2e# run all testsnpmtest
For a detailed explanation on how things work, check out theguide anddocs for vue-loader.
About
微信公众号测试项目
Topics
Resources
Uh oh!
There was an error while loading.Please reload this page.
Stars
Watchers
Forks
Releases
No releases published
Packages0
No packages published
Uh oh!
There was an error while loading.Please reload this page.
Contributors2
Uh oh!
There was an error while loading.Please reload this page.