微信小程序访问云服务器接口的详细操作(三步实现)

今天就重点讲述uniapp微信小程序进行访问云服务器JSON接口的相关信息;

如下三步骤:

一：云服务空间的配置

1,HBuilder项目上创建unicloud阿里云服务开发环境

2.在unicloud上右击关联“云服务空间或项目”，如果你有创建则选择，如果没有创建空间项目，那么就“打开unicloud控制台”，创建一个新的服务空间；

如果有：

如果没有服务空间：

3.此时看一看自己的栏目，新建云函数，如：我新建了“testOym”

4.再在这个云函数上创建个js的文件，编写入口方式

这里就以一个登录接口和注册接口为例，如下：

'use strict';


/**
 * @author ArdWang
 * @date 2020 08/27 13:34
 * 用户登录接口
 */

exports.main = async (event, context) => {
	// POST请求
	const params = event["body"]
	
	//参数类型接收
	const args = event['queryStringParameters']['args']
	
	const name = event['queryStringParameters']['username']
	
	const pwd = event['queryStringParameters']['password']
	
	const iphone = event['queryStringParameters']['userphone']
	
	const email = event['queryStringParameters']['useremail']
	
	const usersex = event['queryStringParameters']['usersex']
	
	//返回此登录接口的所有需要的参数数据
	var res
	
	if(args === "LoginUser"){
		res = await uniCloud.httpclient.request('http://你的云服务器公网ip(先确认能8080外网访问到tomcat):8080/RishengOym/RishengMain?action='+args+'&username='+name+'&password='+pwd+'', {
			method: "POST",
			dataType: 'json',
			data: null,
			headers: {
				"Content-Type": "application/json;charset=UTF-8"
			}
		})
	}else if(args === "registerUser"){
		res = await uniCloud.httpclient.request('http://你的云服务器公网ip(先确认能8080外网访问到tomcat):8080/RishengOym/RishengMain?action='+args+'&username='+name+'&password='+pwd+'&usersex='+usersex+'&userphone='+iphone+'&useremail='+email+'',{
			method: "POST",
			dataType: 'json',
			data: null,
			headers: {
				"Content-Type": "application/json;charset=UTF-8"
			}
		})
	}
	
	console.log("res:"+res)
	
	if (res === undefined || res === null) {
		return {
			"code":1002,
			"message":"服务器开了点小差,请稍等一下!",
			"data":null
		}
	}else{
		//返回数据给客户端
		return {
			"code":res.data['code'],
			"message":res.data['msg'],
			"data":res.data['items']
		}
		
	}
};

5.编写好js的返回数据后，就右击进行上传到服务空间列表

6.云服务空间此列表云函数的详细信息，下面那个uir就是给予前端请求的路径。

二：uniapp小程序请求的方法

两个动态参数：

• this.userName账号
• this.passWord密码

async onLogin() {
				uni.showLoading({
					title: "登录中..."
				})
				let result = await uni.request({
					url: 'https://云服务空间的路径.bspapp.com/testOym?args=LoginUser&username=' +
						this.userName + '&password=' + this.passWord + '',
				});
				let [err, res] = result;
				if (res.data.code == 200) {
					uni.setStorageSync('SUCCESSLOGIN', "1")
					uni.switchTab({
						url: '../index/index',
					});
					console.log("11==", res.data.code)
					uni.hideLoading()
				} else {

					this.$refs.popupMessage.open()
					console.log("22==", res.data.code)
					uni.hideLoading()
				}
				}

三.进行微信公众号小程序的服务器配置

1.公众号小程序点击开发设置

2.服务器域名的配置

3.postman进行测试接口(注册接口数据)