HTML 5模式删除angularjs + nodejs中的哈希

Question

我是平均堆栈中的新手，我想删除browser.URL中的哈希值，但是我成功做到了这一点，但是当我当时刷新页面时，出现“找不到网络错误404”，请帮助我解决此问题。

下面我显示index.html文件的代码。

 <script>
  var base = document.createElement('base');
         base.href = 'http://localhost:3000/';
         document.getElementsByTagName('head')[0].appendChild(base);
       </script>

下面是config.router.js的代码

angular.module('app')
        .config(
                ['$stateProvider', '$urlRouterProvider','$locationProvider', 'MODULE_CONFIG',
                    function ($stateProvider, $urlRouterProvider,$locationProvider, MODULE_CONFIG) {
                     $locationProvider.html5Mode(true).hashPrefix('!');

以下是node.js的server.js文件的代码

var express = require('express');
var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');
var mongoose = require('mongoose');
var routes = require('./routes/index');
var country = require('./routes/country');
var category = require('./routes/Category');
var attributes = require('./routes/Attribute');
var subscription = require('./routes/subscription');
var mall = require('./routes/mall');
var http = require('http');
var user = require('./routes/user');
var app = express();
//var cors = require('cors');
// view engine setup
//app.use(cors());
app.set('views', path.join(__dirname, '../app'));
app.engine('html', require('ejs').renderFile);
app.set('view engine', 'html');
// uncomment after placing your favicon in /public
//app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
app.use(logger('dev'));
app.use(bodyParser.urlencoded({limit: '50mb', extended: true }));
app.use(bodyParser.json({limit: '50mb'}));
app.use(function(req, res, next) {

  res.header("Access-Control-Allow-Headers", "X-Requested-With");
  next();
});
app.use(cookieParser());
//app.use(bodyParser({limit: '50mb'}));
app.use(express.static(path.join(__dirname, '../app/')));
/*allowCrossDomain = function(req, res, next) {


  res.header('Access-Control-Allow-Origin', '*');
  res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,OPTIONS');
  res.header('Access-Control-Allow-Headers', 'Content-Type, Authorization, Content-Length');
  next();
};

app.use(allowCrossDomain);*/
app.use(express.static(path.join(__dirname, '../app/')));
app.use('/', routes);
app.use('/api/user', user);
app.use('/api/country', country);
app.use('/api/city', country);
app.use('/api/state', country);
app.use('/api/mall', mall);
app.use('/api/category', category);
app.use('/api/attributes', attributes);
app.use('/api/subscription', subscription);
app.set('port',3000);
mongoose.connect('mongodb://52.39.244.83    /deals');
var db = mongoose.connection;
db.on('error',erroroccured);
db.once('open',startserver);
function erroroccured(){
    console.log('error');

}
function startserver(){
//  mongoose.set( "debug", true );
    var server = app.listen(app.get('port'), function() {
        console.log('Server listening on port ' + server.address().port);
    });
}

module.exports = app;

因此，请提前感谢大家帮助我解决这个问题。

Answer 1

因为您已经定义了hashPrefix('!')配置，所以您的URL现在将是

index.html#!/path

如果您想要纯HTML5模式样式，例如

index.html/path

只是不定义hashPrefix 。 它默认为'' 。

另外，您也可以摆脱基本标签，但是这可能会带来一些问题，这些问题将要定义一个基本标签，将其定义为

  <head>
    <base href="/">
  </head>

而不是localhost:3000因为这将在您的服务器上失败。

Answer 2

我认为只用这个应该没问题

$locationProvider.html5Mode(true);

和在HTML

<head>
  <base href="/">
</head>

HTML 5模式删除angularjs + nodejs中的哈希

问题描述

2 个解决方案

解决方案1
0 2016-10-25 05:33:27

解决方案2
0 2016-10-25 05:43:59

HTML 5模式删除angularjs + nodejs中的哈希

问题描述

2 个解决方案

解决方案1 0 2016-10-25 05:33:27

解决方案2 0 2016-10-25 05:43:59

解决方案1
0 2016-10-25 05:33:27

解决方案2
0 2016-10-25 05:43:59