用node.js express设置路径后 子路径下的页面访问静态资源路径出问题
在routes/news_mian.js 设置了访问news_main.html 的路径 '/',通知设置一个访问news-page.html的子路径'/newspage'子路径。但是在访问loaclhost:3000/news/newspage时静态资源路径前多了一个/news导致不能找到静态资源


app.js
var express=require('express');
var app=express();
var path=require('path');
var http=require('http')
**var news_main=require('./routes/news_main');**//
var pullrefresh_sub=require('./routes/pullrefresh_sub');
var boiler_alarm=require('./routes/boiler_alarm')
//var news_page=require('./routes/news_page');
// app.get('/',function(req,res){
// res.render('news_main');
// });
// 定义模板
app.set('views',path.join(__dirname,'views'));
app.engine('html',require('ejs').renderFile);
app.set('view engine','html');
**app.use('/news',news_main);**
app.use('/pull',pullrefresh_sub);
app.use('/alarm',boiler_alarm);
//静态文件目录,
app.use(express.static(path.join(__dirname,'public')));
// var server=http.createServer()
var server=app.listen(3000,function(){
var host=server.address().address;
var port=server.address().port;
console.log("Example boiler listing at http://%s:%s",host,port);
});
news_main.js
var express=require('express');
var router=express.Router();
router.get('/',function(req,res,next){
res.render('news_main',{
title:"锅炉新闻"
});
});
**router.get('/newspage',function(req,res,next){
res.render('news_page',{
title:"新聞"
});
});**
module.exports=router;
HTML------
<link rel="stylesheet" href="/css/boilerNews/newspage.css" />
<script src="/js/mui.min.js"></script>
<script src="/libs/vue/vue.js"></script>
直接访问/news 没有问题,当访问/news/newspage时,访问静态资源的路径就错了
解决方法:
news-page.html 中加载 css 和 js 的标签使用了相对路径, 而不是绝对路径
<link rel="stylesheet" type="text/css" href="css/mui.min.css">
将相对路径改为绝对路径就可以了
<link rel="stylesheet" type="text/css" href="/css/mui.min.css">
用node.js express设置路径后 子路径下的页面访问静态资源路径出问题的更多相关文章
- Vue打包后访问静态资源路径问题
Vue介绍中static文件夹里放的是静态资源目录,如图片.字体等. 我们发现运行npm run start后本地图片路径是没问题的,但是打包上传后会怎么样呢? 我们知道,执行npm run buil ...
- node.js+express框架 修改后自启【不需要再执行start】
我们每次修改完后都需要重新启动下才能刷新,就很麻烦'nodemon'解决了这个问题. 这里直接进行全局安装 npm install -g nodemon 安装到本地 npm install nodem ...
- express+node.js搭建的服务器和在sublimeServer下的页面请求报跨域错误
1.前端页面使用vue中的axios请求nodejs响应.报以下错误: Failed to load http://localhost:3000/users/validate: Response to ...
- linux 下 tomcat 之 配置静态资源路径
1.找到配置文件 找到tomcat\conf\server.xml 2.找到Host 3. 添加 Context <Host name="localhost" appBase ...
- springboot之静态资源路径配置
静态资源路径是指系统可以直接访问的路径,且路径下的所有文件均可被用户直接读取. 在Springboot中默认的静态资源路径有:classpath:/META-INF/resources/,classp ...
- 13.1Springboot 之 静态资源路径配置
Spring 静态资源路径是指系统可以直接访问的路径,且路径下的所有文件均可被用户直接读取. 在Springboot中默认的静态资源路径有:classpath:/META-INF/resources/ ...
- Node.js Express 框架学习
转载:http://JavaScript.ruanyifeng.com/nodejs/express.html#toc0 感觉很牛的样子,不过觉得对初学者没太大用,里面很多例子用的api都没有详细的说 ...
- body-parser Node.js(Express) HTTP请求体解析中间件
body-parser Node.js(Express) HTTP请求体解析中间件 2016年06月08日 781 声明 在HTTP请求中,POST.PUT和PATCH三种请求方法中包 ...
- modeJS 深了解(1): Node.js + Express 构建网站预备知识
转载:http://www.cnblogs.com/zhongweiv/p/nodejs_express_webapp1.html 目录 前言 新建express项目并自定义路由规则 如何提取页面中的 ...
随机推荐
- ThreadLocal是否会导致内存泄露
什么是内存泄露? 维基百科的定义:[内存泄漏指由于疏忽或错误造成程序未能释放已经不再使用的内存],我的理解就是程序失去了对某段内存的控制,那么这段内存就算是泄露了. ThreadLocal为什么会导致 ...
- 约瑟夫环问题 --链表 C语言
总共有m个人在圆桌上,依次报名,数到第n个数的人退出圆桌,下一个由退出人下一个开始继续报名,循环直到最后一个停止将编号输出 #include <stdio.h>#include <s ...
- [Swift]LeetCode244.最短单词距离 II $ Shortest Word Distance II
This is a follow up of Shortest Word Distance. The only difference is now you are given the list of ...
- [Swift]LeetCode272. 最近的二分搜索树的值 II $ Closest Binary Search Tree Value II
Given a non-empty binary search tree and a target value, find k values in the BST that are closest t ...
- [Swift]LeetCode352. 将数据流变为多个不相交间隔 | Data Stream as Disjoint Intervals
Given a data stream input of non-negative integers a1, a2, ..., an, ..., summarize the numbers seen ...
- [Swift]LeetCode623. 在二叉树中增加一行 | Add One Row to Tree
Given the root of a binary tree, then value v and depth d, you need to add a row of nodes with value ...
- Spring设计模式_策略模式/其他
策略模式特性 1.执行最终结果一样 2.执行过程和执行逻辑不一样 3.使用同一接口 达到目的就可以了 Git地址 https://github.com/wujiachengSH/WjcStrategy ...
- Java并发编程-volatile可见性的介绍
要学习好Java的多线程,就一定得对volatile关键字的作用机制了熟于胸.最近博主看了大量关于volatile的相关博客,对其有了一点初步的理解和认识,下面通过自己的话叙述整理一遍. 有什么用? ...
- 9.Django form组件
Form组件 Django的Form主要具有一下几大功能: 生成HTML标签 验证用户数据(显示错误信息) HTML Form提交保留上次提交数据 初始化页面显示内容 创建Form类时,主要涉及到 [ ...
- ASP.NET Core 2.0 MVC项目实战
一.前言 毕业后入职现在的公司快有一个月了,公司主要的产品用的是C/S架构,再加上自己现在还在学习维护很老的delphi项目,还是有很多不情愿的.之前实习时主要是做.NET的B/S架构的项目,主要还是 ...