URL의 각도 변경을 위한 IIS 설정 방법HTML5 모드의 JS 어플리케이션
나는 Angular를 가지고 있다.JS 시드 프로젝트와 추가했습니다.
$locationProvider.html5Mode(true).hashPrefix('!');
app.disc 파일로 이동합니다.IIS 7이 모든 요구를 라우팅하도록 설정하고 싶다.
http://localhost/app/index.html
이 일이 잘 풀리도록 하겠습니다.이거 어떻게 해?
업데이트:
IIS URL Rewrite 모듈을 검색, 다운로드 및 설치했습니다.이 모듈을 사용하면 목표를 쉽게 달성할 수 있을 것입니다.
업데이트 2:
제가 이루고자 하는 것을 요약한 것 같습니다(Angular에서 인용).JS Developer 매뉴얼):
이 모드를 사용하려면 서버 측에서 URL을 다시 써야 합니다.기본적으로 어플리케이션의 엔트리 포인트에 대한 모든 링크를 다시 써야 합니다(index.html 등).
업데이트 3:
아직 이 작업을 진행 중이며 다음과 같은 특정 URL을 리다이렉트할 필요가 없다는 것을 깨달았습니다.
http://localhost/app/lib/angular/angular.js
http://localhost/app/partials/partial1.html
따라서 css, js, lib 또는 partials 디렉토리에 있는 모든 것은 리다이렉트되지 않습니다.다른 모든 것은 app/index.html로 리다이렉트해야 합니다.
모든 파일에 규칙을 추가하지 않고도 쉽게 이 작업을 수행할 수 있는 방법을 알고 계십니까?
업데이트 4:
IIS URL Rewrite 모듈에는 2개의 인바운드 규칙이 정의되어 있습니다.첫 번째 규칙은 다음과 같습니다.
두 번째 규칙은 다음과 같습니다.
이제 localhost/app/view1로 이동하면 페이지가 로드되지만 지원 파일(css, js, lib 및 partials 디렉토리에 있는 파일)도 app/index.html 페이지로 다시 작성되기 때문에 어떤 URL을 사용하든 index.html 페이지로 돌아갑니다.이것은 이러한 URL이 두 번째 규칙에 의해 처리되지 않도록 해야 하는 첫 번째 규칙이 작동하지 않는다는 것을 의미합니다.생각나는 거 없어?너무 외로워...
.config 뒤에 web 규칙을 .$locationProvider.html5Mode(true)입니다.app.js
호프, 누굴 좀 도와줘
<system.webServer>
<rewrite>
<rules>
<rule name="AngularJS Routes" stopProcessing="true">
<match url=".*" />
<conditions logicalGrouping="MatchAll">
<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>
을 index.html에 했습니다.<head>
<base href="/">
서버에 IIS URL Rewrite 를 인스톨 하는 것을 잊지 말아 주세요.
또한 Web IIS를 가 "API" IIS"에 있는 경우 가 "API"에 있는 이 합니다.www.yourdomain.com/api세 번째 입력(조건의 세 번째 줄) 때문에 발생합니다.
DO의 IIS에 관한 정보입니다.을 내 브라우저 캐시 .<head> 페이지: index.contaces " ":
<base href="/myApplication/app/" />
에 다른 가 "localhost"로 입니다.localhost/app/view1localhost/myApplication/app/view1
이게 도움이 됐으면 좋겠네요!
다음 두 가지 조건만 있는 문제:
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
<add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
은, 「이것들은, 「」{REQUEST_FILENAME} 는 물리적으로 디스크에 존재합니다.즉, 잘못된 이름의 부분 뷰에 대한 요구가 404가 아닌 루트 페이지를 반환하는 시나리오가 있을 수 있습니다(또한 상황에 따라서는 불안정한 무한 루프가 발생할 수 있습니다).
따라서 다음과 같이 트러블 슈팅이 어려운 문제를 피하기 위해 안전한 '폴백' 규칙을 권장합니다.
<add input="{REQUEST_FILENAME}" pattern="(.*?)\.html$" negate="true" />
<add input="{REQUEST_FILENAME}" pattern="(.*?)\.js$" negate="true" />
<add input="{REQUEST_FILENAME}" pattern="(.*?)\.css$" negate="true" />
<conditions>
<!-- ... -->
<add input="{REQUEST_FILENAME}" pattern=".*\.[\d\w]+$" negate="true" />
</conditions>
제 경우 올바른 개서 규칙을 설정한 후에도 403.14가 계속 표시됩니다.알고 보니 URL 루트 중 하나와 이름이 같은 디렉토리가 있었습니다.IsDirectory 개서 규칙을 삭제하면 루트는 정상적으로 동작합니다.디렉토리 네거티브를 해제하면 문제가 발생할 수 있습니까?내 경우엔 아무것도 생각나지 않는다.제가 생각할 수 있는 유일한 경우는 당신의 앱으로 디렉토리를 참조할 수 있는지 여부입니다.
<rule name="fixhtml5mode" stopProcessing="true">
<match url=".*"/>
<conditions logicalGrouping="MatchAll">
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
</conditions>
<action type="Rewrite" url="/" />
</rule>
Angular와 IIS가 수동 갱신 시 404 상태 코드를 표시하는 것과 같은 문제가 있어 가장 많은 표를 얻은 솔루션을 시도했지만 효과가 없었습니다.WebDAV 및 핸들러 변경에 대처해야 하는 다른 솔루션도 많이 시도했지만 효과가 없었습니다.
다행히 이 솔루션을 찾았고 효과가 있었습니다(필요 없는 부품을 꺼냈습니다).따라서 위의 어느 것도 도움이 되지 않는 경우 또는 시도하기 전에라도 이 방법을 사용하여 IIS 문제에 대한 각도의 전개가 수정되는지 확인하십시오.
사이트의 루트 디렉토리에 있는 webconfig에 스니펫을 추가합니다.제가 알기로는 상속(applicationhost.config, machine.config)에서 404 상태 코드를 삭제하고 사이트 수준에서 404 상태 코드를 생성하여 커스텀 404 페이지로 홈페이지로 리다이렉트합니다.
<?xml version="1.0" encoding="UTF-8"?>
<configuration>
<system.webServer>
<httpErrors errorMode="Custom">
<remove statusCode="404"/>
<error statusCode="404" path="/index.html" responseMode="ExecuteURL"/>
</httpErrors>
</system.webServer>
</configuration>
유감스럽게도 이 문제의 최고 해결방법은 를 사용하는 데 도움이 되지 않았습니다.NET 프레임워크 4.5 및 IIS 6.2.먼저 Microsoft의 URL Rewrite 툴을 설치하기 위한 모든 단계를 수행한 후, 다음 단계를 조정하여 작동하도록 했습니다.Web.config다음 파일을 포함합니다.
<system.webServer>
<!-- handlers etc -->
<rewrite>
<rules>
<rule name="Angular Routes" stopProcessing="true">
<match url="(^(?!.*\.[\d\w]+$).*)" />
<conditions logicalGrouping="MatchAny">
<add input="{REQUEST_URI}" pattern=".*\/api\/.*" negate="true" />
</conditions>
<action type="Rewrite" url="./index.html" />
</rule>
</rules>
</rewrite>
</system.webServer>
첫 번째 정규식은 음의 룩어헤드(look-ahead)를 사용하여 URI의 끝에 있는 파일 확장자와 일치하지 않습니다.그런 다음 조건 내에서 다음을 포함한 모든 URI가/api/또한 무시됩니다.
이 구성을 사용하면 루팅을 중단하지 않고 Angular 앱을 새로 고칠 수 있으며 다시 작성하지 않고도 API에 액세스할 수 있습니다.
제가 찾은 가장 쉬운 방법은 404를 트리거하는 요청을 클라이언트로 리다이렉트하는 것입니다.이것은 해시태그를 추가함으로써 이루어집니다.$locationProvider.html5Mode(true)설정되었습니다.
이 속임수는 동일한 웹 사이트에 더 많은 웹 응용 프로그램이 있고 URL 무결성 제약 조건(예: 외부 인증)이 필요한 환경에서 작동합니다.방법은 다음과 같습니다.
index.displaces를 표시합니다.
설정<base>적절히 요소화하다
<base href="@(Request.ApplicationPath + "/")">
web.config
먼저 404를 커스텀페이지(예: "Home/Error")로 리다이렉트 합니다.
<system.web>
<customErrors mode="On">
<error statusCode="404" redirect="~/Home/Error" />
</customErrors>
</system.web>
홈 컨트롤러
심플한 구현ActionResult클라이언트측 루트의 입력을 「실행」합니다.
public ActionResult Error(string aspxerrorpath) {
return this.Redirect("~/#/" + aspxerrorpath);
}
이것이 가장 간단한 방법입니다.
url이 유효할 때만 404를 클라이언트로 리다이렉트하고 클라이언트에서 아무것도 발견되지 않을 때 404를 정상적으로 트리거하도록 개량된 논리로 Error 기능을 강화할 수 있습니다(권장 가능).이런 각진 경로가 있다고 가정해봅시다
.when("/", {
templateUrl: "Base/Home",
controller: "controllerHome"
})
.when("/New", {
templateUrl: "Base/New",
controller: "controllerNew"
})
.when("/Show/:title", {
templateUrl: "Base/Show",
controller: "controllerShow"
})
URL이 "/New" 또는 "/Show/"로 시작하는 경우에만 URL을 클라이언트로 리디렉션하는 것이 좋습니다.
public ActionResult Error(string aspxerrorpath) {
// get clientside route path
string clientPath = aspxerrorpath.Substring(Request.ApplicationPath.Length);
// create a set of valid clientside path
string[] validPaths = { "/New", "/Show/" };
// check if clientPath is valid and redirect properly
foreach (string validPath in validPaths) {
if (clientPath.StartsWith(validPath)) {
return this.Redirect("~/#/" + clientPath);
}
}
return new HttpNotFoundResult();
}
이것은 로직 개선의 예에 불과합니다.물론 웹 어플리케이션마다 요구가 다릅니다.
간단한 Angular 7 애플리케이션을 Azure Web 앱에 도입하려고 했습니다.페이지를 새로 고칠 때까지 모든 것이 잘 작동했습니다.그렇게 해서 500개의 에러 이동 콘텐츠를 제시하고 있었습니다.Angular 문서와 여러 포럼에서 web.config 파일을 전개된 솔루션에 추가하고 rewrite 규칙을 index.html 파일로 폴백해야 한다는 내용을 읽었습니다.몇 시간 동안 좌절과 시행착오 테스트를 거친 결과, 오류는 매우 간단하다는 것을 알게 되었습니다. 파일 마크업 주위에 태그를 추가하는 것입니다.
언급URL : https://stackoverflow.com/questions/12614072/how-do-i-configure-iis-for-url-rewriting-an-angularjs-application-in-html5-mode
'programing' 카테고리의 다른 글
| JSON 구문 분석 오류: java.time 인스턴스를 생성할 수 없습니다.LocalDate: String 값에서 역직렬화할 문자열 인수 생성자/공장 메서드가 없습니다. (0) | 2023.03.10 |
|---|---|
| 어떻게 하면 AngularJS에서 $watching을 멈출 수 있나요? (0) | 2023.03.10 |
| 스프링 부츠의 장점 (0) | 2023.03.10 |
| json을 사용하여 튜플을 인코딩하는 가장 좋은 방법 (0) | 2023.03.10 |
| Angular ng-messages: 비밀번호 확인 방법 (0) | 2023.03.10 |