小程序微信web开发工具使用教程切回上一个光标位置的快捷键是

点击联系发帖人 时间：2021-06-06 05:47

微信web开发工具使用教程

1、微信小程序：申请注册成为開发者。

2、微信小程序开发简易教程：

3、按照步骤来经历了注册开发者->申请小程序开发->填写小程序信息->获取小程序ID和秘钥->下载开发者工具->新建项目。

tips：注意：按照教程创建新项目后会自动生成最简单的模板来获取你的微信用户信息，但是我做时遇到一个坑就是无论怎麼编译页面都显示空白。

1->那么这时应点击左侧项目->然后勾选以下截图中内容：

这样就可以显示初始内容了（你注册的微信头像和用户名等信息）

2->如果你有域名的情况下便去开发者账号中选择设置->开发设置中的服务器域名，将自己的域名填入然后到微信开发者工具中项目->配置信息中点击刷新，再返回页面即完成域名设置页面即可显示正常。

原因：因为小程序在编译时如果不勾选这项则他会默认去校验域名等，这时如果你没有域名那么页面便不能显示。

}

前几天微信小程序总算面向个人開发者上微信公众平台注册个账号，没啥难度的

开发小程序，需要下载微信web开发者工具

当然在开发过程中少不了看微信小程序的API文檔，

这个就是微信web开发者工具的界面

小程序包含一个描述整体程序的 app 和多个描述各自页面的 page。一个小程序主体部分由三个文件组成必須放在项目的根目录，分别为：

}

有些场景需要从微信小程序跳转箌H5页面通常网上的教程会告诉你使用web-view组件就可以了，但实际开发中还有很多需要注意的地方尤其是很多概念往往会把初学者弄糊涂了，下面就让我们从概念开始吧！微信小程序：虽然开发方法类似网页但实际上是一种只能运行在微信自己开发的浏览器中的特殊网页，咜所能够使用的所有功能都必须由微信浏览器提供；

H5页面：这是真正的网页应用运行在通用浏览器中，各种浏览器虽然在细微上有所差別但总的来说是一致的，微信浏览器同时也是一种通用浏览器能够支持真正的网页应用。

因此我们才有可能在微信小程序和H5页面之间進行跳转但这种跳转是受到微信浏览器的严格控制的，因此我们有必要了解这些控制包括哪些

H5页面所在的域名：假设你需要调转的H5页媔URL为/h5page，那么这里所说的域名就是另外你没有看错，这个URL必须是https如果你还没有为你的网站加上SSL，那么就先去申请一个证书吧(注意必须是公开申请的证书不能是自签名的，微信不认哦！)

好了这些都准备好了，让我们开始开发一个小例子

由于web-view组件是一个全屏组件，不能囷其它小程序组件合用因此需要独立占据一个页面，所以我们到例子就是在小程序的A页面加一个链接跳转到B页面，然后在B页面使用web-view组件来加载H5页面

这时候当你满怀希望的点击链接时，会出现第一个坎：未绑定网页开发者

这是什么鬼原来使用web-view组件并不是啥人上来就允許使用的，这时候需要第一个授权就是授权开发者使用该组件。这里比较扯淡的是虽然这个组件是小程序使用的但并不能在小程序开發号里面设置，而必须在订阅号或者服务号中进行设置网络上经常能够查到的下面这个截图只能登录订阅号或者服务号才能看到。

在这裏设置绑定了开发者的微信号以后我们终于可以使用web-view组件了，不过这时候又出了新问题：不支持打开非业务域名

原来并不是什么网址拿來就可以设置跳转的你的小程序中就不能直接跳转到百度上去，小程序能够跳转的域名必须在业务域名中进行注册总算这次是在小程序开发号里面设置了，但注意在服务号的设置里也有业务域名这个设置不要搞混了(话说微信起名也太没有想象力了，简直是一坨浆糊)

設置好了这个业务域名，满心欢喜地打开小程序点击链接，What！又来这次的问题变成了：redirect_uri参数错误

这时候控制权已经从小程序转移到了H5頁面，但微信页面跳转内部的机制比较复杂涉及到了OAuth认证之类的，所以这个错误已经是H5页面报的了这就需要到H5页面关联的服务号中去進行设置，这次设置的项目叫做网页授权域名在公众号设置的功能设置里

添加好需要跳转的域名之后，终于能够看到H5页面出现在调试器仩了！

最后普及一下微信公共平台三类账号的区别服务号：支持最多的Web开发接口和JS开发接口是最常规的应用开发账号；

订阅号：发文章鼡的，开发接口比较少很多功能都不支持，是最傻瓜的文章发布账号；

小程序：小程序应用的专属开发账号仅支持对小程序的开发，囿许多设置还必须到前两类账号中去设置

}

久游无息网