Warm tip: This article is reproduced from serverfault.com, please click
client client-server javascript node.js server

javascript-Node.js找不到客户端文件

(javascript - Node.js cannot find client-side files)

发布于 2020-11-30 03:15:49

我有一个简单的node.js应用程序：

server.js

const express = require('express');
const app = express();

const PORT = 8080;

app.use(express.static('client'));

// Start the express web server listening on 8080
app.listen(8080, () => {
  console.log('Service started on port 8080.');
});

// Serve the homepage
app.get('/', (req, res) => {
  res.sendFile(__dirname + '/index.html');
});

index.html

<html>
... irrelevant junk ...
<script src="js/client.js"></script>
</html>

但是，当我运行node server.js并打开时localhost:8080，控制台会抱怨找不到它http://localhost:8080/javascript/client.js。

显然，我希望它正在查看./javascript/client.js，而不是植根于locahost addr －如何解决？

文件夹层次结构很简单：

.
├── index.html
├── server.js
├── js
    └── client.js

我想改变public到client的建议在这里，但没有帮助。

Questioner
Alex Coleman
Viewed
0
分享
jfriend00 2020-11-30 11:35:19

根据文件在服务器上的位置，你应该进行三处更改：

app.use(express.static("./public"));

并且，在客户端中，使用以下命令：

<script src="/js/client.js"></script>

然后，将服务器端文件下方的客户端文件移动到根公共目录中，如下所示：

.
├── index.html
├── server.js
├── public
    ├── js
        └── client.js

无需将客户端文件移入public，则可以打开服务器端代码以供客户端读取（不需要）。

运作方式如下：

客户要求：

http://localhost:8080/js/client.js

express.static() 看到以下要求：

 /js/client.js

它从你的公共文件的根目录开始，并合并/js/client.js到公共目录路径，然后创建正确的访问路径：

public/js/client.js

通过执行以下操作，你可以使它工作而无需将客户端文件移到public目录层次结构中：

app.use(express.static(__dirname));

但是，那样就可以打开所有服务器端文件，以供你真正不希望的客户端读取。

热门帖子

1
推荐一些好玩的/大众的手游
2
求指教后端项目迁移方案
3
迷你洗衣机是不是都是智商税？
4
求助一个排查了半年没解决的 MySQL order by 子句导致索引失效的问题， 500 多万条记录的小表要查快两分钟
5
个人开发了一款 WordPress 主题： iPao，集成了 AI 总结功能
6
偶然发现奇游加速器会在系统里植入根证书
7
国内有蒲公英替代品推荐吗？
8
语音助手这个东西真的会监听谈话并且上传，从而泄漏隐私吗？
9
出一些有意思的域名-明盘
10
jetbrains 全家桶升级 2024 后，在滚动代码时候感觉有点掉帧

热门github

1
Implementation of paper - YOLOv9: Learning What You Want to Learn Using Programmable Gradient Information (翻译：论文实现——YOLOv9: Learning What You Want to Learn using Programmable Gradient Information（利用可编程梯度信息学习您想学的内容）)
2
A Windows and Office activator using HWID / Ohook / KMS38 / Online KMS activation methods, with a focus on open-source code and fewer antivirus detections. (翻译：使用 HWID / KMS38 / Online KMS 激活方法激活 Microsoft 产品的脚本集合，重点是开源代码、较少的防病毒检测和用户友好性。)
3
Get up and running with Llama 2, Mistral, Gemma, and other large language models. (翻译：启动并运行 Llama 2、Mistral、Gemma 和其他大型语言模型。)
4
该项目可以让你通过订阅的方式使用Cloudflare WARP+，自动获取流量。This project enables you to use Cloudflare WARP+ through subscription, automatically acquiring traffic.
5
Multi functional app to find duplicates, empty folders, similar images etc. (翻译：多功能应用程序可查找重复项、空文件夹、相似图像等。)
6
Xray panel supporting multi-protocol multi-user expire day & traffic & ip limit (Vmess & Vless & Trojan & ShadowSocks & Wireguard) (翻译：Xray面板支持多协议多用户到期日&流量&IP限制（Vmess & Vless & Trojan & ShadowSocks & Wireguard)
7
The Free Software Media System (翻译：Jellyfin 是一个免费软件媒体系统，可让您控制管理和流式传输您的媒体。它是专有 Emby 和 Plex 的替代方案，通过多个应用程序从专用服务器向最终用户设备提供媒体。)
8
lightweight, standalone C++ inference engine for Google's Gemma models. (翻译：适用于 Google Gemma 模型的轻量级独立 C++ 推理引擎。)
9
📚 Freely available programming books (翻译：📚 免费提供的编程书籍)
10
A collective list of free APIs (翻译：免费 API 的集合列表)
11
1️⃣🐝🏎️ The One Billion Row Challenge -- A fun exploration of how quickly 1B rows from a text file can be aggregated with Java (翻译：十亿行挑战 —— 使用 Java 对文本文件中的 10 亿行数据进行聚合的有趣探索)
12
🎓 Path to a free self-taught education in Computer Science! (翻译：🎓计算机科学免费自学教程！)
13
Curso para aprender el lenguaje de programación Python desde cero y para principiantes. 75 clases, 37 horas en vídeo, código, proyectos y grupo de chat. Fundamentos, frontend, backend, testing, IA... (翻译：从零开始学习 Python 编程语言的课程，适合初学者)
14
This repository contains System Design resources which are useful while preparing for interviews and learning Distributed Systems (翻译：该存储库包含系统设计资源，在准备面试和学习分布式系统时非常有用)
15
Mamba is a new state space model architecture showing promising performance on information-dense data such as language modeling, where previous subquadratic models fall short of Transformers. It is based on the line of progress on structured state space models, with an efficient hardware-aware design and implementation in the spirit of FlashAttention. (翻译：Mamba 是一种新的状态空间模型架构，在信息密集型数据（例如语言建模）上显示出良好的性能，而之前的二次模型在 Transformers 方面存在不足。它基于结构化状态空间模型的进展，并本着FlashAttention的精神进行高效的硬件感知设计和实现。)