Java+Vue 微信公众号

继整理完上篇文章《初遇Vue》之后 整理一下微信公众号的那些事,客户项目是用java写的,应用了spring cloud微服务框架,所以折腾的这个微信公众号基本不用我写java程序,相关接口已经非常成熟了。在这里就讲讲部署测试的时候遇到的一些问题吧!

java part

自从被哥哥们拽着搞业务之后,自身的精力全被分散了,导致长时间不写java代码手生,犯了好多的低级错误。

错误示范
下段代码中若wxUser为空的时候直接赋值为对象项目会 报错
这是个教训 得谨记

WXUser wxUser = this.wxUserDao.findByOpenId(openId);
        if (wxUser == null) {
            // 请求app 第三方登录接口返回apptoken 并存上 session也要存
     WXUserValue wxUserValue = iwxUserService.loginThird(param);
            if (StringUtils.isNotBlank(wxUserValue.getAppToken())) {
                wxUser = new WXUser();
                ...
                this.wxUserDao.save(wxUser);
               wxUser = newUser;
           } else {
              ...
                }
            }
        }
       wxSessionValue.setAppToken(wxUser.getAppToken());

vue part

  1. 关于代理
    因为是前后端分离的项目,所以在项目部署的时候前端程序和后台程序不在同一个端口,这时需要Nginx帮帮忙。
    前端config/index.js的文件中代理请求接口设置如下:
proxyTable: {
      '/search': {
        target: 'http://localhost:9380',// 这是本地java项目端口
        changeOrigin: true,
        pathRewrite: {
          '^/search': '/search'
        }
      }
}
  1. 关于Vue官方提供的axios配置

axios.create中相关参数的配置有许多 具体可查看官方提供文档,这里只做项目需求的一些公共配置,而具体的接口调用要根据提供接口的性质来判断是否为POST请求、GET请求等其他

// 这是统一方法
import axios from 'axios'
import router from '../main'

const request = axios.create({
  headers: {
    'Content-Type': 'application/json;charset=UTF-8'
  },
  baseURL: 'http://localhost:8080'// 这是vue本地端口 Vue端口调整可在config/index.js中设置
export default request
// 这是具体接口的个性化调整
import request from '../utils/request'

export function activityDetail (postData) {
  return request({
    url: '/wx/getActivityById',
    method: 'post',
    data: JSON.stringify(postData)
  })
}

这样在对应的.vue文件中直接引用

import { activityDetail } from '../api/share'

就可以实现axios的应用 跟传统的ajax用法没有区别了

微信公众号 part

用Vue写微信公众号 唯一需要注意的就是微信公众号授权问题,尤其是公众号菜单如何跳转到对应的页面,由于vue编译出来的是类似于静态页面,传统的ModelAndView方法根本不能实现跳转(ps:至少我是没有实现跳转),最后在java程序里写了

response.sendRedirect(RestConstants.HOST_SERVICE + "dist/index.html#/error");

但是被吐槽跳转过重,感觉已经尽力,有什么更好的方法么,求助

你可能感兴趣的:(Java+Vue 微信公众号)