---

效果圖如下：

---

我的小程序

要點(diǎn)：

• nodejs
• 百度翻譯api
• 騰訊云服務(wù)器
• ssl證書
• nginx反向代理nodejs項(xiàng)目

使用：

下載本項(xiàng)目到本地或者你的服務(wù)器，進(jìn)入server文件夾，輸入npm install安裝依賴，等待安裝完成輸入npm start啟動(dòng)后端腳本，app文件夾使用微信開發(fā)工具打開，把pages文件夾內(nèi)index.js中的wx.request中的url改為你的服務(wù)器域名或者ip地址（真機(jī)測(cè)試必須是https訪問(wèn)，這就是下面我煞費(fèi)口舌說(shuō)https的原因），也可以本地調(diào)試的話應(yīng)該可以改為：localhost:端口

我做的這個(gè)小程序是一個(gè)翻譯助手，非常簡(jiǎn)單，微信的api我只是使用wx.request和onShareAppMessage兩個(gè)重要的官方api函數(shù)，至于邏輯那些只能自己寫。

這個(gè)小程序，部署在我的騰訊云服務(wù)器里面，在3000端口跑，用Nginx在443端口進(jìn)行代理，在server文件夾內(nèi)的server.js負(fù)責(zé)接收小程序發(fā)送過(guò)來(lái)的請(qǐng)求，并且使用translate.js里面的函數(shù)進(jìn)行翻譯，最后把結(jié)果反饋給小程序。

translate.js里面使用百度翻譯的api，主要使用http.request()函數(shù)，百度翻譯的api很好用，很喜歡。

核心代碼

module.exports = function(params, callback) { 
  if (typeof params === 'string') { 
    params = { 
      query: params 
    }; 
  } 

  params = { 
    from: params.from || 'zh', 
    to: params.to || 'en', 
    query: params.query || '' 
  }; 

  var data = querystring.stringify(params); 
    options = { 
      host: 'fanyi.baidu.com', 
      port: 80, 
      path: '/v2transapi', 
      method: 'POST', 
      headers: { 
        'Content-Type':'application/x-www-form-urlencoded', 
        'Content-Length': data.length 
      } 
    }; 

  var req = http.request(options, function(res) { 
    var result = ''; 

    res.setEncoding('utf8'); 

    res.on('data', function(data) { 
      result += data; 
    }); 

    res.on('end', function() { 
    //console.log(result);
      var obj = JSON.parse(result);
      console.log(obj);
      var str = obj.trans_result.data[0].dst; 
      callback(str); 
    }); 
  }); 

  req.on('error', function(err) { 
    console.log(err); 
    setTimeout(function() { 
      translation(query, callback); 
    }, 3000); 
  }); 


  req.write(data); 
  req.end(); 


};

參數(shù)：

params = { 
   from: params.from || 'zh', //原來(lái)是什么語(yǔ)言                
   to: params.to || 'en', //要翻譯為什么語(yǔ)言         
   query: params.query || ''  //要翻譯的語(yǔ)句
 };

使用百度翻譯的api,必須知道每種語(yǔ)言，百度翻譯使用什么單詞表示的（本人整理）：

---

解決語(yǔ)音問(wèn)題：

這是百度翻譯女聲語(yǔ)音的url，喜歡的朋友可以收藏，以后可能用得上
注意里面有兩個(gè)參數(shù)，一個(gè)是lan意思是要讀出出來(lái)的是什么語(yǔ)言，zh是中文，en是英文，很遺憾，這個(gè)url這可以播報(bào)中文和英文的語(yǔ)音，其他的小語(yǔ)種不可以這也是我的小程序只可以有中文和英文兩種語(yǔ)言的語(yǔ)音的原因，第二個(gè)參數(shù)是text就是要播報(bào)的文本是什么

---

官方文檔：

其實(shí)在幾個(gè)月之前我就開始關(guān)注它，而且小程序發(fā)布那天是9號(hào)，那時(shí)候我正好考試，因?yàn)樾〕绦蚴切率挛?，?dāng)時(shí)我真的有點(diǎn)忍不住，但是又要復(fù)習(xí)考試，所以很不爽，放假之后我就開始看微信小程序的官方文檔 通俗易懂很不錯(cuò)。個(gè)人推薦想學(xué)習(xí)小程序的就按照這份官方文檔按順序看吧，其它比如掘金或者w3school也有，但是這畢竟是官方的，比較權(quán)威。語(yǔ)言是基于es6，注意這里使用的wxml,wxss,是是對(duì)應(yīng)html和css的，wxml跟html語(yǔ)法上相似，wxss語(yǔ)法就是跟css一樣。

---

注意事項(xiàng):

首先開發(fā)小程序是需要一個(gè)APPID的

這個(gè)在教程官方文檔里面的官方文檔里面會(huì)說(shuō)到，但是這個(gè)微信小程序表面上是必須具有個(gè)體戶工商營(yíng)業(yè)執(zhí)照或者企業(yè)營(yíng)業(yè)執(zhí)照才可以注冊(cè)的，但是像我這種窮學(xué)生要是想學(xué)一下小程序怎么辦呢？這時(shí)候你需要這個(gè) 我就是像這樣申請(qǐng)一個(gè)小程序賬號(hào)，得到一個(gè)APPID，注意不需要搞這個(gè)微信認(rèn)證的，這個(gè)?？兆由暾?qǐng)的APPID只可以用來(lái)開發(fā)，是沒(méi)辦法拿來(lái)發(fā)布小程序的，認(rèn)證也是認(rèn)證不了的

在小程序里面的wx.reques函數(shù)在是用來(lái)向你的后端服務(wù)器發(fā)出請(qǐng)求的

wx.request({
  url: 'test.php', //僅為示例，并非真實(shí)的接口地址
  data: {
     x: '' ,
     y: ''
  },
  header: {
      'content-type': 'application/json'
  },
  success: function(res) {
    console.log(res.data)
  }
})

注意這個(gè)函數(shù)的url必須是https,這是除了看文檔之外我花費(fèi)時(shí)間最多的地方

---

接上面講https

這個(gè)真的浪費(fèi)我很多時(shí)間，我的后端是在我的騰訊云服務(wù)器使用nodejs語(yǔ)言搭建的server，因?yàn)樾〕绦虮仨毜膔equest的url必須是https這就需要你的服務(wù)器具有ssl證書。如果你使用的騰訊云服務(wù)器的話，登錄你的騰訊云服務(wù)器云主機(jī)，在上面的ssl證書管理那里你會(huì)看到這個(gè)：

你需要申請(qǐng)證書，按照指引走就行，申請(qǐng)之后就會(huì)看到截圖那樣的證書申請(qǐng)好在那里了，下載之后會(huì)發(fā)現(xiàn)主要有三部分：Apache, Nginx, IIS：

注意：證書的安裝騰訊云的文檔不是說(shuō)的太明白，我當(dāng)時(shí)就是搞得一臉懵逼。因?yàn)槲业牡姆?wù)端是用nodejs寫的，所以需要安裝Nginx服務(wù)器(涉及Nginx反向代理nodejs項(xiàng)目)，Nginx的安裝教程

安裝之后你就可以使用http://yourDomainName yourDomainName是你的域名（沒(méi)有域名的話需要自己申請(qǐng)一個(gè)，在騰訊云上有得買，加上優(yōu)惠券還是挺便宜的，但是之后幾年的價(jià)格怎樣不知道，想要免費(fèi)的域名也可以，可以自行谷歌百度搜素一下就行） 來(lái)訪問(wèn)你的服務(wù)器的了（默認(rèn)是80端口），然后安裝Nginx證書，教程

安裝好ssl證書之后，你就可以適應(yīng)https://yourDomainName 來(lái)訪問(wèn)你的服務(wù)器

接著就是使用你的Nginx服務(wù)器來(lái)代理你作為微信小程序后端的nodejs項(xiàng)目了

---

先說(shuō)說(shuō)使用Nginx反向代理nodejs項(xiàng)目是什么意思

Nginx是安裝在你服務(wù)器里面，他可以占據(jù)著一個(gè)端口，比如443，然后你運(yùn)行你的nodejs項(xiàng)目，讓它在3000端口跑，這時(shí)候你讓Nginx代理，讓別人訪問(wèn)你服務(wù)器443端口的時(shí)候，轉(zhuǎn)而自動(dòng)訪問(wèn)你nodejs所在3000端口，這就是使用Nginx反向代理nodejs項(xiàng)目教程 核心部分如下（下圖源自Nginx的nginx.conf配置文件）：

---

forever（后端小tips）

forever是可以讓nodejs項(xiàng)目在后臺(tái)運(yùn)行的，只需要npm install forever一下就可以使用forever start server.js來(lái)運(yùn)行你的expres項(xiàng)目，簡(jiǎn)單好用，當(dāng)你想停止下來(lái)debug的時(shí)候就forever stop server.js一下就行

github地址：https://github.com/15331094/translate-wechat-mini-program 
項(xiàng)目下載： translate-wechat-mini-program-master.zip