网站开发遇到的一个坑点

我在网站写了这样一个功能:

前端页面有三个文本框和一个提交按钮,点击后将信息发送给后端并保存到数据库。

在开发阶段,我的前端代码是这样写的:
fetch('http://localhost:3000/api/submit', ...)

意思是将信息发送到本地3000端口,在开发阶段,这里没问题。

因为就是在本地开发的。

然而,项目上线后,这个提交功能却直接失效了。经过排查才恍然大悟:前端代码是下载到用户的浏览器中执行的。 如果在代码里写死 localhost,用户的浏览器就会去请求他们自己电脑上的 3000 端口,而不是我的线上服务器。

现在问题已经解决

写成这样就行了:

fetch('/api/submit', ...) 这样浏览器会自动将当前网页的线上域名拼接到请求前面。

虽然问题很简单,但是暴露出一个很严重的问题,如果项目发生错误,我根本没有能力去调试,甚至不知道问题会在什么地方。

好在现在还没有去上班。

相关推荐
网络点点滴2 小时前
customRef的强大之处
开发语言·前端·javascript
小茴香3532 小时前
拖拽实现(原生JS+Vue)
前端·javascript·vue.js·typescript
whuhewei2 小时前
CSS文字外描边
前端·css
风之舞_yjf2 小时前
Vue基础(30)_mixins配置项
前端·vue.js
李白的手机2 小时前
前端→Java→MySQL 时区时间处理全链路深度解析
前端·后端
踩着两条虫2 小时前
AI驱动的 Vue3应用开发平台深入探究(十五):扩展与定制之自定义设置器与属性编辑器
前端·vue.js·人工智能·低代码·系统架构·编辑器
恋猫de小郭2 小时前
Flutter 3.41.6 版本很重要,你大概率需要更新一下
android·前端·flutter
Surmon8 小时前
彻底搞懂大模型 Temperature、Top-p、Top-k 的区别!
前端·人工智能
木斯佳10 小时前
前端八股文面经大全:bilibili生态技术方向二面 (2026-03-25)·面经深度解析
前端·ai·ssd·sse·rag