2017-01-30 132 views
0

我是angularJS的新手,我喜歡用它編碼。我目前正在使用angularJS構建一個門戶網站,並且我的每個網頁都使用ngRoute。它適用於我,但當我嘗試刷新頁面時,它返回了我的404 error/page not found。我應該在這個問題上做什麼?這裏是我的代碼:當頁面刷新時,AngularJS路由返回404錯誤

var app = angular.module("CVSRRC", ['ngMaterial','ngRoute']); 

app.controller('CVSRRC-CTRL', function($scope, $http, ...){ 
    // some codes here... 
}); 

app.config(function($routeProvider, $locationProvider){ 
    $locationProvider.html5Mode(true).hashPrefix('!'); 

    $routeProvider 
    .when('/', { 
     templateUrl: '_pages/home', 
     controller: 'homeCTRL', 
     resolve: { 
      delay: function($q, $timeout){ 
       var delay = $q.defer(); 
       $timeout(delay.resolve, 1000); 
       return delay.promise; 
      } 
     } 
    }) 
    ...etc... 
    .otherwise({ 
     redirectTo: '/' 
    }); 
}); 

,並在我的HTML

<html> 
    <head> 
     <base href="/cvsrrc/" /> 
    </head> 
    <body ng-app="CVSRRC" ng-controller="CVSRRC-CTRL"> 

     <div class="row" id="main"> 
     <div ng-view ng-show="statechange"></div> 
     <div ng-show="!statechange" cvsrrc-resolve> 
      <div id="_loader_"></div> 
     </div> 
    </div> 

    <a href="about-us">About</a> 
    <a href="login">login</a> 
    //etc 
    </body> 
</html> 

而且這裏是我的.htaccess看起來像

RewriteEngine On 

RewriteCond %{REQUEST_FILENAME} !-f 
RewriteRule ^([^\.]+)$ $1.php [NC,L] 
ErrorDocument 404 http://localhost/cvsrrc/page-not-found 

回答

0

最後,我找到了一個解決方案,我之前已經見過這個解決方案,但因爲我忘了從.htaccess刪除/localhost/它不會對我的工作!這裏是:

<IfModule mod_rewrite.c> 
    Options +FollowSymlinks 
    RewriteEngine On 
    # Don't rewrite files or directories 
    RewriteCond %{REQUEST_FILENAME} -f [OR] 
    RewriteCond %{REQUEST_FILENAME} -d 

    RewriteRule^- [L] 

    RewriteRule (.*) /cvsrrc/index.php [L] 
</IfModule> 
1

既然你已經使用<base href="/cvsrrc/" />$locationProvider.html5Mode(true).hashPrefix('!');您的網址刪除#!從url並添加cvsrrc /。所以它會工作,如果你從應用程序重定向應用程序。

但是,當你重新加載頁面時,它會嘗試使用URL與cvsrrc /來找到實際上並不存在的路徑。

所以,你必須使用重寫模塊在服務器上告訴重定向cvsrrc /到#/

+0

所以我會配置它到我的.htaccess你的意思是? Sir @Ankur Akvaliya –

+0

是的。取決於後端。我想你正在使用PHP。 –

+0

你可以查看這裏-http://stackoverflow.com/questions/38291535/page-refresh-gives-404你可以通過這個去了解更多有趣的東西來閱讀有關angularjs中html5模式和每個不同環境所需的配置https://github.com/angular-ui/ui-router/wiki/Frequently-Asked-Questions#how-to-configure-your-server-to-work-with-html5mode另外這個問題可能會幫助你$ location /切換html5和hashbang模式/鏈接重寫 –

0

要麼試試!

  1. 從路徑中刪除的決心。
  2. 配置後添加以下代碼:

    $ locationProvider.hashPrefix(「」);

  3. 分享您用於訪問該頁面的網址。

  4. 刪除您的基地的結尾「/」。