公众号实战(一)介绍及内网工具

前言

从这个系列开始我们来开发一个电影公众号,我们将从开始每行代码手打到项目上线

项目所用的技术栈

vue ssr/nuxt+node+koa2+es6/7+sass+mongoose+vux

项目开始之前

我们需要有内网代理工具,在微信的开发中第一步就是要验证开发者的服务器,我自己用的是花生壳（注册要6元还要身份验证),但是这个代理服务相对来说比较稳定，也可以使用succy（免费）
我自己使用的是花生壳,就介绍一下花生壳的用法吧

花生壳配置

1.安装好花生壳的软件，点击内网穿透，进入到后台管理

花生壳内网穿透

2.点击添加映射按钮

花生壳映射

3.添加ip和端口号

映射规则

4.测试一下我们的端口,编写一个简单的test.js

const http =require('http')
http.createServer((req,res)=>{
   res.writeHead(200,{"Content-type":"text/blain"});
   res.write("test");
   res.end();
})
http.listen(3000,()=>{
    console.log(`服务器启动成功,端口号3000`)
})

谷歌中输入花生壳为我们自动分配的域名(当然,这个域名需要备案),可以看到输出的了test文案,到此我们的内网穿透配置成功啦,下一步就是微信验证开发者服务器了哦

初始化我们的项目文件

从现在开发我们将开始项目开发了，首先用vue-cli来初始化一个项目

vue init nuxt/koa movie 
npm install /yarn

我们的项目初始化就结束了.

补充ngrok.cc内网映射

我在正式开发项目中发现花生壳代理已经不能支持80端口映射了,那我们就只能用ngrok.cc了哦,
当前使用方式只有windows版本哦,mac下请自行研究啦
1我们从https://www.ngrok.cc注册之后进入后台,配置规则

2.开通隧道

开通隧道

3.配置规则

配置规则

4.windows系统开发者,下载客户端工具

下载客服端工具

5.通过cmd来启动映射工具
sunny.exe clientid 输入自己的隧道id
这样子就启动成功了哦

映射成功

推荐大家还是去sunny.cc官网看一些新手教程,比我说的更加全面,上面的只是我自己平时用到方面哦