安装nginx
环境:macos
mac环境下是使用的brew安装nginx
1.终端输入 brew search nginx 查找nginx
2.安装指令 brew install nginx
安装完成后会在终端中看到一些nginx的安装信息
3.配置nginx
3.1 终端下进入目录 cd /usr/local/
3.2 打开nginx配置文件所在目录 open nginx/
配置文件为 nginx.conf
3.4 启动nginx 指令为:
brew services start nginx
重启指令:
brew services restart nginx
到此nginx安装完毕
下面介绍利用nginx解决前端页面访问后端接口跨域问题
跨域问题配置
1.进入目录 /usr/local/nginx ,修改配置文件nginx.conf,关键配置内容如下
listen 80; #原为8080,避免冲突,更改为80
server_name localhost;
#charset koi8-r;
#access_log logs/host.access.log main;
location / {
proxy_pass http://127.0.0.1:8848; # 前端静态页面地址,本人使用的HBuilderX编辑器,其工程默认端口为8848,可根据自己的项目情况修改
proxy_redirect default;
#设置主机头和客户端真实地址,以便服务器获取客户端真实IP
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
location /apis { # 自定义nginx接口前缀
rewrite ^/apis/(.*)$ /$1 break; # 监听所有/apis前缀,是则转发后台api接口地址
include uwsgi_params;
proxy_pass http://127.0.0.1:9099; # 后台api接口地址
#设置主机头和客户端真实地址,以便服务器获取客户端真实IP
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
保存配置后,终端输入指令 brew services restart nginx 重启nginx
注:如果启动失败报错需要超级管理员权限,可先在终端输入sudo -s 以管理员身份执行后续重启操作
相应的前端ajax调用接口地址改为如下
$.ajax({
type:"POST",
url:"/apis/xxx/xxx",//根据监听的apis前缀,指向后端接口
data:{'xxx':'xxx'},
success:function (data) {
}
最后浏览器地址栏输入自己的前端工程地址 http://127.0.0.1:80/projectname/xxx.html
文末小福利免费视频资源网站:www.sousuohou.com |