博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
微信公众号网页开发——实用真机调试
阅读量:6258 次
发布时间:2019-06-22

本文共 986 字,大约阅读时间需要 3 分钟。

前言

微信公众号网页开发的真机调试一直是很头疼的事情。

原因一

微信公众号配置的JS安全域名只有三个,一个大中型的公众号这三个JS安全域名都是生产的域名,不可能预留域名用于开发和调试。

原因二

在微信里面只有访问正确的安全域名才能调用wx.config用来调用微信的接口。调试器和真机有差异。

原因三

在实际的开发中我们不可能写一部分代码上传到生产的服务器上再用真机调试,这样是非常麻烦的事情。

解决方案

通过微信里面的链接访问本地的前端服务进行真机调试。

step1

假如我们用vue-cli3.0作为开发框架,我们需要把端口号改成80端口,则需要配置vue.config.js里面的devServer。

devServer: {    port: 80, // 前端服务端口    disableHostCheck: true,    proxy: { // 转发配置      '/evcard-ams/api': {        target: 'http://csms-st.vip:180', // 测试或者开发服务器        ws: true,        changeOrigin: true,        pathRewrite: {          '^/evcard-ams/api': '/evcard-ams/api',        },      },    },  },复制代码

我们在安装好依赖包后,npm run dev的时候终端会显示出本地ID。在终端运行IPconfig也可以获取到。

图片中 10.2.11.150 是本地IP地址。

step2

改变 hosts 文件

hosts的文件目录 C:\Windows\System32\drivers\etc

这样本地可以 访问 csms.xxx.vip/you-app-name 就可以访问前端项目了。

step3

安装

如图进行设置 将端口号设置成8888

step4

手机和电脑必须在同一个局域网下面,手动更改手机代理。

10.2.11.150 是电脑的本地IP地址, 8888 是Fiddler的端口地址。

step5

现在 手机微信里面 访问 就会访问电脑上的前端服务,并且是热重载。通过更改前端服务器的转发地址就可以变化访问后端服务器。 这样就很方便调试了。

转载地址:http://ptasa.baihongyu.com/

你可能感兴趣的文章
source insight中文显示和处理
查看>>
spring3.1, hibernate4.1 配置备份,struts2.2.1,sitemesh 2.4.2
查看>>
python字符串格式化输出的方式
查看>>
buffer busy waits等待事件
查看>>
MySQL版本之分:Community Server、Embedded Server、Enterprise Server
查看>>
JVM及遗传算法,转摘牛人牛文
查看>>
C#用DataTable实现Group by数据统计
查看>>
iframe如何刷新的三种解决方案
查看>>
每日英语:Fewer Foreigners Eye US Graduate Science Programs
查看>>
Socket异步通信——使用IAsyncResult
查看>>
宋体、构造函数-浅出C++对象模型——理解构造函数、析构函数执行顺序-by小雨...
查看>>
我眼中的sencha touch(2013网页装在兜里)
查看>>
函数分组学通MongoDB——第三天 细说高级操作
查看>>
Windows程序设计_18_程序加载过程
查看>>
安装内容[Python]第三方库-Scrapy入门使用
查看>>
关闭web.config的继承
查看>>
一键让应用程序适配 iphone5
查看>>
http 长连接和轮询
查看>>
Windows CE 6.0的安装,简单定制和导出SDK--转载
查看>>
在Windows Server 2008 R2上安装Exchange 2013过程中遇到的一些问题
查看>>