Question

以下是该方案：用户访问http://localhost:3000/all，并在页面上显示所有用户的列表。太好了，这就是我想要的。但是，当我刷新页面时，我会丢失所有内容（不会呈现HTML）。我刚刚离开了服务器返回的原始JSON输出。

我的Angular文件的相关部分：

var app = angular.module('social', ['ngRoute', 'ngCookies', 'ui.router'])

app.config(function($routeProvider, $locationProvider, $stateProvider, $urlRouterProvider) {
    $routeProvider
   .when('/', {
    templateUrl: 'home.html',
    controller: 'HomeController'
    })
   .when('/login', {
    templateUrl: 'login.html',
    controller: 'LoginController'
    })
   .when('/signup', {
    templateUrl: 'signup.html',
    controller: 'SignupController'
    })
   .when('/about', {
    templateUrl: 'about.html'
    })
   .when('/profile', {
    templateUrl: 'profile.html',
    controller: 'UserProfileController',
   })
   .when('/all', {
    templateUrl: 'members.html',
    controller: 'MembersController',
    resolve: {
        allMembers: function($http) {
            return $http.get('/all').then(function(res) {
                return res.data
            })
        }
    }
   })
   $locationProvider.html5Mode(true)
})

app.controller('MembersController', function($http, $scope, $cookies) {
    function getAllUsers() {
        $http.get('/all').then(function(res) {
            $scope.members = res.data
        })
    }
    getAllUsers()
})

你会注意到我试图在resolve中使用app.config，但这没有帮助（我可能错误地使用它）。使用resolve时，我的控制器变为：

app.controller('MembersController', function(allMembers, $scope) {
    $scope.members = allMembers
})

我得到了相同的结果：数据在初始页面加载时加载正常，但刷新后，我在页面上留下原始JSON。

服务器中的相关部分（使用Mongoose）：

app.get('/all', function(req, res, next) {
    User.find(function(err, users) {
        if (err) console.log(err)
        return res.json(users)
    })
})

有谁能告诉我我做错了什么？在我自己尝试之前，我遵循了一个在线教程，它在教程中工作得很好（显然）。

Answer 1

这是预期的。

似乎只有您的/路由正在为角应用程序提供服务。

/all路由是您的API，因此当您请求它时（刷新页面后），您的浏览器将呈现服务器发送的内容 - res.json(users)。

您可能想要做的是命名您的API。

您可以创建API路由器：

const app = express();
const api = express.Router();
api.get('/all', (req, res) => {
    // ...
    res.json(users);
});

// ...

app.use('/api', api);
app.get('/*', (req, res) => {
    res.sendFile('path/to/your/index.html');
});

这将确保除API路径之外的所有路径都将为您的角度应用程序提供服务。

$ http.get请求仅在首页加载时成功

1 个答案: