刷新angularjs页面时,会显示找不到页面的错误

时间:2017-08-25 10:49:09

标签: angularjs node.js

我有一个角度应用程序,当我使用

$locationProvider.html5Mode(true);  删除#! ,它很好用。但是当我刷新页面时,它会给出错误 得到GET / c /电子/电脑/笔记本电脑,这是我的网址

这是我的app.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 index = require('./routes/index');

var app = express();

app.use(function(req,res,next){

  res.setHeader('Access-Control-Allow-Origin', '*');


  res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE');


  res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With,content-type');

  res.setHeader('Access-Control-Allow-Credentials', true);
  next();
});



app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

app.use('/', index);

app.use(function(req, res, next) {
  var err = new Error('Not Found');
  err.status = 404;
  next(err);
});


app.use(function(err, req, res, next) {

  res.locals.message = err.message;
  res.locals.error = req.app.get('env') === 'development' ? err : {};


  res.status(err.status || 500);
  res.render('error');
});

module.exports = app;

这是我的索引页面我把我的所有函数和api用于触发查询,其中模型中有我的mongodb查询

var express         = require('express');
var router          = express.Router();
const mongoose      = require('mongoose');
const bodyParser    = require('body-parser');
Category            = require('./models/category');
Product             = require('./models/product');
http                = require('http');

mongoose.connect('mongodb://localhost/baazaronline');
var db = mongoose.connection;

router.get('/api/category', function(req, res){
    Category.getCategory(function(err, category){
        if(err){
            throw err;
        }
        res.json(category);
    });
});

router.get('/api/product', function(req, res){
    Product.getProduct(function(err, product)  {
        if(err){
            throw err
        }
        res.json(product);
    })
});



router.get('/api/product/:_id', function(req, res){

    Product.getProductById(req.params._id, function(err, product){
        if(err){
            throw err;
        }
        res.json(product);
    });
});

1 个答案:

答案 0 :(得分:0)

Kasun,之所以发生这种情况,是因为你试图从一个子路由刷新页面(与ui-router无关)。

基本上,如果您请求www.yourdomain.com/,您可能需要将服务器设置为index.html,以便启动您的角度应用。加载应用后,任何进一步的网址更改都会考虑html5Mode并通过ui-router更新您的网页。

当您重新加载页面时,角度应用程序不再有效,因为它尚未加载,因此如果您尝试加载子路由(例如:www.yourdomain.com/someotherpage),那么您的服务器不知道如何处理/someotherpage并可能返回404或其他错误。

您需要做的是配置服务器以返回所有路由的角度应用。我主要使用node / express,所以我做了类似的事情:

app.get('*', function(req, res, next) {
    // call all routes and return the index.html file here
}

注意:我通常使用类似这样的东西作为最终捕获,但是我还在其上面包含其他路由,例如请求静态文件,网络爬虫和任何其他需要处理的特定路由。< / em>的