微信小程序開發基礎
1、不校驗域名安全性
大家在剛開始開發的時候一般都沒有自己的服務器及域名，所以大家在本地編寫的時候，在“詳細”下的“項目設置”里面將“不校驗域名安全性”勾選。
2、了解wx.request(OBJECT)
可先閱讀官方文檔
OBJECT參數說明：
success返回參數說明：
data 數據說明：
最終發送給服務器的數據是 String 類型，如果傳入的 data 不是 String 類型，會被轉換成 String 。轉換規則如下：
對于 header['content-type'] 為 application/json 的數據，會對數據進行 JSON 序列化
對于 header['content-type'] 為 application/x-www-form-urlencoded 的數據，會將數據轉換成 query string （encodeURIComponent(k)=encodeURIComponent(v)&encodeURIComponent(k)=encodeURIComponent(v)...）
3、.json文件不能為空
必須加上{}
三、Java后端編寫
主要框架springboot，開發工具idea，服務器阿里云服務器。
1、創建一個maven項目，導入相關依賴：
復制代碼
<!-- 統一版本控制 -->
<parent>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-parent</artifactId>
<version>2.2.1.RELEASE</version>
<relativePath/> <!-- lookup parent from repository -->
</parent>
復制代碼
復制代碼
<dependencies>
<!-- freemarker渲染頁面 -->
<!-- https://mvnrepository.com/artifact/org.springframework.boot/spring-boot-starter-freemarker -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-freemarker</artifactId>
</dependency>
<!-- spring boot 核心 -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<!-- springboot整合jsp -->
<!-- tomcat 的支持. -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
<exclusions>
<exclusion>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-tomcat</artifactId>
</exclusion>
</exclusions>
</dependency>
<dependency>
<groupId>org.apache.tomcat.embed</groupId>
<artifactId>tomcat-embed-jasper</artifactId>
</dependency>
</dependencies>
復制代碼
2、創建application.yml文件，修改一些配置參數等
server:
port: 8083
ssl:
key-store: classoath:xxxxxx.pfx
key-store-password: xxxxxx
key-store-type: xxxxxx
在實際項目中可能涉及數據庫，還要整合mybatis，在文章中，僅僅做測試就不做使用數據庫的測試
3、首先修改springboot的啟動程序：
復制代碼
package com.wx.m3;
@ComponentScan(basePackages= "com.wx.m3")//添加掃包@ComponentScan(basePackages= "")
@EnableAutoConfiguration
public class M3Application {
public static void main(String[] args) {
SpringApplication.run(M3Application.class, args);
}
}
復制代碼
啟動項目時直接右擊run即可
4、在寫一個測試的controller進行微信小程序與java后端實現通信，controller代碼如下：
復制代碼
@RestController
@SpringBootApplication
public class IndexController {
@RequestMapping("getUser")
public Map<String,Object> getUser(){
System.out.println("微信小程序正在調用...");
Map<String,Object> map = new HashMap<String, Object>();
List<String> list = new ArrayList<String>();
list.add("Amy");
list.add("Cathy");
map.put("list",list);
System.out.println("微信小程序調用完成...");
return map;
}
@RequestMapping("")
public String getTest(){
return "Hello world";
}
}
復制代碼
至此簡易的后端框架基本完成
說明：@RestController與Controller注解的區別
@RestController相當于它能實現將后端得到的數據在前端頁面（網頁）中以json串的形式傳遞。
微信小程序與后臺數據之間的數據傳遞就是以json報文的形式傳遞。這也是選擇springboot框架開發小程序后臺的主要原因之一，可以方便進行小程序后套開發
四、小程序發起網絡請求
下面以一個簡單的按鈕請求數據為例：
hello.wxml文件：
<button bindtap='houduanButton1'>點擊發起請求</button>
<view wx:for="{{list}}">
姓名：{{item}}
</view>
hello.js文件：
復制代碼
Page({
data:{
list: ''
},
houduanButton1:function(){
var that = this;
wx.request({
url: 'http://localhost:8083/getUser',
method: 'GET',
header: {
'content-type':'application/json'
},
success: function(res){
console.log(res.data);
var list = res.data.list;
if(list == null) {
var toastText = '數據獲取失敗';
wx.showToast({
title: toastText,
icon: '',
duration: 2000
});
} else{
that.setData({
list: list
})
}
}
})
}
})
本站文章版權歸原作者及原出處所有 。內容為作者個人觀點， 并不代表本站贊同其觀點和對其真實性負責，本站只提供參考并不構成任何投資及應用建議。本站是一個個人學習交流的平臺，網站上部分文章為轉載，并不用于任何商業目的，我們已經盡可能的對作者和來源進行了通告，但是能力有限或疏忽，造成漏登，請及時聯系我們，我們將根據著作權人的要求，立即更正或者刪除有關內容。本站擁有對此聲明的最終解釋權。
