前言
從這個(gè)系列開始我們來開發(fā)一個(gè)電影公眾號(hào),我們將從開始每行代碼手打到項(xiàng)目上線
項(xiàng)目所用的技術(shù)棧
vue ssr/nuxt+node+koa2+es6/7+sass+mongoose+vux
項(xiàng)目開始之前
我們需要有內(nèi)網(wǎng)代理工具,在微信的開發(fā)中第一步就是要驗(yàn)證開發(fā)者的服務(wù)器,我自己用的是花生殼（注冊(cè)要6元還要身份驗(yàn)證),但是這個(gè)代理服務(wù)相對(duì)來說比較穩(wěn)定于毙，也可以使用succy（免費(fèi)）
我自己使用的是花生殼,就介紹一下花生殼的用法吧
花生殼配置
1.安裝好花生殼的軟件，點(diǎn)擊內(nèi)網(wǎng)穿透媳搪，進(jìn)入到后臺(tái)管理
2.點(diǎn)擊添加映射按鈕
3.添加ip和端口號(hào)
4.測(cè)試一下我們的端口,編寫一個(gè)簡(jiǎn)單的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(`服務(wù)器啟動(dòng)成功,端口號(hào)3000`)
})
谷歌中輸入花生殼為我們自動(dòng)分配的域名(當(dāng)然,這個(gè)域名需要備案),可以看到輸出的了test文案,到此我們的內(nèi)網(wǎng)穿透配置成功啦,下一步就是微信驗(yàn)證開發(fā)者服務(wù)器了哦
初始化我們的項(xiàng)目文件
從現(xiàn)在開發(fā)我們將開始項(xiàng)目開發(fā)了蒋畜，首先用vue-cli來初始化一個(gè)項(xiàng)目
vue init nuxt/koa movie
npm install /yarn
我們的項(xiàng)目初始化就結(jié)束了.
補(bǔ)充ngrok.cc內(nèi)網(wǎng)映射
我在正式開發(fā)項(xiàng)目中發(fā)現(xiàn)花生殼代理已經(jīng)不能支持80端口映射了,那我們就只能用ngrok.cc了哦,
當(dāng)前使用方式只有windows版本哦,mac下請(qǐng)自行研究啦
1我們從https://www.ngrok.cc注冊(cè)之后進(jìn)入后臺(tái),配置規(guī)則
2.開通隧道
3.配置規(guī)則
4.windows系統(tǒng)開發(fā)者,下載客戶端工具
5.通過cmd來啟動(dòng)映射工具
sunny.exe clientid 輸入自己的隧道id這樣子就啟動(dòng)成功了哦
推薦大家還是去sunny.cc官網(wǎng)看一些新手教程,比我說的更加全面,上面的只是我自己平時(shí)用到方面哦
