mac 苍穹外卖 前端环境配置

博主的 mac 是 m2。

结合以下两篇,成功配置前端环境。

macOS 配置苍穹外卖前端环境_macbook怎么nginx下载外卖-CSDN博客

苍穹外卖-Mac配置前端开发环境_sudo 启动 nginx 有什么区别-CSDN博客

一、安装nginx

我使用的是 homebrew,homebrew 的安装请自行搜索。

bash 复制代码
brew install nginx

我的安装目录是:/opt/homebrew/Cellar/nginx

配置文件在:/opt/homebrew/etc/nginx

二、启动 nginx

bash 复制代码
brew services start nginx

三、配置 nginx

修改nginx.conf文件,我的在/opt/homebrew/etc/nginx/nginx.conf

bash 复制代码
vim /opt/homebrew/etc/nginx/nginx.conf #使用 vim 进入 nginx.conf文件

确保在 命令状态(如果不在,按 esc 键),键入 ggdG 快速删除原文件的内容

bash 复制代码
ggdG #快速删除文件中的所有内容

粘贴以下内容(配置文件配置的端口是80,有大佬说是为了不和后端的8080端口冲突)

bash 复制代码
worker_processes  1;
events {
    worker_connections  1024;
}
http {
    include       mime.types;
    default_type  application/octet-stream;

    sendfile        on;

    keepalive_timeout  65;
	map $http_upgrade $connection_upgrade{
		default upgrade;
		'' close;
	}
	upstream webservers{
	  server 127.0.0.1:8080 weight=90 ;
	  #server 127.0.0.1:8088 weight=10 ;
	}
    server {
        listen       80;
        server_name  localhost;

        location / {
            root   html/sky;
            index  index.html index.htm;
        }

        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }
        # 反向代理,处理管理端发送的请求
        location /api/ {
			proxy_pass   http://localhost:8080/admin/;
            #proxy_pass   http://webservers/admin/;
        }
		
		# 反向代理,处理用户端发送的请求
        location /user/ {
            proxy_pass   http://webservers/user/;
        }
		
		# WebSocket
		location /ws/ {
            proxy_pass   http://webservers/ws/;
			proxy_http_version 1.1;
			proxy_read_timeout 3600s;
			proxy_set_header Upgrade $http_upgrade;
			proxy_set_header Connection "$connection_upgrade";
        }
    }
}

保存退出

重新加载配置文件

bash 复制代码
sudo /opt/homebrew/bin/nginx -s reload

四、复制文件到对应位置

查看版本,下面的路径要用到

bash 复制代码
ls /opt/homebrew/Cellar/nginx

我的是1.27.4

苍穹外卖的资料通过黑马程序员的公众号自己找一下可以找到,请自行搜索。资料里有多个文件,目前我只下载了 资料.rar。

解压 资料.rar

进入解压好的 资料-day01-前端运行环境-nginx-1.20.2

把里面的 html 拷贝,粘贴到 下载

把 html 文件夹复制一份到 /opt/homebrew/Cellar/nginx/1.27.4 (这里1.27.4改为你自己的版本)

bash 复制代码
cp Downloads/html /opt/homebrew/Cellar/nginx/1.27.4 #1.27.4改为你自己的版本

五、访问网页

打开浏览器,导航栏输入

bash 复制代码
localhost
#或者
127.0.0.1

可以正常访问

相关推荐
LucianaiB3 小时前
【元宝搜索开发者征文大赛】AI时代,学得慢就不用学?用元宝搜索打造一个教程保质期,确保每一个教程符合你的现状
前端·人工智能·ai编程
excel3 小时前
JavaScript 对象池:减少高频对象创建与 GC 压力
前端
陈随易5 小时前
纯 Go 写的 JS 引擎,跑分超过了 C 语言的 QuickJS
前端·后端·程序员
子兮曰7 小时前
Chrome 权限元素实战:144 与 151 的渐进增强写法
前端·javascript·chrome
IT_陈寒7 小时前
Redis连接池泄漏那次,我差点把生产环境搞崩了
前端·人工智能·后端
强尼银手7 小时前
我花一天做了个格斗游戏原型,判定全对,然后被「美术」劝退了
前端·javascript
石小石Orz7 小时前
AI 正在蚕食我们的编码能力
前端·后端·算法
陈随易8 小时前
专注飞机 FocusFlight,两个人把番茄钟做成了一趟航班
前端·后端·程序员
总要学点什么8 小时前
第98篇:三维特效-材质线效果——给一条线换十种材质,虚线的图案只填了一半
开发语言·前端·javascript·ecmascript·gis·webgl·材质
10share8 小时前
基于大模型的 i18n 方案:把中文原文当 Key,轻松搞定多语言维护
前端·vue.js