快捷導(dǎo)航

微信小程序搭載node.js服務(wù)器的簡(jiǎn)單教程

更新時(shí)間：2022年12月27日 11:19:19 作者：靈魂學(xué)者

小程序是一種全新的連接用戶與服務(wù)的方式,它可以在微信內(nèi)被便捷地獲取和傳播,同時(shí)具有出色的使用體驗(yàn),下面這篇文章主要給大家介紹了關(guān)于微信小程序搭載node.js服務(wù)器的簡(jiǎn)單教程,需要的朋友可以參考下

1.node.js

檢測(cè)電腦是否安裝node.js，可以用【 cmd/Power shell 】命令檢測(cè)，也可以用【git-bash】，這里就用git-bash進(jìn)行演示，沒有g(shù)it-bash可以安裝一下。

node -v

如果有對(duì)應(yīng)的版本號(hào)即為已經(jīng)安裝完成！

未安裝的附上鏈接了：

node.js安裝 ： Download | Node.js 或點(diǎn)擊這里下載

Git-Bash：Git - Downloads 或點(diǎn)擊這里下載

2.微信小程序

在微信開發(fā)者工具中，創(chuàng)建一個(gè)微信小程序，在創(chuàng)建微信小程序的目錄下新建一個(gè)文件夾，命名為【server】表示我們的服務(wù)器，然后打開文件夾，右鍵鼠標(biāo)點(diǎn)擊如圖

打開后分別輸入以下命令

（1）初始化項(xiàng)目，將會(huì)自動(dòng)創(chuàng)建package.json配置文件

npm init -y

（2）安裝Express框架，用于快速搭建HTTP服務(wù)器

npm install express --save

（3）安裝nodemon監(jiān)控文件修改

npm install nodemon -g

執(zhí)行完上述命令之后，在該目錄下創(chuàng)建一個(gè)index.js文件，同時(shí)編寫以下代碼

const express = require('express')
const bodyParser = require('body-parser')
const app = express()
app.use(bodyParser.json())
 
//處理POST請(qǐng)求
app.post('/',(req,res)=>{
    console.log(req.body)
    res.json(req.body)
})
//處理GET請(qǐng)求
app.get('/',(req,res)=>{
    console.log(req.body)
    res.json(req.body)
})
 
//監(jiān)聽3000端口
app.listen(3000,()=>{
    console.log('server running | http://127.0.0.1:3000')
})

在剛剛的【Git-Bash-Here】中輸入如下命令

nodemon index.js

有以上效果，則表示已經(jīng)啟動(dòng)成功了。

3.發(fā)送請(qǐng)求

如何發(fā)送請(qǐng)求，假設(shè)我們?yōu)辄c(diǎn)擊這個(gè)事件【bindtap="play"】進(jìn)行一個(gè)數(shù)據(jù)請(qǐng)求，在微信小程序項(xiàng)目中的【.js】文件中編寫代碼

play:function(e){
    wx.request({
    //請(qǐng)求方式(大小寫皆可，不寫默認(rèn)為GET請(qǐng)求)
    method:'GET',
    //服務(wù)器接口地址
    url:'http://127.0.0.1:3000/',
    //data表示請(qǐng)求的參數(shù)
    data:e.detail.value,
    //接口調(diào)用成功的回調(diào)函數(shù)
    //res表示服務(wù)器響應(yīng)信息
    success:function(res){
        console.log(res)
    }
})
}

4.data數(shù)據(jù)存放在服務(wù)端

在微信小程序項(xiàng)目當(dāng)中我們會(huì)在【.js】文件中定義data數(shù)據(jù)，那么我們現(xiàn)在將data數(shù)據(jù)放入到我們的服務(wù)端中去

const express = require('express')
const bodyParser = require('body-parser')
const app = express()
app.use(bodyParser.json())
 
app.get('/', (req, res) => {
  // console.log(req.body)
  res.json(data)
})
 
app.listen(3000, () => {
  console.log('server running at http://127.0.0.`1:3000')
})
 
var data = {
    //存放你的data數(shù)據(jù)
}