Question

我正在使用AngularJS编写SPA产品，由Express使用NodeJS提供服务。 NodeJS / Express还为SPA提供API。在生产中，SPA将位于代理（Apache，或未来的nginx）之后 - 即使没有代理也存在以下问题。 ngRoute用于提供路由。

我最初在本地测试应用程序，一切正常。我将repo克隆到测试服务器，但由于某种原因，当我尝试使用该应用程序时，URL格式不正确。

通常，当页面加载应用程序时，重定向到localhost:8080/#/home（home是全能路径）。但是，在测试服务器上，它会重定向到domain.com/#!/home#%2Fhome。

如果我点击一个链接，该链接应该将URL更改为domain.com/#/quotations（href设置为相对，而不是绝对），我会得到domain.com/#!/home#%2Fquotations。

我的路由器配置：

app.config(['$routeProvider', function($routeProvider){
    // Routes
    $routeProvider
    .when('/home', {
        templateUrl: '/views/home/home.html'
    })
    .when('/staff', {
        templateUrl: '/module/staff/views/staff.html',
        controller: 'staffController',
        controllerAs: 'staff'
    })
    .when('/error', {
        templateUrl: '/views/error/error.html',
        css: '/views/error/error.css'
    })
    .otherwise({
        redirectTo: '/home'
    });
}]);

在我的主NodeJS服务器文件中，我只使用web.use(Express.static('public_html'))将Express设置为提供包含SPA的文件夹public_html。

我尝试将<base href="/">添加到我的index.html的头部，但这没有任何区别。 Angular和Express都没有配置为做任何不同的（比默认值）重写页面URL，所以我很困惑这个问题是什么。

Answer 1

在角度1.6美元的位置现在增加一个＆＃34;！＆＃34;如果你想删除它，你可以这样做：

appModule.config(['$locationProvider', function($locationProvider) {
  $locationProvider.hashPrefix('');
}]);

检查此问题，可能有所帮助...... Angular web app having extra ! in the url

Answer 2

根据您的路由，您应在头标记中使用<base href="@Url.Content("~/")" />，并在生产中使用#在路由配置中从网址中删除$locationProvider.html5Mode(true);。

这将解决问题，如果可行，您可以始终恢复基于角度的网址格式以使用#。

另一个选择是在节点配置中使用此代码：

<VirtualHost *:80>
  DocumentRoot "/public_html"
  ServerName domain.com
  ServerAlias www.domain.com
</VirtualHost>

Angular ngRoute重定向到格式错误的URL

2 个答案: