时间戳

首页 > 解决方案 > ngRoute Params url 刷新不工作

angularjs - ngRoute Params url 刷新不工作

问题描述

我在 angularjs 中使用带有 node.js 的 ngRoute，我创建了一个类似 'localhost:3000/user/:id' 的 url。第一次单击链接时，它会正确重定向到此页面并且工作正常。但是当我刷新这个 url 时，css 和 js 的所有外部文件的路径都相对于 Param url 发生了变化。第一次css文件路径是'/css/style.css'，但刷新后它变成'/user/css/style.css'。我不确定发生了什么。但是如果我在 url 中包含 # ，它在刷新 url 后工作正常。下面是我的路由配置代码和节点配置代码。ngRoute 提供者-

$routeProvider.when("/", {
            templateUrl: "/pages/home.html",
            controller: "homeController"
        }).when("/about-us", {
            templateUrl: "/pages/about-us.html",
            controller: "homeController"
        }).when("/users", {
            templateUrl: "/pages/users.html",
            controller: "usersController"
        }).when("/user/:id", {
            templateUrl: "/pages/users.html",
            controller: "usersController"
        })
        .otherwise({
            redirectTo: "/"
        });

        $locationProvider.html5Mode({
            enabled: true,
            requireBase: false
        });

在 node.js 中

var express         = require('express');
var logger          = require('morgan');
var path            = require('path');
var app             = express();
var server          = require('http').createServer(app);

app.use(logger('dev'));

app.set('port', process.env.PORT || 3000); 

app.set('env','development')  ; 
app.set('views', path.join(__dirname, '/pages'));
app.use(express.static(path.join(__dirname, '/')));

 app.use(function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "*");
  res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
  next();
});



    app.all('*', function(req, res) {
        res.sendfile('pages/index.html');  
    });

server.on('error', function(err){
    process.exit(1);
}).listen(app.get('port'), function(){
    console.log('App is running at: '+app.get('port'))
});

请帮我解决这个问题。谢谢。

标签： angularjsnode.jsngroute

解决方案

您只需将 .htaccess 文件放在所有路由重定向到 index.html 页面的位置，这样您的问题就会得到解决。

RewriteEngine on
RewriteCond %{REQUEST_URI} !^/index.html$
RewriteCond %{REQUEST_URI} !\.(gif|jpe?g|png|css|js)$
RewriteRule .* / [L,R=302]

尝试将此代码放在 .htaccess 文件中并运行您的应用程序，您不会再遇到任何问题，希望此答案对您有所帮助。

推荐阅读