2016-08-17 7 views
0

조각 식별자 (#)를 삭제하는 것과 관련하여 다른 게시물의 모든 내용을 시도했습니다. 모든 것이 # 식별자와 함께 작동하지만 프로젝트에 좋은 개선이 될 것입니다. Angularjs - URL에서 #을 삭제하는 방법 - 오류 : '기록'에 'pushState'를 실행하지 못했습니다.

  1. 나는 나의 index.html을에 <base href="app" />을 true로 설정
  2. 에 $의 locationProvider 및 설정 html5Mode 구성도 <base href="/" /> tryed. 내가 사용했습니다 <base href="/" />
  3. 기지를 설정하지 않고 requireBase: false. 누군가 다른 사람이 제안
  4. 내가 Web.config의에서 규칙을 썼다 제안 HTML5의 역사 API에 대한 브라우저 지원을 확인 if(window.history && window.history.pushState)$locationProvider.html5Mode(true) 포장
  5. .
  6. 내가봤을 때 찾을 수있는 모든 것을 시도했다.

    angular.js : 13708 오류 :와 문서에서 만들 수 없습니다 'http://sales/?_ijt=d1r1ladp5ro1tvflefsdpnfvd4'URL과 역사 상태 개체 : '역사'에 'pushState'을 실행하지 못했습니다

이 오류를 얻고있다 원점 'http://localhost:52471'및 URL 'http://localhost:52471/BeerbayCRM/BeerbayCRM/app/index.html?_ijt=d1r1ladp5ro1tvflefsdpnfvd4'

사용 가능한 환경 변수 목록보기 도움을 주시면 대단히 감사하겠습니다! 고맙습니다.

여기 내 코드입니다 :

app.config(['$routeProvider', '$locationProvider', '$httpProvider', 
 
    function($routeProvider, $locationProvider) { 
 

 
    $routeProvider 
 
     .when('/', { 
 
     templateUrl: "views/productsView.html" 
 
     }) 
 
     .when("/products", { 
 
     templateUrl: "views/productsView.html" 
 
     }) 
 
     .when("/sales", { 
 
     templateUrl: "views/salesView.html" 
 
     }) 
 
     .when("/charts", { 
 
     templateUrl: "views/chartsView.html" 
 
     }) 
 
     .otherwise({ 
 
     templateUrl: "views/productsView.html" 
 

 
     }); 
 

 
    if (window.history && window.history.pushState) { 
 

 
     $locationProvider.html5Mode({ 
 
     enabled: true 
 
     }); 
 
    } 
 
    } 
 
]) 
 

 
.controller("routeCtrl", function($scope, $location) { 
 
    $scope.setRoute = function(route) { 
 
    $location.path(route); 
 
    } 
 
});
<!DOCTYPE html> 
 
<html ng-app="myApp"> 
 

 
<head> 
 

 
    <!--.....all the dependencies are here.....--> 
 

 
    <base href="app" /> 
 

 
</head> 
 

 
<body ng-controller="myAppCtrl"> 
 
    <div class="navbar navbar-inverse"> 
 
    <a class="navbar-brand" href="#">Beerbay</a> 
 
    </div> 
 
    <div ng-controller="routeCtrl" class="col-sm-1"> 
 
    <a ng-click="setRoute('products')" class="btn btn-block btn-primary btn-lg">Products</a> 
 
    <a ng-click="setRoute('sales')" class="btn btn-block btn-primary btn-lg">Sales</a> 
 
    <a ng-click="setRoute('charts')" class="btn btn-block btn-primary btn-lg">Charts</a> 
 
    </div> 
 
    <ng-view/> 
 
</body> 
 

 
</html>

업데이트 : WebStorm 사용하는 것보다 별도의 노드 서버에서 응용 프로그램을 시작한 후, 그것은 부분적으로 노력하고 있습니다. 새로 고침 페이지를 누르면 페이지에서 간단한 메시지가 나타납니다. "얻을 수 없음/.... 부분보기 이름 *"

+0

시간이 없으므로 조각 식별자를 유지할 것이며 리디렉션을 다시 작성하도록 서버를 설정하는 것이 복잡해 보이지만 제안이나 솔루션을 공개하고 있습니다. 감사. –

답변

1

서버 리디렉션이 필요합니다. 서버에서 요청을 받으면 example.com/yoursite/some-page 기본적으로이 파일은 찾지 못할 때 해당 위치에서 일부 인덱스 파일을로드하려고 시도합니다. 웹 서버 구성에서 서버 측 리디렉션을 설정해야합니다./yoursite /로 시작하는 누락 된 경로는 /yoursite/index.html로 리디렉션하여 각도 라우팅이 처리 할 수 ​​있도록합니다. 당신은 지금 당신이 리디렉션을 처리 할 노드 서버를 구성하는 데 필요한 요청을 처리하는 것 노드 서버가있는 경우

https://docs.angularjs.org/guide/$location#server-side

Reloading the page gives wrong GET request with AngularJS HTML5 mode

참조, 개인적으로 만 수행 한 아파치와 Nginx 함께.

+0

설명해 주셔서 감사합니다. 나는 링크를 읽을 것이다. –