11

ベース href で大文字と小文字が区別されるように見える理由を理解するのに苦労しています。ベース href を持つページがあり、angularjs ルーティングを利用しています。

html:

<html ng-app="app">
    <head>
        <base href="/Foo/"/>
    </head>
    <body>
        <div>Foo</div>
        <div ng-view></div>  
    </body>
</html>

js:

var module = angular.module('app', []);

module.config(function ($routeProvider, $locationProvider) {
    $routeProvider
        .when('/Home/Page1', { templateUrl = 'partials/page1' })
        .otherwise({ redirectTo: '' });

     $locationProvider.html5Mode(true);
     $locationProvider.hashPrefix('!');
});

http://www.example.com/Foo/に移動すると、問題ありません。しかし、http://www.example.com/foo/に移動すると、Angular エラーが発生します。

Error: Invalid url "http://www.example.com/foo/", missing path prefix "/Foo" !
at Error (<anonymous>)
at Object.LocationUrl.$$parse (http://www.example.com/foo/Scripts/angular.js:4983:13)
at Object.LocationUrl (http://www.example.com/foo/Scripts/angular.js:5014:8)
at $LocationProvider.$get (http://www.example.com/foo/Scripts/angular.js:5387:21)
at Object.invoke (http://www.example.com/foo/Scripts/angular.js:2809:28)
at http://www.example.com/foo/Scripts/angular.js:2647:37
at getService (http://www.example.com/foo/Scripts/angular.js:2769:39)
at Object.invoke (http://www.example.com/foo/Scripts/angular.js:2787:13)
at $CompileProvider.directive (http://www.example.com/foo/Scripts/angular.js:3613:43)
at Array.forEach (native) angular.js:5582

それが役立つ/違いを生む場合、サイトは IIS でホストされ、MVC 4 を使用しています。

4

6 に答える 6

12

anglejsルートプロバイダーの大文字と小文字の区別をオフにする必要があります。

この機能の詳細を確認してください： URL照合のオプションを追加しますcaseInsensitiveMatch

于 2013-03-08T02:33:59.900 に答える
7

私は UI ルーターを使用しているため、ngRoute で提案されている方法を使用してルートの大文字と小文字の区別を解決できませんでした。https://github.com/angular-ui/ui-router/issues/197の解決策は 、ルートでは機能しましたが、投稿された元の問題である base href の問題では機能しませんでした。

basehref と url を小文字に設定する $browser のデコレータを追加することで、この問題を解決できました。問題を引き起こしている beginWith メソッドで問題を引き起こしている値の比較元を見ると、それらが最終的に $browser から発生していることがわかります。

最終的に、そのソリューションはルートと base href の大文字と小文字の区別の両方を解決し、$urlRouterProvider の提案は必要ありませんでした。したがって、DOM に明示的に設定された base href 要素がない場合は、そのリンクで提案されている $urlRouterProvider ルールが問題を解決します。それ以外の場合、これは base href とルートの両方を解決します。

base href と ui-router を使用したルーティングの両方の問題を解決した完全なソリューション:

  $provide.decorator('$browser', [
                    '$delegate', function($delegate) {

                        var _baseHref = $delegate.baseHref,
                            _url = $delegate.url;

                        $delegate.baseHref = function() {
                            return angular.lowercase(_baseHref());
                        };
                        $delegate.url = function(url, replace) {
                            // no need to modify the setter
                            if (url) {
                                return _url(url, replace);
                            }
                            // just lowercase the getter
                            return angular.lowercase(_url());
                        };
                        return $delegate;
                    }
                ]);
于 2015-03-25T14:25:20.557 に答える
6

同じ問題がありましたが、別の解決策があります。これは私にとってはうまくいき、ルーティング、beginsWith、または小文字である/小文字である必要があるという仮定を妨げません。

angularが初期化される前にこれを配置します（htmlページのヘッドのように）

// Fix base url being case sensitive
(function () {
     var base = document.querySelector("base");
     var normalized = RegExp(base.href, "i").exec(location.href);
     base.href = normalized ? normalized[0] : base.href;
}());
于 2016-07-01T11:27:58.693 に答える
2

この問題の良い解決策は、$route のデコレーターを作成し、大文字と小文字を区別しないようにルールを設定することです。このようにすると、「いつ」ごとにフィールド caseInsensitiveMatch を作成する必要がなくなります。この URL で、このソリューションの詳細を確認できます: http://iranreyes.com/angularjs-decorating-route

于 2014-11-20T13:15:45.180 に答える
0

今日現在、caseInsensitiveMatch は AngularJS 1.0.7 の安定版には含まれていませんが、不安定版 1.1.5 には含まれています ( https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular .min.js ) テスト済みで、期待どおりに動作しています

于 2013-07-27T16:21:33.390 に答える
0

ベースURLではなくルートにのみ影響するため、受け入れられた回答は機能しません。これは、Angular 開発者にとって修正が「難しすぎる」と思われるバグです。参照 - https://github.com/angular/angular.js/issues/4056

これを自分で修正するには、angular.js の beginWith() 関数を書き直して、小文字で比較する必要があります --

function beginsWith(begin, whole) {
	if (whole.toLowerCase().indexOf(begin.toLowerCase()) === 0)
	{
    return whole.substr(begin.length);
  }
}

于 2014-12-27T01:20:10.130 に答える