ng-viewport를 사용하여 index.html에 내 페이지를 표시하고 HTML 5 모드에서 기본 URL (예 : http://localhost:86)을 열면 모든 것이 정상적으로 작동합니다 내 집이나 방문 페이지 인 (http://localhost:86/app/dashboard)로 바뀌면 다른 모든 리디렉션이 제대로 작동합니다.HTML 5 모드 딥 링크 및 새로 고침이 작동하지 않음 AngularJS
우리는 전체 URL (예 : http://localhost:86/app/dashboard)을 직접 열려고 시도하고 내 index.html 페이지를로드하지만 로고 및 이미지와 같은 정적 콘텐츠 만 표시하고 내 동적 웹 페이지를 표시하지 않으면 문제가 발생합니다. ng-viewport 섹션에 표시됩니다. 페이지를 새로 고침 할 때도 동일한 동작이 발생합니다.
다음은 내가 작성한 코드입니다.
JS 코드
$locationProvider.html5Mode({ enabled: true });
HTML 코드
<head>
<base href="/"/>
</head>
<body>
<div>
<img class="rotate" src="../assets/img/logo_img.png" />
</div>
<div style="height: 100%" ng-viewport autoscroll>
</div>
</body>
의 Web.config
<?xml version="1.0" encoding="UTF-8"?>
<system.webServer>
<defaultDocument>
<files>
<clear />
<add value="index.html" />
<add value="Default.htm" />
<add value="Default.asp" />
<add value="index.htm" />
<add value="iisstart.htm" />
<add value="default.aspx" />
</files>
</defaultDocument>
<security>
<requestFiltering>
<hiddenSegments>
<remove segment="App_Data" />
</hiddenSegments>
</requestFiltering>
</security>
<rewrite>
<rules>
<clear />
<rule name="AngularJS" enabled="true">
<match url=".*" />
<conditions logicalGrouping="MatchAll" trackAllCaptures="false">
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
<add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
<add input="{REQUEST_URI}" pattern="^/(Api)" negate="true" />
</conditions>
<action type="Rewrite" url="/" />
</rule>
</rules>
</rewrite>
</system.webServer>
경로 설정 코드
static $routeConfig = [{
path: '/dashboard/:type',
component: 'dashboard'
}, {
path: '/dashboard',
component: 'dashboard'
}, {
path: '/mail',
component: 'mail'
}, {
path: '/solution/:id',
component: 'solutionDetails'
}]