WeChat Template
一套基于SpringBoot & Shiro 以及 Uni-app構建的微信小程序腳手架
開源地址: https://github.com/TyCoding/wechat-template 歡迎Star挑秉、Fork支持作者匀哄。
安裝項目
首先你需要閱讀之前的文章:
閱讀了上述文章相信你已經在本地電腦上配置好了SpringBoot
項目開發(fā)環(huán)境和Uni-app 微信開發(fā)工具
等開發(fā)環(huán)境吭历。下面講解如何安裝項目媚赖。
下載項目源碼
如果你的本地已經安裝了git
客戶端匿沛,那么可以直接使用git clone
命令下載項目。(如果沒有安裝就在GitHub倉庫網頁上點擊download
)按鈕:
git clone https://github.com/TyCoding/wechat-template.git
或者:
運行項目
如果已經下載了源碼框仔,將會看到如下文件:
注意:
之前我的開源項目中初婆,倉庫也是如此包含了兩個子文件夾,他是代表了兩個項目矫户,但是莫名其妙有人會認為這是一個項目片迅,而直接用IDEA打開wechat-template
這個文件夾,這要是能運行成功就怪了吏垮,所以大家無論在運行我的項目還是別人的項目都首先要觀察項目目錄結構再做其他的障涯。
那么上圖片中兩個文件夾分別代表兩個項目,需要用不同的IDE打開:
-
wechat-api
: 后端項目膳汪,由SpringBoot構建唯蝶,你需要使用配置了Maven環(huán)境的IDEA打開該項目,IDEA會自動加載該項目的Maven依賴 -
wechat-app
: 前端項目遗嗽,微信小程序端粘我,你需要使用HBuilderX打開該項目(請注意我的Version 2.7.9
)
運行wechat-api
項目
當IDEA完全加載了該項目的Maven依賴,將看到左側樹形目錄中:java
和resources
文件夾已經變色,這就證明項目加載正常征字,可以運行了:
在運行項目之前都弹,需要先導入數據庫,本項目的數據庫文件在上圖/wechat-api/db.sql
匙姜,使用Navicat創(chuàng)建名稱為wechat_api
的數據庫畅厢,然后將db.sql
中的表結構復制進去執(zhí)行即可完成創(chuàng)建:
修改項目配置文件中有關數據庫的配置。在wechat-api
項目中依次找到src/main/resources/application.yml
:
注意:
-
application.yml
項目主配置文件 -
application-dev.yml
項目開發(fā)環(huán)境配置 -
application-prod.yml
項目生產環(huán)境配置
上述三者文件區(qū)別氮昧,后續(xù)文章中會深入講解】蚨牛現在我們需要修改的是application-dev.yml
文件中username, password, url
三個參數信息。
啟動項目:
測試項目
首先要明白袖肥,這是基于SpringBoot咪辱、Shiro構建的后端項目,項目中對身份認證椎组、Token校驗油狂、全局異常處理等都做了封裝(后續(xù)文章將講解如何封裝),那么我們直接使用Postman工具測試請求項目登錄接口:localhost:8080/login
如上寸癌,說明項目啟動成功专筷。(上圖顯示了由全局統一異常處理器自定義的異常返回信息)
運行wechat-app
項目
使用HBuilderX打開wechat-app
項目,在頂部菜單欄找到:運行 -> 運行到小程序模擬器 -> 微信開發(fā)者工具
:
HBuilderX將自動編譯項目蒸苇,并自動打開微信開發(fā)者工具:
以上仁堪,項目就啟動成功了。
注意:
如果你此時點擊了登錄按鈕應該會是正常登錄項目填渠,但要注意的是我推送到 https://github.com/TyCoding/wechat-template 倉庫中 wechat-app
配置文件中寫的服務端URL其實連接是我自己的云端服務器弦聂。為什么我直接放自己的服務器地址?因為當前是在PC上使用微信開發(fā)工具運行的小程序氛什,可能細節(jié)體驗不如真實手機莺葫,而在手機是哪個運行又肯定無法連接到PC上運行的后端項目IP,所以這里為了方便大家體驗就這樣做了枪眉。
具體可以看wechat-app
項目中wechat-app/config.js
文件:
后續(xù)文章我將教大家這些參數的含義以及如何修改這些參數捺檬。
手機端預覽
效果就是,點擊微信開發(fā)者工具右上方預覽按鈕贸铜,用該App ID綁定的微信號掃描二維碼預覽小程序:
手機端打開小程序堡纬,點擊登錄按鈕彈出網絡連接異常的信息
,此時需要手動點擊右上方選擇打開調試
按鈕重新打開小程序便可以正常登錄了:
初次打開小程序彈出登錄異常 | 打開調試重新登錄 | 登錄成功 |
---|---|---|
Tips
如果你是一個有關項目啟動的細節(jié)配置等信息蒿秦,我在后續(xù)文章中會詳細講解烤镐。
請大家持續(xù)關注公眾號最新消息。
交流
QQGroup:671017003
WeChatGroup: 關注公眾號查看