前端Mac解决localhost冲突问题！！！

已于 2024-08-16 10:26:47 修改
阅读量1k 收藏
点赞数 3
分类专栏： 牛马学习专栏 文章标签： 服务器 运维 前端
于 2024-08-15 18:10:37 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/m0_62474008/article/details/141227867
版权
1、报错提示：

运行项目的时候遇到了如下的问题，导致我项目运行不起来，查阅了一下资料发现是loaclhost有误

2、ping一下localhost

先打开终端，在终端输入命令：（我输入这个命令的时候能ping通，当时还以为没错）

ping localhost
3、进入hosts文件

当我进入hosts文件时发现lacalhost确实有问题，我有两个localhost地址

sudo vi /etc/hosts
4、更改localhost地址

我用#把另一个注释掉，只保留127.0.0.1地址，进入英文输入法状态按一下 i 键，这样就可以对hosts文件进行编辑了

127.0.0.1 localhost

将lacalhost地址改为127.0.0.1，这时候按一下 esc 键进行退出,然后按住 shift + ！键就会在最底下出现冒号，这时候在冒号后面输入wq!回车就保存好了

就这样我的localhost地址就改为了127.0.0.1，项目成功运行了起来！

免费的真是太香了！Chainlit接入抖音 Coze AI知识库接口快速实现自定义用户聊天界面
洛阳泰山的博客
08-22 2418
由于Coze只提供了一个分享用的网页应用，网页访问地址没法自定义，虽然可以接入等开源应用。但是如果我们想直接给客户应用，还需要客户去设置配置，里面还有很多我们不想展示给客户的东西怎么办？于是，我使用Chainlit实现了一个无缝快速接入Coze实现自定义用户使用界面的应用，代码清晰简单。还可以自定义logo、欢迎语、网站图标、语言输入、语音设别、文件上传等。Coze国内版可以免费使用 豆包模型、通义千问 qwen-max ， 智谱 GLM-4128K。
免费的真是太香了！Chainlit接入抖音 Coze AI实现多模态对话(文本、图片和文件)
洛阳泰山的博客
09-03 1670
由于Coze只提供了一个分享用的网页应用，网页访问地址没法自定义，虽然可以接入等开源应用。但是如果我们想直接给客户应用，还需要客户去设置配置，里面还有很多我们不想展示给客户的东西怎么办？于是，我使用Chainlit实现了一个无缝快速接入Coze实现自定义用户使用界面的应用，代码清晰简单。还可以自定义logo、欢迎语、网站图标、语言输入、语音设别、文件上传等。Coze国内版可以免费使用 豆包模型、通义千问 qwen-max ， 智谱 GLM-4128K。
Mac开启本地服务 mac启动localhost服务
XLL20001022的博客
06-08 5004
打开 Terminal： //启动服务apache服务器 sudo apachectl start //失败的话，重启服务 sudo apachectl restart 密码输入完成之后在本地浏览器中输入127.0.0.1或者localhost,出现it works!表明服务器已经启动了 成功 然后打开Finder，前往 (快捷键 command + shift + G) 文件夹路径： /资源库/WebServer，把自己的文件放入到其中的 Documents 文件夹中,他的路径对应的就是
mac(osx) apache无法启动 localhost无法访问服务器
创新艺术效率
12-30 1万+
问题描述：由于删除了/private/var/log下面的日志，导致重启电脑后apache无法正常工作。 删除log的初衷是：当系统用久了，日志文件占据了几十个G的硬盘容量。 造成的后果：重启电脑后apache无法正常运行，访问localhost或127.0.0.1都会无法找到服务器。 探索：问题出现后，由于$ sudo apachectl start不会报任何错，但是访问local
代理与 hosts 文件冲突问题解决方案
2301_80267599的博客
03-06 449
代理工具排除本地域名→ 确保*.test和127.0.0.1不经过代理。检查本地服务状态→ 确认服务运行且端口无冲突。处理 HTTPS 证书→ 信任自签名证书或关闭代理对 HTTPS 的拦截。通过以上步骤，应能解决代理与hosts文件冲突的问题。如果问题依旧，请提供具体代理工具名称和错误信息，以便进一步排查。
关于mac下localhost拒绝访问的问题
liuxw1的博客
06-28 2万+
如果文件配置正确 那么 删除 /private/var/log/下的apache2文件夹 然后在终端输入 sudo mkdir /private/var/log/apache2 重启apachesudo apachectl -k start     启动sudo apachectl -k stop     停止sudo apachectl -k restart   重启...
mac无法访问localhost
ldl_csdn_ios的博客
12-05 7233
如果文件配置正确 那么 删除 /private/var/log/下的apache2文件夹 然后在终端输入 sudo mkdir /private/var/log/apache2 重启apache
Mac os下apache正常启动localhost无法访问服务器
qq_36609913的博客
01-06 8431
由于删除了/private/var/log下面的日志，导致重启电脑后apache无法正常工作。 重启电脑后apache无法正常运行，访问localhost或127.0.0.1都会无法找到服务器。 探索：问题出现后，由于$ sudo apachectl start不会报任何错，但是访问localhost或127.0.0.1始终失败。 可能情况1:  没有监听
MAC——本机域名[localhost]配置
无限迭代中......
02-18 9851
基本概念 localhost：保留域名(RFC 2606) ，为了避免同狭义定义主机名混淆而单独列出。 在可用其他方式使用计算机主机名称的地方，可以指定主机为localhost。例如，将web服务器上安装的web浏览器指向http://localhost，将会显示运行这个浏览器的计算机上所服务的网站的主页，但是只有当web服务器配置至服务回路接口时才能显示。 一个特殊的DNS主机名，代表分...
Mac localhost无法访问
weixin_45511284的博客
11-14 3306
Mac localhost无法访问 localhost:8080和127.0.0.1:8080可以访问nginx的文件，但输入localhost和127.0.0.1都打不开了
2022前端面试题汇总（持续更新中~）
热门推荐
Mr_LiuP的博客
04-15 5万+
1. 防抖和节流 防抖：在固定的时间内，事件只执行一次，如果在一定时间内又触发了事件，则会重新计算函数的执行时间 节流：在一定时间内，多个事件触发，只执行为一次 2. js闭包 什么是闭包：闭包就是在方法里面返回一个方法 function a() { let a1 = 1; return function() { return a1 } } 闭包存在意义： 可以延长变量的生命周期4可以创建私有的环...
2023前端面试题汇总（最新）-持续更新中
Mr_LiuP的博客
07-17 3万+
Vue 中的 data 必须是个函数，因为当 data 是函数时，组件实例化的时候这个函数将会被调用，返回一个对象，计算机会给这个对象分配一个内存地址，实例化几次就分配几个内存地址，他们的地址都不一样，所以每个组件中的数据不会相互干扰，改变其中一个组件的状态，其它组件不变。简单来说，就是为了保证组件的独立性和可复用性，如果 data 是个函数的话，每复用一次组件就会返回新的 data，类似于给每个组件实例创 建一个私有的数据空间，保护各自的数据互不影响。
解决使用Charles将页面请求代理到本地devServer后热更新失效的问题
发果叁
09-14 1627
我们了解了在代理以后实现devServer热更新需要至少保证：1.对t=xxx发起的请求能拿到成功响应2.对发起的请求能拿到101响应（websocket协议升级成功）或对t=xxx的请求能拿到成功响应（长链接）以及3.chrome会认为给预留ip段签发的证书无效4.热更新前后端交互基本流程) 2. 如果请求拿到成功响应，接下来会向`/sockjs-node/xxx/xxx/websocket`尝试建立websocket链接，实现全双工通。
Mac下无法通过localhost连接数据库解决方法
hades's stack
03-03 7707
使用php连接数据库时，127.0.0.1可以连接，但是使用localhost无法连接。原因：localhost是通过socket方式来连接，而127.0.0.1则是走的TCP协议解决方式：打开终端，连接到mysql：mysql -hlocalhost -uroot -p;输入：STATUS;找到UNIX socket的值，复制。找到php.ini，查找pdo_mysql.default_socke
解决Mac无法访问localhost和127.0.0.1
aab11235的博客
03-27 1万+
【代码】解决Mac无法访问localhost和127.0.0.1。
Mac下Apache配置虚拟主机后localhost访问不到的解决方案
mxydl2009的博客
02-22 1225
配置虚拟主机后，localhost的访问就会失效，解决方案是在虚拟主机的配置文件里添加localhost虚拟主机，如下： <VirtualHost _default_:80> DocumentRoot "/Library/WebServer/Documents/" ServerName localhost </VirtualHost> Docu...
mac 打开apach 但无法访问localhost的解决方法
weixin_34315189的博客
01-28 1073
y由于mac系统默认自带了PHP和Apach， 所以可以通过 sudo apachectl start 直接启动apach服务， 此时在浏览器输入http://localhost，会出现It works! ，就说明Apach开启成功。 然而事情并没有那么顺利，当我按如上步骤做了之后输入apach，在谷歌浏览器打开后， 是下面这样子的！ 问题排查： 1、我查看了端口暂用情况： ...
mac下run前端项目报错
qq_37176498的博客
09-16 214
通过终端命令 命令 lsof -i tcp:port （port替换成端口号，比如6379）可以查看该端口被什么程序占用，并显示PID，方便KILL（kill pid） 1.查看端口被哪个程序占用 sudo lsof -i tcp:port 如： sudo lsof -i tcp:8082 2.看到进程的PID，可以将进程杀死。 sudo kill -9 PID 如：sudo kill -9 3210 ...
Mac查看localhost对应的ip地址
neuHenry
12-10 1万+
很多时候，我们都输入过这样的网址： http://localhost:8080/ 很熟悉吧！访问Tomcat或者访问Jenkins等Web网页时经常用到，那么我们经常使用的这个localhost是什么？字面意思是：本地主机，其代表的就是这台计算机。如何才能查看localhost对应的ip地址呢？ // 查看 localhost 对应的 ip 地址 nslookup localhost 下图我们...
苍穹外卖前端404
最新发布
03-19
<think>好的，用户遇到了苍穹外卖项目前端出现404错误的问题，需要解决方案。首先，我需要回顾一下常见的404错误原因，并结合项目提供的引用资料来分析可能的解决方法。 根据引用内容，苍穹外卖前端可能涉及端口配置、资源路径或Nginx设置等问题。首先，404错误通常意味着请求的资源不存在或路径错误。可能的原因包括： 1. **资源路径配置错误**：前端代码中引用的静态资源路径不正确，导致服务器无法找到对应文件。例如，JavaScript或CSS文件的路径配置错误。 2. **Nginx配置问题**：Nginx作为服务器，如果端口或代理设置不正确，可能导致请求无法正确路由到后端服务，从而返回404。 3. **端口冲突或未正确配置**：如果前端和后端服务使用的端口不一致，或者端口被占用，可能导致资源加载失败。 4. **前端路由问题**：如果是单页应用（SPA），可能需要配置Nginx的重定向规则，确保所有前端路由请求都指向入口文件，否则直接访问子路径会触发404。 从用户提供的引用来看，引用[2]提到登录界面打不开时，需要结束无关进程或更换端口。引用[3]则涉及修改WebSocket连接地址，可能涉及端口配置。这提示端口配置和Nginx设置是关键点。 接下来，需要一步步排查： **第一步：检查端口占用和配置** 用户可能修改了Nginx的端口（如引用[3]中端口改为800），但前端代码中的请求地址可能仍使用默认端口。需要确认前端代码中所有API请求的baseURL是否与当前Nginx配置的端口一致。例如，如果Nginx监听800端口，前端请求的URL应为`http://localhost:800/api/...`。 **第二步：验证静态资源路径** 检查Nginx配置文件中（如`nginx.conf`）的root目录是否指向正确的静态资源路径。例如，若前端代码存放在`html/sky`目录下，配置应为： ``` location / { root html/sky; index index.html index.htm; } ``` 确保路径正确，且文件确实存在。 **第三步：处理前端路由问题** 如果是SPA，需添加try_files指令，确保路由回退到index.html： ``` location / { try_files $uri $uri/ /index.html; } ``` 否则，直接访问子路由会导致404。 **第四步：检查代理设置** 如果前端请求需要代理到后端服务，确认Nginx的代理配置是否正确。例如： ``` location /api/ { proxy_pass http://backend-server:port/; } ``` 确保后端服务地址和端口正确，且服务正常运行。 **第五步：清除浏览器缓存** 有时浏览器缓存旧资源可能导致404，尝试强制刷新（Ctrl+F5）或使用无痕窗口。 **第六步：查看Nginx日志** 通过查看Nginx的error.log和access.log，可以获取具体的错误信息，帮助定位问题。日志路径通常在`logs/error.log`。 结合引用[3]中的例子，修改WebSocket地址时，可能需要同时调整其他接口的端口配置。例如，如果Nginx端口改为800，所有API请求的URL都应包含该端口。 最后，建议用户按照上述步骤逐步检查，特别是端口配置和Nginx的静态资源路径设置。同时，参考项目文档确保配置与最新代码一致。</think>### 苍穹外卖前端404错误解决方案 404错误表示服务器未找到请求的资源，可能由路径配置、端口冲突或静态资源加载问题导致。以下是逐步排查和解决方法： #### 1. **检查Nginx端口配置** - **确认前端代码中的端口与Nginx配置一致** 如果修改了Nginx默认端口（如改为800），需同步调整前端代码中的请求地址。例如： ```javascript // 原代码可能为默认80端口 const apiBaseUrl = 'http://localhost/api/'; // 修改为实际端口（如800） const apiBaseUrl = 'http://localhost:800/api/'; ``` 参考引用[3]，WebSocket连接地址也需调整为`ws://127.0.0.1:800/ws/`[^3]。 - **验证Nginx配置文件** 打开`nginx.conf`，检查`listen`指令的端口是否与前端代码匹配： ```nginx server { listen 800; # 确保此处端口正确 server_name localhost; location / { root html/sky; # 静态资源目录 index index.html index.htm; } } ``` #### 2. **确认静态资源路径正确** - **检查Nginx的root目录配置** 确保`root html/sky;`指向正确的静态文件路径。若项目部署在`nginx-1.20.2/html/sky`目录下，需确认`index.html`及JS/CSS文件存在。 - **处理前端路由重定向（SPA必备）** 如果是单页应用，需在Nginx中添加`try_files`规则，避免直接访问子路径时返回404： ```nginx location / { try_files $uri $uri/ /index.html; } ``` #### 3. **排查端口占用与代理问题** - **结束占用端口的进程** 使用命令`netstat -ano | findstr :800`查找占用端口的进程ID（PID），通过任务管理器结束该进程（参考引用[2]）[^2]。 - **配置反向代理到后端服务** 如果请求需要代理到后端接口，添加如下配置： ```nginx location /api/ { proxy_pass http://localhost:8080/; # 后端服务地址 proxy_set_header Host $host; } ``` #### 4. **其他常见原因** - **清除浏览器缓存** 强制刷新页面（Ctrl+F5）或使用无痕模式，排除缓存导致的旧资源加载问题。 - **检查文件权限** 确保Nginx进程有权限访问`html/sky`目录下的文件（Linux/Mac需注意权限设置）。 - **查看Nginx日志定位错误** 打开`logs/error.log`，搜索404相关记录，例如： ``` 2024/01/01 12:00:00 [error] 12345#12345: *1 open() "html/sky/js/app.js" failed (2: No such file or directory) ``` 此类日志可帮助确认缺失的文件路径。 #### 5. **示例：修复WebSocket连接导致的404** 根据引用[3]，若修改Nginx端口后WebSocket连接失败，需调整前端代码中的WebSocket地址： ```javascript // 修改前（端口不匹配） const socketUrl = 'ws://localhost/ws/'; // 修改后（端口与Nginx一致） const socketUrl = 'ws://127.0.0.1:800/ws/'; ``` ---
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

不熬夜的臭宝

您的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值