新闻资讯

微信小程序开发教程解析,如何解决微信小程序访问难题?

2020-11-6

对近年来小程序异常火爆,各公司、商家也随着互联网的洪流,加入到了小程序的队伍中来,小程序的火爆和广泛应用是一个必然趋势,前景广阔,而越早加入也就越意味着能够抢占先机。本文小编就带大家了解微信小程序开发教程以及关于解决微信小程序访问难题的相关知识。

微信小程序开发教程解析

第一,搜索微信公众号进行注册登录

第二,微信公众号平台左下方点击小程序管理

第三,点击添加

第四,点击快速认证小程序

然后完成填写注册信息

之后就是新建小程序项目了

先安装微信开发工具,进入官网可找到开发工具

然后打开微信开发者工具,扫码,手机确认登录。

之后选择小程序项目选择/创建目录,填写已有的appid。

最后点击确定,进入小程序开发界面,编写代码,左边区域属于模拟器区,右边区域是编辑区。

如何解决微信小程序访问难题?

按照微信小程序的要求,在正式环境,每个微信小程序需要事先设置一个通讯域名,小程序可以跟指定的域名与进行网络通信。此外,服务器域名需要在小程序后台-设置-开发设置-服务器域名中进行配置,但是对于开发环境,要求相对不是特别严格。但是,在真机测试的时候,依然需要外网访问开发计算机。必须特别注意的是,开发环境网络访问不能使用localhost。localhost指的是开发计算机,微信小程序是在手机的环境工作的,不是开发计算机。手机的微信小程序localhost是不能访问开发计算机的。

解决这个问题,就需要使用花生壳的两个技术支持:1.域名,2.端口映射

操作步骤:
1、以IIS为例,首先确保本地局域网正常访问。打开浏览器测试访问本地建立的网站是否正常;

2、访问https://hsk.oray.com/ ,点击右上角注册账号;

3、点击导航栏“下载”按钮,下载安装花生壳程序;

4、安装登录花生壳程序;

5、登录成功后,点击右下角“+”,添加内网映射

① 应用名称:自定义填写;

② 映射类型:选择HTTPS;

③ 外网域名:选择已购买HTTPS配件的顶级域名;

④ 内网主机:填写IIS服务器的本地局域网IP;

⑤ 内网端口:填写IIS的HTTP端口;

最后点击保存,映射添加成功。

注意:因微信扫描机制严格不建议使用壳域名用作微信推广,为防止受到影响,请使用顶级域名

6、可以看到生成的外网访问地址:https://域名

7、通过生成的外网访问地址,即可在外网访问了,网络环境准备完毕。

8、我们定义一个test.txt文件充当服务端相应数据。将这个文件部署到网站。使用浏览器访问,可以看到test.txt。这表示IIS和花生壳工作正常。

9、打开微信小程序。

注意:微信小程序要求使用https,但是,现在是开发阶段,我们可以选择“不校验合法域名、web-view(业务域名)、TLS 版本以及 HTTPS 证书”。

微信小程序有部分接口明确要求必须使用https的443端口,利用花生壳可以方便的解决这个问题。

现在可以编写微信小程序。

(1)wxml文件

(2)js文件

(3)执行效果

10、真机测试,点击“预览”

11、扫面二维码,在手机看到访问效果。

微信小程序开发环境的网络访问的难题是,在真机测试的时候,需要外网访问开发计算机。花生壳解决的是外网访问问题,利用花生壳提供的域名实现外网访问,实现真机测试访问开发计算机的需求。