欢迎您光临深圳塔灯网络科技有限公司!
电话图标 余先生:13699882642

网站百科

为您解码网站建设的点点滴滴

用Nginx实现微信小程序本地SSL请求

发表日期:2018-10 文章编辑:小灯 浏览次数:2826

更新:由于现在小程序IDE已经自带“不校验请求域名以及TSL版本”的功能,不需要在本地配置这些复杂的环境来开发了。但本文依然可以作为在本地模拟生产环境的一种方法。


在11月3日微信小程序发布公测后,相信很多人已经顺利获得资格并拿到appId。但当你把之前的项目换上刚拿到的appId后会发现原来的wx.request和其他请求都不能用了。

image

</figure>

原来,在一个设置过appId的小程序项目里,任何请求url都必须是微信公众平台设置过的域名。你需要登录微信公众平台,在设置 > 开发设置 > 服务器配置中填写域名。注意这里不支持localhost,127.0.0.1等,只支持像example.com这样的真实域名,且需要SSL。

image

</figure>

当把域名配置好后,在小程序IDE里就能给这些域名发送请求了。然而我们并不想每次测试时都部署到服务器上,必须在本地搭建一个合适的开发环境。大致分三步:

1. 修改hosts文件

先找到hosts文件

Mac目录:/etc/hosts
PC目录: C:\Windows\System32\drivers\etc\hosts

然后添加下面这行,将合法域名映射到本地,再保存

127.0.0.1 yourdomain.com

2. 生成自签名SSL证书

首先需要有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移到你想要存放证书的地方。

3. 安装和配置 nginx

接下来需要通过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

4. 测试

根据以上的配置,就可以在小程序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的开发者一些参考。


本页内容由塔灯网络科技有限公司通过网络收集编辑所得,所有资料仅供用户学习参考,本站不拥有所有权,如您认为本网页中由涉嫌抄袭的内容,请及时与我们联系,并提供相关证据,工作人员会在5工作日内联系您,一经查实,本站立刻删除侵权内容。本文链接:https://dengtar.com/20421.html
相关开发语言
 八年  行业经验

多一份参考,总有益处

联系深圳网站公司塔灯网络,免费获得网站建设方案及报价

咨询相关问题或预约面谈,可以通过以下方式与我们联系

业务热线:余经理:13699882642

Copyright ? 2013-2018 Tadeng NetWork Technology Co., LTD. All Rights Reserved.    

  • QQ咨询
  • 在线咨询
  • 官方微信
  • 联系电话
    座机0755-29185426
    手机13699882642
  • 预约上门
  • 返回顶部