发表日期:2018-10 文章编辑:小灯 浏览次数:2914
更新:由于现在小程序IDE已经自带“不校验请求域名以及TSL版本”的功能,不需要在本地配置这些复杂的环境来开发了。但本文依然可以作为在本地模拟生产环境的一种方法。
在11月3日微信小程序发布公测后,相信很多人已经顺利获得资格并拿到appId。但当你把之前的项目换上刚拿到的appId后会发现原来的wx.request和其他请求都不能用了。
</figure>
原来,在一个设置过appId的小程序项目里,任何请求url都必须是微信公众平台设置过的域名。你需要登录微信公众平台,在设置 > 开发设置 > 服务器配置中填写域名。注意这里不支持localhost,127.0.0.1等,只支持像example.com这样的真实域名,且需要SSL。
</figure>
当把域名配置好后,在小程序IDE里就能给这些域名发送请求了。然而我们并不想每次测试时都部署到服务器上,必须在本地搭建一个合适的开发环境。大致分三步:
先找到hosts文件
Mac目录:/etc/hosts
PC目录: C:\Windows\System32\drivers\etc\hosts
然后添加下面这行,将合法域名映射到本地,再保存
127.0.0.1 yourdomain.com
首先需要有OpenSSL。Mac是自带的,无须再安装;PC可以使用git-bash这类工具
这是生成自签名证书的教程 How to create a self-signed Certificate,下面是我简化的版本,如果懒得看英文原版可以直接往下看。
打开命令行:
1. 生成Private Key
输入命令 openssl genrsa -des3 -out server.key 1024
2. 生成CSR (Certificate Signing Request)
输入命令 openssl req -new -key server.key -out server.csr
然后根据提示依次输入信息,域名不要填错
3. 移除Passphrase
cp server.key http://server.key.org
openssl rsa -in http://server.key.org -out server.key
4.生成自签名证书
openssl x509 -req -days 365 -in server.csr -signkey server.key -out server.crt
完成了以上4步后,将server.crt和server.key移到你想要存放证书的地方。
接下来需要通过nginx来载入SSL证书 ,这样就可以向本地服务器发送https请求了。
Mac命令行运行brew install nginx来安装,如果不知道brew是什么可以搜下HomeBrew。PC上可以直接下载Nginx安装包 nginx for Windows
然后修改nginx配置文件,在Mac的路径是/usr/local/etc/nginx/nginx.conf,在PC的路径是你的安装路径,里面找nginx.conf这个文件。打开后在此添加一个server,并将刚才生成的crt和key目录放在相应的位置,如下:
server { listen 443 ssl; ssl_certificate /ssl/server.crt; # 刚生成的crt ssl_certificate_key /ssl/server.key; # 刚生成的key server_name yourdomain.com; # 你的域名 ssl_session_cache shared:SSL:1m; ssl_session_timeout 5m; ssl_protocols SSLv3 TLSv1; location / { proxy_pass http://127.0.0.1:3000; # 本地服务器地址及端口 proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header Host $host; proxy_set_header X-Forward-Proto https; proxy_http_version 1.1; # for websocket proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection "upgrade"; }}
改完保存,并运行nginx。
Mac:sudo nginx
PC:直接双击安装目录下nginx.exe
根据以上的配置,就可以在小程序IDE直接向本地域名发送https请求了。此请求会发送到 http://127.0.0.1:3000/login
wx.request({ url: 'https://yourdomain.com/login', data: {}, method: 'GET', // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT success: function(res){ // success } })
完毕,这就是如何搭建小程序在本地模拟请求远程https服务器的方法 。希望能给刚拿到小程序appId的开发者一些参考。
日期:2018-04 浏览次数:6759
日期:2017-02 浏览次数:3434
日期:2017-09 浏览次数:3652
日期:2017-12 浏览次数:3524
日期:2018-12 浏览次数:4813
日期:2016-12 浏览次数:4579
日期:2017-07 浏览次数:13641
日期:2017-12 浏览次数:3504
日期:2018-06 浏览次数:4263
日期:2018-05 浏览次数:4442
日期:2017-12 浏览次数:3554
日期:2017-06 浏览次数:3978
日期:2018-01 浏览次数:3939
日期:2016-12 浏览次数:3906
日期:2018-08 浏览次数:4422
日期:2017-12 浏览次数:3702
日期:2016-09 浏览次数:6402
日期:2018-07 浏览次数:3204
日期:2016-12 浏览次数:3226
日期:2018-10 浏览次数:3376
日期:2018-10 浏览次数:3476
日期:2018-09 浏览次数:3574
日期:2018-02 浏览次数:3593
日期:2015-05 浏览次数:3516
日期:2018-09 浏览次数:3302
日期:2018-06 浏览次数:3432
日期:2017-02 浏览次数:3867
日期:2018-02 浏览次数:4333
日期:2018-02 浏览次数:4169
日期:2016-12 浏览次数:3570
Copyright ? 2013-2018 Tadeng NetWork Technology Co., LTD. All Rights Reserved.