小程序本地服务器如何真机调试 • Worktile社区

worktile

Worktile官方账号

小程序本地服务器是指在进行小程序开发时，通过搭建本地服务器来模拟后端接口的开发环境。真机调试是指将开发的小程序在真实的手机上进行测试和调试。

下面是小程序本地服务器真机调试的步骤：

搭建本地服务器：
首先，需要在本地搭建一个服务器环境。可以使用Node.js等工具来搭建一个简单的服务器。具体步骤如下：
a. 安装Node.js：在官网上下载并安装Node.js。
b. 新建一个项目文件夹，使用命令行工具进入该文件夹。
c. 初始化项目：
执行命令：npm init -y
d. 安装express：
执行命令：npm install express –save
e. 创建一个简单的服务器：
在项目文件夹下新建一个index.js文件，并输入以下代码：
```
const express = require('express');
const app = express();

app.get('/', (req, res) => {
  res.send('Hello World!');
});

app.listen(3000, () => {
  console.log('Server started on port 3000');
});
```
f. 启动服务器：
在命令行工具中执行命令：node index.js
服务器就会在本地的3000端口上启动，并监听客户端的请求。
修改小程序开发工具配置：
在小程序开发工具中，点击菜单栏的「详情」按钮，进入「项目配置」页面。
在「请求域名」中添加本地服务器的地址，例如：http://localhost:3000。然后点击「确定」保存修改。
真机调试：
a. 手机连接电脑，打开微信开发者工具，并使用开发者工具生成的二维码在手机上打开小程序。
b. 小程序打开后，就会发送请求到本地服务器。可以在服务器终端上看到请求的日志信息。
c. 在小程序开发工具中进行代码修改，保存后可以立即在手机上看到修改后的效果，方便调试和测试。

通过以上步骤，我们就可以在手机上对小程序进行真机调试了。注意，由于小程序在真机上运行时，会受到网络环境的限制，所以在进行真机调试时，需要确保手机和电脑在同一个局域网中，以保证访问本地服务器的连接正常。

1年前 0条评论

飞飞

Worktile&PingCode市场小伙伴

要在真机上调试小程序本地服务器，可以按照以下步骤进行操作：

准备工作：

确保你的真机和开发机处于同一局域网内。
在小程序开发工具中的项目设置里，勾选“不校验合法域名、web-view（业务域名）、TLS 版本以及 HTTPS 证书”。

获取真机 IP 地址：

在真机上打开设置，选择“Wi-Fi”选项，找到当前所连接的 Wi-Fi 网络，并点击进入。
在打开的 Wi-Fi 详情页面中，可以找到 IP 地址。记录下这个 IP 地址，后面会用到。

修改本地服务器地址：

打开小程序开发工具，找到项目根目录下的app.js文件。
在app.js文件中，找到serverUrl变量，将其值改为http://你的真机IP地址:端口号，端口号可以自定义，默认是 8080。
保存修改。

启动本地服务器：

在开发机上打开终端或命令提示符窗口，进入到项目根目录。
输入命令npm start，启动本地服务器。如果是使用其他工具或语言搭建的本地服务器，请根据实际情况启动。

在真机上启动小程序：

在小程序开发工具中，点击右上角的“预览”按钮，选择“手机预览”。
扫描弹出的二维码，打开微信，进入小程序。

开始调试：

在真机上打开小程序后，可以通过“开发者工具”菜单栏中的“调试”选项来查看网络请求、调试代码等。

值得注意的是，真机调试时，确保你的电脑和设备连接到同一个网络，并且没有防火墙或安全软件阻止了设备和电脑之间的通信。此外，如果使用的是 HTTPS 请求，需要在真机上安装开发机上使用的 HTTPS 证书。

1年前 0条评论

不及物动词

这个人很懒，什么都没有留下～

小程序本地服务器的真机调试可以通过以下步骤进行：

准备工作：
- 确保你已经安装了小程序开发工具，并且已经创建了一个小程序项目。
- 确保手机已经连接到电脑，并且已经开启了开发者模式和USB调试功能。
配置本地服务器：
- 在小程序项目的根目录下，创建一个本地服务器的配置文件，比如server.config.js。
- 在配置文件中进行相关配置，比如指定本地服务器的端口号、SSL证书等。
- 根据具体需求，可以选择使用第三方的本地服务器工具，比如nodemon或者webpack-dev-server来启动本地服务器。
修改项目配置：
- 打开项目的配置文件，比如app.json，在其中添加networkTimeout字段，将其设置为一个较大的值，以防止请求超时。
- 将所有涉及到接口的URL修改为本地服务器的地址，比如http://localhost:3000/api/getData。
启动本地服务器：
- 在命令行中进入小程序项目的根目录，执行启动本地服务器的命令，比如nodemon server.config.js。
- 确保本地服务器已经成功启动，并且没有报错。
打开小程序开发工具：
- 打开小程序开发工具，点击工具栏上的“真机调试”按钮。
- 使用微信扫码登录，并且选择要调试的小程序。
- 确保手机和电脑处于同一局域网中。
配置真机调试：
- 在小程序开发工具中的“真机调试”页面，点击“本地调试”按钮。
- 输入本地服务器的地址，比如http://192.168.0.100:3000。
- 点击“确定”按钮，等待真机调试的配置完成。
开始真机调试：
- 在小程序开发工具中点击“编译”按钮，将小程序代码编译到真机上。
- 在手机上打开微信，进入小程序列表，点击要调试的小程序。
- 确保手机和电脑处于同一局域网中，等待小程序启动并连接到本地服务器。
- 在小程序中进行操作，观察控制台输出和网络请求的结果。

通过上述步骤，就可以在真机上进行小程序本地服务器的调试了。在调试过程中，可以通过查看控制台输出来调试代码逻辑，同时也可以通过查看网络请求的结果来调试接口的调用和数据交互情况。如果需要修改本地服务器的配置，则需要重新启动本地服务器，并且更新小程序项目中涉及到的URL地址。

1年前 0条评论