微信小程序从本地开发环境到线上测试环境和生产环境的配置

这篇文章是对慕课网mpvue实战项目视频过程中环境的配置的总结与更新（因为小程序文档时不时就更新）

项目源码：https://github.com/suhuashan/bookCommentSystem

如果对你有帮助，请赐给我star~.   视频如果需要可以私信我。

开发环境分为本地开发环境和线上开发环境。

为什么要在本地环境开发呢？其实也就是便于调试。

线上开发环境每次都得上传测试代码，比较繁琐。

本地开发环境配置：

配置 config.js

https://console.qcloud.com/lav2/dev

将 Demo 代码 clone 到本地，用编辑器打开 server/config.js 添加以下配置（CONF已经存在的代码不用理）：

const CONF = {
      // 其他配置 ...
    serverHost: 'localhost',
    tunnelServerUrl: '',
    tunnelSignatureKey: '27fb7d1c161b7ca52d73cce0f1d833f9f5b5ec89',
      // 腾讯云相关配置可以查看云 API 秘钥控制台：https://console.cloud.tencent.com/capi
    qcloudAppId: '您的腾讯云 AppID',
    qcloudSecretId: '您的腾讯云 SecretId',
    qcloudSecretKey: '您的腾讯云 SecretKey',
    wxMessageToken: 'weixinmsgtoken',
    networkTimeout: 30000
}

并修改 MySQL 相关的配置为您本地的 MySQL 数据库。

还是在server/config.js文件下修改一下配置：

    mysql: {
        host: 'localhost',
        port: 3306,
        user: '本地数据用户名',
        db: 'cAuth',          //这里的数据库名自拟
        pass: '本地数据密码',
        char: 'utf8mb4'
    }

我这里就不用Demo里面的client文件夹了，直接把Demo文件里面的server文件夹拷贝到mpvue的脚手架的根目录下。

然后配置客户端src/config.js

const host = 'http://localhost:5757'

最后，配置根目录下的project.config.json文件，做以下相应的配置：

这样，mpvue项目的本地开发环境配置完成·。

注：如果直接用线上开发环境的话，上面的这些步骤都可以省去。

 当项目开发好后，想上传线上开发环境测试代码，需要进行以下配置。

服务端代码 sever/config.js:

const CONF = {
      // 其他配置 ...
    //serverHost: 'localhost',
    //tunnelServerUrl: '',
    //tunnelSignatureKey: '27fb7d1c161b7ca52d73cce0f1d833f9f5b5ec89',
      // 腾讯云相关配置可以查看云 API 秘钥控制台：https://console.cloud.tencent.com/capi
    //qcloudAppId: '您的腾讯云 AppID',
    //qcloudSecretId: '您的腾讯云 SecretId',
    //qcloudSecretKey: '您的腾讯云 SecretKey',
    //wxMessageToken: 'weixinmsgtoken',
    //networkTimeout: 30000


    // 微信小程序 App ID
    appId: '填写你的App ID',

    // 微信小程序 App Secret
    appSecret: '填写你的App Secre',

    // 是否使用腾讯云代理登录小程序
    useQcloudLogin: false,
}

把本地配置的代码注释，然后配置下面这三个选项即可。

如果useQcloundLogin: true没改成false，会出现以下错误：

https://github.com/tencentyun/wafer2-quickstart/issues/13

接着，打开微信开发者工具，点击右上角的详情，进入里面找到腾讯云状态：

复制这个线上开发环境请求域名，然后对客户端代码  src/config.js进行修改

// const host = 'http://localhost:5757'
const host = 'https://rmepknud.qcloud.la'

接着就是对线上数据库进行初始化：

https://console.qcloud.com/lav2/dev

将项目中用到的数据表进行创建。

最后，打开微信开发者工具，找到右上角腾讯云，点击上传测试代码

第一次上传，按照以下设置上传：

生产环境配置：

https://console.qcloud.com/lav2/production/initial