Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/473.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript $locationProvider HTML5模式导致“;无法获取;刷新时出错-AngularJS节点应用程序_Javascript_Angularjs_Node.js_Mongodb_.htaccess - Fatal编程技术网

Javascript $locationProvider HTML5模式导致“;无法获取;刷新时出错-AngularJS节点应用程序

Javascript $locationProvider HTML5模式导致“;无法获取;刷新时出错-AngularJS节点应用程序,javascript,angularjs,node.js,mongodb,.htaccess,Javascript,Angularjs,Node.js,Mongodb,.htaccess,我正在尝试使用locationProvider从Angularjs应用程序的URL中删除hashtag,在手动刷新页面之前,它工作得很好。这通常会导致浏览器中出现“无法获取…”错误。我做了一些研究,我想我必须使用一个.htaccess文件来重定向,但我不知道如何实现它,我在网上搜索了一个解决方案,但到目前为止没有运气 下面是我的app.js,它处理到角度视图和控制器的路由: (function () { 'use strict'; var myApp = angular.modu

我正在尝试使用locationProvider从Angularjs应用程序的URL中删除hashtag,在手动刷新页面之前,它工作得很好。这通常会导致浏览器中出现“无法获取…”错误。我做了一些研究,我想我必须使用一个.htaccess文件来重定向,但我不知道如何实现它,我在网上搜索了一个解决方案,但到目前为止没有运气

下面是我的app.js,它处理到角度视图和控制器的路由:

(function () {
    'use strict';
    var myApp = angular.module('myApp', ['ngRoute']);
    myApp.config(function($routeProvider, $locationProvider) {
        $routeProvider.
            when('/', { 
                templateUrl: 'views/partials/play.html',
                controller: 'playCtrl'
            }).
            when('/dictionary', {
                templateUrl: 'views/partials/dictionary.html', 
                controller: 'dictionaryCtrl'
            }).
            when('/add', {
                templateUrl: 'views/partials/word.html', 
                controller: 'wordCtrl'
            }).
            when('/about', {
                templateUrl: 'views/partials/about.html', 
                controller: 'aboutCtrl'
            }).

            otherwise({redirectTo: '/'});

        // use the HTML5 History API
        $locationProvider.html5Mode(true);
    });
})();
我还在我的index.html中的
中添加了以下内容:

<base href="/">

该应用程序是使用Node.js、Express、Angular和Mongodb构建的,如果这有帮助的话


非常感谢。

这取决于角度版本

最新的
Angular
版本需要以下选项:

$locationProvider.html5Mode({
  enabled: true,
  requireBase: false
});
如果将$location配置为使用HTML5模式(history.pushState),则 需要为具有 通过以下方式标记或配置$locationProvider,使其不需要基本标记: 将带有
requireBase:false的定义对象传递给
$locationProvider.html5Mode()

官方文件中的模式详细信息


因此,您只需处理服务器端angular中描述的每个路由,并使用angular插件呈现相同的(可能是索引)页面。

如果其他人怀疑您需要将节点未使用的所有路由重定向到angular:

app.get('*', function(req, res) {
  res.sendfile('./path/to/index.html')
})

这必须在server.js中完成。别忘了在sendfile链接中使用.)

恐怕这对我不起作用。当刷新主页时,它是好的,但是任何其他页面,如/add或/dictionary,我都会得到错误。只有在刷新时,从标题中的链接,URL仍然有效fine@OllyBarca似乎您的后端没有正确的路由。你应该注意你的服务器对所有这些请求的响应,并用angular自身呈现主页面。我的后端有路由,但只处理API调用。我有一个“app.use(express.static(uu dirname+/public”);”在我的服务器中加载index.html。js@OllyBarca
express.static
适用于静态文件,api调用也很好,但您还需要有一组路由来呈现索引页(angular位于何处)。好的,最好的方法是什么?使用.htaccess文件?我听到传言说,我所要做的就是每次都通过index.html路由用户。如果能看到angular的通用解决方案,而不是使用节点、js后端和express专门针对angular的解决方案,那就太好了。。。