微信公众号开发流程配置
微信公众号的基本配置选项中:
1, 获取appId和appSecret(如果查看不到, 可以选择重置, 获取之前开发项目中查找).
2, 设置白名单: 设置访问接口的ip地址
微信公众号的公众号设置的功能配置下:
1, 设置JS安全回调域名
2, 设置网页授权域名
注: 需要下载安全文件到web工程根目录下, 并且项目发布到服务器中.
React 开发
react脚手架创建项目:
npx create-react-app my-app // npx 并不是拼写错误
cd my-app
npm start
配置package.json, 一下是我常用的需要用的格式
"antd-mobile": "^2.2.13",
"axios": "^0.18.0",
"moment": "^2.24.0",
"query-string": "^6.5.0",
"react-loadable": "^5.5.0",
"react-router-dom": "^5.0.0",
"react": "^16.8.6",
"react-dom": "^16.8.6",
"react-scripts": "3.0.1"
设置字体:
项目的src目录下 创建fonts文件夹, 将字体文件放入其中
index.css文件下, 设置
@font-face {
font-family: 'myFont';
src: url('./fonts/字体名称.tff);
}
内网穿透
在微信端web开发工具调试程序有时候不如直接在真机上来的真实, 毕竟到真机上也会有各种问题, 在开发者工具上看不到
通过ssh端口转发实现内网穿透, 想要实现效果: 本地服务为http://127.0.0.1:3000, 服务器为xx.xx.xx.xx的ip地址, 通过服务器监听8080端口, 通过访问xx.xx.xx.xx:8080直接访问到http://127.0.0.1:3000上面, 也就是说本地访问http://127.0.0.1:3000相当于访问xx.xx.xx.xx:8080这个地址了. 方便调试啊.
ssh -R 8080:127.0.0.1:3000 root@xx.xx.xx.xx
输入登入密码
常见问题
1, 微信授权获取用户昵称, 头像, 需要通过sessionStorage存储授权状态
2, 授权之后根据window.location.search获取code 获取用户信息
3, 如调用了js-SDK 需要对其进行授权操作, 配置wx.config文件
4, 配置wx.config文件报错: 一般问题有: 后台设置JS完全域名与当前域名不一致.