找不到 localhost 的网页找不到与以下网址对应的网页：http://localhost:5173/HTTP ERROR 404

最新推荐文章于 2025-03-07 17:47:19 发布
最新推荐文章于 2025-03-07 17:47:19 发布
阅读量6.5k 收藏
点赞数 1
文章标签： 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/xyfjx/article/details/133995424
版权

 使用vite新建项目后，访问网址

起初认为是vite的配置问题 端口未设置   修改为8080端口后仍然无法访问

进一步推迟这个应该是访问html位置不对，找到文件一看，果然放错了

修改位置准确即可，哎 太粗心了

人工智能_大模型021_Ubuntu/Centos本地安装_ScreenShotToCode根据设计图_截图生成前端Vue/React/Bootstrap页面_002---人工智能工作笔记0157
添柴程序猿的专栏
03-20 251
可以看到换源以后,要求执行,poetry lock --no-update 来进行更新。本地我们poetry的源换成了,清华源以后,发现,大部分可以了现在还有一个。启动完成后，在 http://localhost:5173 访问应用。启动完成后，在 http://localhost:5173 访问应用。只能继续尝试了,可以看到一只尝试还成功了,尝试了两天左右。可以看到已经安装好了,尝试了两天...还是网络不行啊。效果好像还不如清华源好,再换回去,那怎么办,然后再去开个窗口,去前端,执行。
Web Agent
weixin_43934593的博客
08-16 1732
这个 Web Agent 项目展示了如何结合 AI 模型和网页自动化技术来执行复杂的网络任务。它的模块化设计使得扩展和维护变得相对容易。然而，由于依赖外部 API 和网页结构，在使用时需要注意潜在的稳定性和兼容性问题。
vue项目-找不到localhost的网页
2202_75332842的博客
10-16 486
找不到localhost的网页。
安装完IIS后访问localhost需要密码解决方法
11-20
安装完IIS后访问localhost需要密码解决方法,自己在网上找了很多的方法都不行，于是弄了个好一点的方法
tomcat localhost:8080无法连接网页
qq_44786673的博客
03-07 824
同时按【Win+R】打开命令行，输入netstat -aon|findstr “8080”，找到占用端口的进程。打开任务管理器（按下“Ctrl+Shift+Esc”快捷键或右键点击任务栏选择“任务管理器”来打开）。进程ID`命令，将“进程ID”替换为占用端口的进程的PID。在“进程”或“详细信息”选项卡中找到占用端口的进程，右键点击并选择“结束任务”。错误示例：https://localhost:8080 （我是因为这个问题），在结束进程之前，请确保该进程不是系统关键进程，以免对系统稳定性造成影响。
【three.js】http://localhost:5173提示找不到
IU
01-09 2556
入口文件应命名为***，且放置于一级目录下，否则找不到。
找不到与以下网址对应的网页：http://localhost:8080/rest/index HTTP ERROR 404
热门推荐
阿尔法小师妹
12-07 3万+
1.首先出现这个问题的原因是资源访问的路径出了问题,导致 css文件，js文件并未加载出来 2.查看页面控制台 3.ping 127.0.0.1 和ping 域名 显示都是通着的 4.查看tomcat配置 路径配置没有问题 5.查看nginx配置 server { listen 80; server_name a.b.c.com; add_header 'Access-Control-Allow-Origin' ...
找不到 localhost 的网页找不到与以下网址对应的网页：http://localhost:8080/sys/loginServletHTTP ERROR 404
qq_62575539的博客
04-14 2533
运行时报错：找不到 localhost 的网页找不到与以下网址对应的网页：http://localhost:8080/sys/loginServletHTTP ERROR 404
找不到与以下网址对应的网页：http://localhost:8080/ HTTP ERROR 404
qq_56637516的博客
10-15 1万+
查找原因： 1.路径配置查找 path %CATALINA_HOME%\lib;%CATALINA_HOME%\lib\servletapi.jar;%CATALINA_HOME%lib\jsp-api.jar 2. 3. 最后发现添加，并设置即可。
导出页面提示“找不到与以下网址对应的网页：http://localhost:8000/sys/embraco/cust-vehicle-queue/download/6081ec88-2339-4f”
weixin_44671867的博客
04-11 1519
页面显示导出提示 Preview和Response都没有返回东西，我以为是接口写出bug，开始debug导出接口，一直到最后，接口都能正常返回，但是能返回为啥没写到页面上呢 后台部分代码 /创建文件夹 File path = new File(reportPath,tempFileName); path.mkdir(); //创建Excel文件 File file = new File(path.getPath(), "report.xlsx"); //创建Excel XSSFWorkbook
使用vite搭建项目时，在启动vite后，浏览器显示页面：找不到localhost的网页
nbvnvnvbn的博客
12-18 4532
在使用前端工具vite（版本5），搭建vue3项目时，启动vite，浏览器显示页面：找不到localhost的网页, 起初怀疑是 未加参数 --host='0.0.0.0',导致，后加上该参数后问题依旧
找不到 Web 地址对应的网页:_学习工具 | 网页视频下载工具 — — Web Video Downloader...
weixin_39870664的博客
10-25 571
点击蓝字关注我们啥？！网页上的视频不知道怎么下载？小编就快速闪现啦！无奖竞猜~猜猜我有什么武器？Web Video Downloadereverybody!follow me!一探究竟！简介Web Video Downloader(网页视频下载)是一款简便易用可以抓取视频网站的视频的工具软件。支持几乎所有流行在线视频分享网站的在线视频下载扩展，包括优酷、土豆、6cn与许多国外网站。除了视...
Spring 整合 Spring Security 踩坑记录
weixin_46464010的博客
08-14 789
Spring 整合 Spring Security
前端学习笔记 3：Vue 工程
梦幻天空
01-02 1517
介绍了如何在单一 Html 页面中使用 Vue，本文介绍如何从头开始用 Vue 构建一个前端工程项目。
http通信协议及常见网络请求方式
Nie_XiaoGang的博客
04-10 1922
http通信协议与常用网络请求方式$.ajax, axios
IIS未列出与打开的Url匹配的网站。问题解决方法
三五月儿的专栏
03-15 5306
使用vs2015开发webapi，调试程序时服务器使用本地IIS。启动程序，出现提示”无法在Web服务器上启动调试。IIS未列出与打开的Url匹配的网站。” 解决该问题，可以从以下几点去寻找解决问题的方法。 1、确认网站绑定ip地址时选择“全部未分配”项。 2、调试 > 附加到进程 > 勾选“显示所有进程”> 附加 w3wp.exe 3、确认IIS新建网站的目录是现在的项目目录。
JavaScript中typeof知多少？
weixin_33712987的博客
12-29 110
typeof运算符介 绍：typeof 是一个一元运算，放在一个运算数之前，运算数可以是任意类型。它返回值是一个字符串，该字符串说明运算数的类型。你 知道下面typeof运算的结果吗？typeof(1);typeof(NaN);typeof(Number.MIN_VALUE);typeof(Infinity);typeof("123");typeof(true);typeof(windo...
找不到localhost的网页错误怎么办？
Acouasm_gjp的博客
06-02 2万+
有时候当我们写了代码运行的时候会出现找不到localhost网页的错误如图然后我们点击如图然后进入下图所示 图中最下方有个Warning点击后方的Fix修复一下就可以了！
win7系统服务器错误404,win7系统主机无法进入 输入http://localhost出现404的应对办法...
weixin_39703926的博客
08-09 791
win7系统主机只需在电脑浏览器中输入http://localhost就可打开进入，但有用户却遇到了输入http://localhost时出现404的错误提示，其实出现这样的原因是由于用户给站点绑定了IP地址，才会出现找不到网页的问题，下面小编给大家介绍win7系统主机无法进入输入http://localhost出现404的应对办法1、在win7系统桌面开始菜单中，打开控制面板，接在控制面板中，...
electron+vue3运行后不能出发preload.js里面的方法 运行语法为"electron:dev": "concurrently -k \"npm run dev\" \"wait-on http://localhost:5173 && electron .\"",
最新发布
03-13
<think>好的，我需要帮助用户解决Electron和Vue3项目中preload.js里的方法无法触发的问题。用户已经提供了之前的建议和当前的运行脚本，我需要根据这些信息进一步分析。 首先，用户提到的运行命令是使用concurrently同时运行npm run dev和electron .，并且等待localhost:5173。这可能涉及到Vite的默认端口，Vue3项目通常用Vite，所以检查端口是否正确是个好主意。如果Vue开发服务器启动的端口不是5173，那么wait-on会一直等待，导致Electron无法正确加载页面，从而preload脚本可能没有被加载。 接下来，用户可能配置了vue.config.js，但Vite项目通常使用vite.config.js，需要确认是否存在配置覆盖的问题。例如，如果Vite的配置没有正确设置base或publicPath，可能导致Electron加载的页面路径不正确，进而影响preload脚本的注入。 然后，preload.js的路径是否正确。在Electron的主进程中，如果使用path.join(__dirname, 'preload.js')，需要确认preload.js的位置是否在项目的根目录下。如果项目结构是分层的，可能需要调整路径，比如path.join(__dirname, 'src/preload.js')。 另外，检查Electron的版本是否支持contextIsolation。用户之前提到Electron v12默认启用contextIsolation，如果用户使用的是旧版本，可能需要显式启用。不过现在主流版本都是v12以上，所以可能问题不在此，但版本检查还是必要的。 还有，preload脚本是否被正确注入。可以在Electron的主进程日志中查看是否有preload.js加载的提示，或者在preload.js中添加console.log，看是否有输出到Electron的控制台。如果preload脚本没有被加载，可能是路径问题或配置错误。 安全策略方面，CSP（内容安全策略）可能阻止某些脚本执行。用户需要检查浏览器控制台是否有相关的警告或错误，比如拒绝执行内联脚本等。可能需要调整CSP设置，允许Electron的协议和资源。 另外，渲染进程中的调用是否正确。用户可能尝试在Vue组件中直接调用window.electronAPI，但由于Vue3的setup语法或生命周期钩子的时机问题，可能在组件挂载前尝试访问API，导致undefined。建议在onMounted钩子中访问，并添加错误处理。 还有可能是并发执行的问题。concurrently同时启动两个命令，可能存在竞争条件，虽然用了wait-on，但有时候服务器还没完全准备好。可以尝试增加延迟，或者单独启动Vue服务器后再启动Electron，看是否解决问题。 最后，检查依赖版本。Electron和Vue3的某些版本可能存在兼容性问题，确保所有依赖都是最新的稳定版本，特别是electron、vite-plugin-electron等相关插件。 总结，可能的解决步骤包括：检查端口和路径配置，验证preload脚本注入，确保contextBridge正确使用，检查CSP策略，处理Vue组件的生命周期，以及排除并发执行的问题。需要用户提供更多信息，如Electron版本、项目结构、错误日志等，才能更精准地定位问题。</think>针对你使用的 `"electron:dev": "concurrently -k \"npm run dev\" \"wait-on http://localhost:5173 && electron .\""` 运行脚本配置，以下是结合该场景的完整排查指南： --- ### **1. 关键问题定位（Vite特有）** #### 1.1 端口冲突检查 ```javascript // vite.config.js 需确认开发服务器端口 export default defineConfig({ server: { port: 5173, // 必须与 wait-on 监听的端口一致 strictPort: true // 避免自动切换端口 } }) ``` - 若端口被占用，Vite 会默认切换端口导致 Electron 加载失败 #### 1.2 安全策略限制 ```javascript // preload.js 添加 CSP 验证 document.addEventListener('DOMContentLoaded', () => { console.log('CSP 当前策略:', document.querySelector('meta[http-equiv="Content-Security-Policy"]')?.content) }) ``` - 在浏览器控制台检查 CSP 是否阻止了预加载脚本的执行 --- ### **2. 配置同步问题** #### 2.1 Vite 插件配置（关键） ```javascript // vite.config.js 必须包含 electron 插件 import electron from 'vite-plugin-electron' export default defineConfig({ plugins: [ electron({ entry: 'electron/main.js', // 主进程文件路径 onstart: ({ startup }) => startup() // 自动重启逻辑 }) ] }) ``` - 缺少该插件会导致 Electron 主进程配置未生效 #### 2.2 路径解析问题 ```javascript // main.js 中 path 的正确使用 import path from 'path' import { fileURLToPath } from 'url' const __dirname = path.dirname(fileURLToPath(import.meta.url)) // ESM 模式必须添加 ``` - 若使用 ESM 模块，传统的 `__dirname` 获取方式会失效 --- ### **3. 脚本注入验证** #### 3.1 主进程调试 ```javascript // main.js 添加预加载验证 console.log('预加载脚本路径:', path.join(__dirname, 'preload.js')) // 打印实际路径 ``` - 在 Electron 主进程控制台查看路径是否正确 #### 3.2 渲染进程验证 ```javascript // App.vue 中检查 API 注入 onMounted(() => { console.log('window.electronAPI:', window.electronAPI) // 必须输出定义的方法 if (!window.electronAPI) { alert('Electron API 注入失败！检查 preload.js') } }) ``` --- ### **4. 并发执行问题** #### 4.1 时序问题解决方案 ```json // package.json 改进脚本（使用 vite 的预览模式） "scripts": { "dev": "vite dev", "preview": "vite preview --port 5173", // 固定预览端口 "electron:dev": "concurrently -k \"npm run dev\" \"wait-on http://localhost:5173 && npm run preview && electron .\"" } ``` - 通过 `vite preview` 确保构建完成后再启动 Electron #### 4.2 网络延迟补偿 ```bash # 增加等待时间（适用于网络不稳定的机器） "wait-on http://localhost:5173 --delay 2000 && electron ." ``` --- ### **5. 典型错误案例** #### 案例1：Vue Router 哈希模式冲突 ```javascript // router.js 需配置为哈希路由 createWebHashHistory() // 必须使用 createWebHashHistory ``` - 使用 `createWebHistory` 会导致 Electron 加载空白页 #### 案例2：热重载破坏上下文 ```javascript // main.js 禁用上下文重建 const mainWindow = new BrowserWindow({ webPreferences: { webSecurity: false // 开发环境临时关闭（仅限调试） } }) ``` - 某些热重载插件会重建窗口导致上下文丢失 --- ### **调试流程图** ```mermaid graph TD A[方法未触发] --> B{控制台报错?} B -->|有错误| C[根据错误信息修复] B -->|无错误| D[检查预加载路径] D --> E[确认主进程打印路径正确] E --> F[渲染进程检查 window.electronAPI] F -->|API存在| G[检查方法调用时机] F -->|API不存在| H[检查 contextIsolation 配置] H --> I[确认 contextBridge 正确使用] ``` 请根据上述步骤逐步排查，若仍无法解决，建议提供以下补充信息： 1. `vite.config.js` 完整配置 2. 主进程与预加载脚本的完整代码 3. 浏览器控制台与 Electron 主进程控制台的完整日志截图
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值