如何让HBuilderX开发工具创建的uni-app项目调试运行在你的手机上，我们不需要安装手机模拟器调试运行程序

演示源码下载地址：

链接：https://pan.baidu.com/s/1d5tEaCC1lku-SMI7QxRhHA
提取码：59lc

演示项目目录结构如下图所示：

我的手机型号是vivo X20,刚在天猫上买了一条原装的手机usb数据线,直接使用这条原装的数据线将我的手机连接到电脑上

开启手机开发模式：设置 ---> 更多设置 ---> 关于手机 ---> Android 版本 8.1.0 这行上快速连续单击7次

返回到更多设置页，你会发现出现了“开发者选项”

此时HBuilder X开发工具里面是无法识别我的手机的

我让开发工具HBuilderX识别手机的办法是在我的电脑上和手机上先后安装360手机助手来解决问题

http://sj.360.cn/index.html

 电脑上安装360手机助手成功后，我们会看到下面这样的界面效果

 我们使用手机扫码下载安装360手机助手

 

 

 

 

 

 

 

 

 正式进入 电脑端360助手 去连接 手机360端助手

 

上图表示手机端360助手还没有打开，随后我们可以打开手机360助手并且授权软件可以使用 ，

成功通过USB连接截图如下：

在点击运行-[设备：Android-26dcd9]-[yuedu] 后，在你的手机上立即出现要求你安装HBuilder这个工具的手机版到你的手机上

 

 演示项目成功地返回登录成功信息如下：

 

 我们只修改一下login.vue的login代码

<template>
	<view>
		login ...
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		onLoad: function(e) {
			// #ifdef APP-PLUS
			uni.login({
				success: (res) => {
					uni.getUserInfo({
						success: function(info) {
							console.log(info);
						},
						fail: () => {
							uni.showToast({
								title: '微信登录授权失败'
							});
						}
					})
				},
				fail: () => {
					uni.showToast({
						title: '微信登录授权失败'
					});
				}
			});
			// #endif
		},
		methods: {

		}
	}
</script>

<style>

</style>

 

再一次点击运行-[设备：Android-26dcd9]-[yuedu] 后

我们立即会看到手机启动页面是像下面这样的

成功登录后显示用户信息如下：

 

 

在开发过程中，我们如何让手机调用台式机或者笔记本上的api数据接口呢？

1.我们要保证的手机和电脑在同一个网段里 —— 通常的办法是将台式电脑与手机都连接同一个wifi上；

2.我们还可以在台式电脑或者笔记电脑上安装花生壳软件，让你的台式电脑或者笔记本电脑作为一个网站服务器

  利用花生壳软件的内网穿透功能，将台式电脑或者笔记电脑上的api数据接口发布到公网上，这样手机就能访问了

 

 3. 配置路由器的NAT也可以将内网电脑作为网站服务器来使用，请先看看自己的路由是否具备这样的功能设置

你喜欢哪种方式就选择哪种方式，不花钱的办法就是让你的手机和电脑同时去蹭同一个邻居家的wifi

如果你身边没有手机或者手机数据线，那就使用像下面这样的软件模拟器调试项目吧

如何把MuMu模拟器集成到HBuilderX开发工具里？