angularjs - "base href"使用 ui-router 在路由 url 中添加目录路径

Question

摘要:

当使用<base href="/prod/public/" />时，它在路由 url 中添加目录路径 e.x. http://www.example.com/prod/public/home

我的 Angular 应用程序托管在 prod/public目录。

在我的public/index.html :

<base href="/prod/public/" />

我的路线是这样的:

$stateProvider
     .state('home', {
      url: '/home',
      templateUrl: function($stateParams) {
          var path = 'app/users/views/home.html';
          return path;
      },
      controller: 'HomeCtrl'
})

目录结构:

public_html
      -.htaccess
      - other folders
      - prod
           - public
                - app
                - index.html
           - bower.json
           - .htaccess
           - package.json
           - gulpfile.js
           - Readme.md

<强> .htaccess 里面 prod 目录:

RewriteEngine On
Options -Indexes
RewriteCond %{HTTP_HOST} ^example\.com$ [NC]
RewriteRule ^ http://www.%{HTTP_HOST}%{REQUEST_URI} [L,R=301,NE]

RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^ public/index.html [L]

这是我在模板中引用状态的方式:

<a ui-sref='home'>Go to home</a>

当点击此链接时，它会重定向到此网址:http://www.example.com/prod/public/home

要求:

网址应为 http://www.example.com/home 而不是 http://www.example.com/prod/public/home

Answer 1

<base href="/prod/public/"/>在 Angular 路由中，不是设置文档根/屏蔽 url，而是在 HTML5 模式下使用定义的 url 来添加 url。

当您定义路线时，例如 /home Angular 会将 URL 正确设置为 /prod/public/home 。如果您希望 URL 没有该文件夹结构，那么您需要将文件放在根目录中(特别是在共享托管的情况下)或更改 Nginix/Apache 文档根设置以指向正确的路径。然后，您可以设置这将使您的网址读取为/home 等