微信小程序如何搭建自己的後臺（超詳細，超完整）（上線必備）！！！

首先，今天是個特殊的日子，請讓我先說上一句：幸運女神在微笑

 

思路

①：首先我們需要擁有自己的 AppID  （有點廢話了）。

②：我們需要有一個後臺，即服務器。域名（需備案）。ssl證書。（總之，我們需要通過https://www.xxxxxx.com這樣的形式去訪問到我們服務器）

③：在微信公衆平臺中配置域名信息。

④：小程序端通過wx.request()函數訪問我們的後臺函數，後臺接受小程序傳來的參數，經過加工後返回給小程序值，小程序端再接收後臺傳來的參數並進行操作。

 

過程

獲取AppID：

微信公衆平臺

 

服務器、域名（需備案）、ssl證書（可免費申請）：

樓主這裏用的是騰訊雲服務器：騰訊雲

 

域名備案：

域名備案

 

SSL證書（申請與安裝配置）：

證書申請

安裝配置（樓主這裏是windows+Apache環境下配置SSL證書，如有其它環境安裝，可以參考證書安裝）：

將你的SSL證書下載下來，將Apache文件夾下的3個文件放到Apache目錄下的conf文件夾裏

在你的Apache目錄中找到\conf\httpd.conf並打開,找到如下兩行，將這兩行前面的註釋符號 # 去掉。（如果沒有，直接把#號去掉插入文件中）

# LoadModule ssl_module modules/mod_ssl.so
# Include conf/extra/httpd-ssl.conf

在你的Apache目錄中找到\conf\extra\httpd-ssl.conf，在文件最後面找到 <VirtualHost _default_:443> 與 </VirtualHost>

用下列代碼替代這兩行之間的所有代碼（請將代碼中////及其後面的文字刪掉）：

<VirtualHost _default_:443>
DocumentRoot "C:\AppServ\www"  ////你的網站物理地址，即訪問你的域名你想展示的頁面
ServerName www.data-ordertime.xyz  ////你的網站域名
ServerAlias data-ordertime.xyz  ////你的網站域名 不加www
ServerAdmin [email protected]  ////你的郵箱
DirectoryIndex index.html index.htm index.php default.php app.php u.php
ErrorLog logs/example_error.log
CustomLog logs/example_access.log \
"%t %h %{SSL_PROTOCOL}x %{SSL_CIPHER}x \"%r\" %b"
SSLEngine on
SSLCertificateFile conf/2_data-ordertime.xyz.crt  ////你申請的證書文件的地址
SSLCertificateKeyFile conf/3_data-ordertime.xyz.key  ////你申請的key文件的地址
<Directory "sslroot/">
SSLOptions +StdEnvVars
AllowOverride All
Require all granted
</Directory>
<FilesMatch "\.(shtml|phtml|php)$">
SSLOptions +StdEnvVars
</FilesMatch>
BrowserMatch "MSIE [2-5]" \
nokeepalive ssl-unclean-shutdown \
downgrade-1.0 force-response-1.0
</VirtualHost>

 

微信公衆平臺中配置域名信息：

此時，在微信開發者工具中該域名會認爲是安全可用域名（注意，我們是爲了下面二圖中項目設置中 不校驗合法域名 選項不被勾上也可以訪問我們的後臺，因爲我們域名理論上的安全（http與https的差異））

      

                                                             

 

小Demo測試一下（樓主這裏使用的爲PHP後臺）：

微信開發者工具中寫入如下代碼，

index.js

//index.js

Page({
  data: {
  },
  
  ceshifuwuqi:function(){
    
    var that = this
    wx.request({
      url: `https://www.data-ordertime.xyz/wxdemo.php`,//你的後臺url地址
      data:{
        name:'超超1號'
      },
      header: {
        'content-type': 'application/x-www-form-urlencoded'
      },
      method: "GET",
      success(result) {
        console.log(result);
        that.setData({
          demo: result.data
        })
      },
      fail(error) {
        util.showModel('請求失敗', error);
        console.log('request fail', error);
      }
    })
  },

  
})

index.wxml

<!--index.wxml-->
<view class="container">
  
  <view bindtap='ceshifuwuqi'>點擊測試服務器
  <view>{{demo}}</view></view>
  
</view>

後臺代碼：

<?php
$myName = $_GET['name'];  //GET方式獲取傳來的name參數
echo $myName."真帥";  

結果展示：

                 

 

 

你可能遇到的問題

該部分樓主持續更新，時間關係先空着發佈了，過程中有疑問或問題也可以留言哦~