欢迎来到258分享网,纯净的网络源码分享基地!

258资源分享网

全部作品
全部作品
网站源码
微信源码
素材特效
源码插件
视频教程
建站学院
热门搜索: 织梦  农业种植  农业  安全设置  官方
258资源分享 > 建站学院 > 微信开发 > Mac下搭建小程序服务器的过程

推荐下载

HTML5响应式自适应网咯设计

2020-05-12   浏览:740

高端HTML5响应式企业通用网

2020-05-06   浏览:521

html5响应式外贸网站英文版

2020-05-08   浏览:510

HTML5自适应律师工作室类网

2020-04-04   浏览:504

HTML5影视传媒文化公司类网

2020-05-12   浏览:502

Mac下搭建小程序服务器的过程

发布时间:2020-11-12  

问题的提出

Mac环境

方便快捷地搭建小程序的测试服务器

小程序对于网络请求的URL的特殊要求

不能出现端口号

不能用localhost

必须用https

主要步骤

用json-server搭建简单的服务器,搭建出来的服务器地址为localhonst:3000

安装nginx进行反向代理,以便隐藏端口号和替换localhost

搭建https服务

微信小程序设置

用到的工具

json-server

nginx

openssl

微信小程序官方开发工具

json-server的使用

安装

sudo npm install -g json-server

选一个文件目录新建json文件,比如cars.json

{ "cars": [ { "id": 1, "desc": "哈弗H6", "completed": false }, { "id": 2, "desc": "吉利博越", "completed": false }, { "id": 3, "desc": "宝骏560", "completed": false } ] }

启动json-server服务:在新建的json文件目录,运行命令:json-server + 文件名

json-server cars.json

输出:

Loading cars.json Done Resources :3000/cars Home :3000

浏览器中输入地址:3000/cars就能看到输出cars.json的内容

至此,就搭建了一个简单的本地测试服务器,json-server支持get,post等,基本足够开发测试用了,具体的可以参考json-server官网

为了将localhost:3000/todos这样的接口改成这样的形式,就需要用nginx进行反向代理

用nginx进行反向代理

安装nginx

brew install nginx

通过以上方式安装nginx,我的nginx路径在/usr/local/etc/nginx

浏览器中键入:8080,访问到nginx的欢迎界面,即表示nginx安装成功

配置nginx的反向代理:编辑nginx.conf文件

vi /usr/local/etc/nginx/nginx.conf

修改nginx.conf文件中的server{}内容。这里要注意的是,conf文件里面主要有2个server{},一个是默认监听http请求的8080端口的,另一个是https请求的。其中https server默认是注释掉的

server { listen 80;//将原来的8080改成80端口,这样就能隐藏请求中的端口号了 server_name ;//这里改成你想要的测试域名 server_name_in_redirect off; proxy_set_header Host $host:$server_port; proxy_set_header X-Real-IP $remote_addr; proxy_set_header REMOTE-HOST $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; location / { proxy_pass :3000/;//需要代理的地址,这里是我们json-server的默认地址 } }

重启nginx服务

sudo nginx -s reload //不带sudo可能会重启nginx失败

不要忘记将你的测试域名加入到hosts文件中啊!!!

//hosts文件中添加测试域名 127.0.0.1

经过以上的设置,nginx代理的设置的完成了。启动json-server后可以用一下方式访问浏览器

localhost/cars localhost

其他问题

nginx常用的命令

//启动 nginx //重启 sudo nginx -s reload //关闭 nginx -s stop

Mac修改hosts

Finder的“前往”->“前往文件夹” 输入 /private/etc 按回车 就可以看到里面的hosts文件了。直接右键选择“文本编辑”打开,修改,保存即可。

配置nginx碰到FT_Select_size:undefined问题

可以尝试安装fontconfig库解决

碰到其他的文件不存在之类的问题,请仔细检查命令是否输入正确,配置文件是否修改正确

https服务安装

利用openssl生成证书

cd usr/local/etc/nginx/conf 设置server.key:openssl genrsa -des3 -out server.key 1024 参数设置:openssl req -new -key server.key -out server.csr 写RSA秘钥:openssl rsa -in server.key -out server_nopwd.key 获取私钥:openssl x509 -req -days 365 -in server.csr -signkey server_nopwd.key -out server.crt

修改nginx配置文件nginx.conf

server { listen 80;//将原来的8080改成80端口,这样就能隐藏请求中的端口号了 server_name ;//这里改成你想要的测试域名 //主要是增加下面三行 ssl on; ssl_certificate /usr/local/etc/nginx/server.crt;//你的证书地址 ssl_certificate_key /usr/local/etc/nginx/server_nopwd.key;//私钥地址 server_name_in_redirect off; proxy_set_header Host $host:$server_port; proxy_set_header X-Real-IP $remote_addr; proxy_set_header REMOTE-HOST $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; location / { proxy_pass :3000/;//需要代理的地址,这里是我们json-server的默认地址 } }

以上配置以后,用访问浏览器会出现400 bad request的问题,用https://www.test.com/cars又会出现net::ERR_CONNECTION_REFUSED

继续修改nginx.conf,主要是修改https server{}模块,主要修改点:

将https server{}模块注释去掉

添加ssl相关配置

添加代理设置

本文标签

: