1. Descripción del problema
Una vez que el navegador recibe el contenido HTML devuelto por el servidor, comenzará a analizar de arriba a abajo. Durante el proceso de análisis, si encuentra:
- enlace
- guión
- img
- iframe
- vídeo
- audio
Cuando se adjunta la etiqueta de atributo href con src o enlace, el navegador iniciará automáticamente una nueva solicitud para estos recursos estáticos. Necesitamos procesar estas nuevas solicitudes.
Utilice el código de nodo nativo para procesar estos recursos estáticos; puede consultar este blog:
Cómo lidiar con recursos estáticos en Node.js
Pero es más problemático. En el proceso de aprendizaje de Node in, creo que iremos al Expressmarco de estudio (basado en la plataforma Node.js, marco de desarrollo web minimalista, rápido y abierto). Entonces, ¿cómo manejamos estos recursos estáticos en Express?
Dos, la solucion
Estructura del proyecto
que utilizamos Express en express.staticlas funciones integradas de middleware. Las características de esta función son las siguientes:express.static(root, [options])
método uno:
//第一个参数是请求路径url，当请求路径以 /public/ 开头的时候，就会去 ./public/ 请求对应的资源，
//如 http://localhost:3000/public/img/1.jpg
app.use('/public',express.static('./public/'))
El resultado se muestra en la figura:
Método dos:
Podemos lograr este efecto: crear un prefijo de ruta virtual para los archivos proporcionados por el servidor (la ruta no existe realmente en el sistema de archivos)
//第一个参数是什么，请求路径中就要加上，如 http://localhost:3000/a/img/1.jpg，可以把 a 当做 public 的别名
app.use('/a',express.static('./public/'))
//这样也是可以的 http://localhost:3000/a/b/c/img/1.jpg
app.use('/a/b/c',express.static('./public/'))
Método tres:
Cuando se omite app.use()en el primer parámetro, la solicitud no necesita agregar la ruta / público / prefijo u otras rutas, ruta directa para escribir la carpeta pública de recursos,
// http://localhost:3000/img/1.jpg
app.use(express.static('./public/'));
Por supuesto, también podemos utilizar rutas absolutas.
// 提前导入 path 模块
app.use(express.static(path.join(__dirname, 'public')))
Código completo:
let express = require('express');
let app = express();
app.get('/',function (req,res) {
res.send('我是首页');
})
app.use(express.static('./public/'));
app.listen(3000,function () {
console.log('服务器启动成功： http://localhost:3000');
})
Tres, resumen
- Si
app.use()no es el primer argumento, el uso directo de recursos en la ruta del directorio público - Si
app.use()existe el primer parámetro, la primera vez que se coloca el recurso solicitado como prefijo se agrega a un parámetro dentro de la URL.
Cuatro, lectura extendida
https://blog.csdn.net/weixin_43974265/category_10692693.html
Si este artículo te resulta útil, dale me gusta antes de irte (￣ ▽ ￣) ~ *