공유 호스팅의 IIS에 Angular, ASP.NET Core WebAPI를 배포하는 방법

플라톤에 의해 재발행

팔로워 : 0

따라서 ASP.NET Core WebAPI를 사용하여 Angular 앱을 개발했으며 이를 공유 Windows 호스팅에 배포하려고 합니다. 공유 호스팅은 예산 계획을 제공하므로 준비된 환경에서 프로젝트를 시작하는 좋은 방법이지만 기능이 제한되어 있습니다.

귀하의 애플리케이션은 로컬 환경에서 원활하게 실행되고 있지만 공유 호스팅 계정에서 실행하려면 다음 단계를 고려하는 것이 좋습니다.

Angular 앱 빌드 및 배포
ASP.NET Core WebAPI 프로젝트 게시 및 배포

폴더 구조
공유 호스팅 환경에서 제한된 기능을 최대한 활용하기 위해 내 접근 방식은 프로젝트를 다음 폴더 구조로 구성하는 것입니다.

기사-20210109-01-폴더-구조.PNG

/api/
api 폴더에는 게시된 WebAPI 프로젝트가 포함됩니다.

/앱/
app 폴더에는 Angular 애플리케이션의 빌드 파일이 포함됩니다.

1.1 "environment/environment.prod.ts" 구성
WebAPI 프로젝트를 "/api" 폴더에 호스팅할 예정이므로 "environment.prod.ts" 파일을 다음과 같이 구성합니다.

export const environment = { production: true, apiUrl: '/api'
};

1.2 Angular 앱 빌드
Angular.IO 배포 가이드 빌드 절차에 대해 자세히 설명합니다. 다음 명령은 기본 경로가 "/app/" 폴더를 사용하도록 구성된 "dist" 폴더에 배포에 필요한 각도 파일을 준비합니다.

ng build --prod --output-path dist --base-href /app/

1.3 WEB.CONFIG 파일 추가
다음은 "web.config" 파일을 각도 앱 폴더에 추가하여 iis 재작성 규칙을 구성하는 것입니다.

<?xml version="1.0" encoding="UTF-8"?>
<configuration> <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="/app/" /> </rule> </rules> </rewrite> </system.webServer>
</configuration>

위의 파일이 준비되면 FTP(FileZilla의).

Visual Studio에서 ASP.NET Core WebAPI 프로젝트를 마우스 오른쪽 버튼으로 클릭하고 게시를 클릭하면 다음 화면이 표시됩니다. 다음과 같이 값을 구성합니다.
기사-20210109-02-aspnet-core-webapi-publish.PNG

다음을 클릭하고 이러한 설정을 구성합니다. 호스팅 공급자가 지원하는 .NET Core 5.0 버전을 사용하고 있습니다. 지원되는 .NET Core 버전은 호스팅 제공업체에 문의하세요. 저장을 클릭하여 설정을 마칩니다.
기사-20210109-03-aspnet-core-webapi-publish.PNG

프로젝트를 게시할 준비가 되었으며 지금 게시 버튼을 클릭합니다.
기사-20210109-04-aspnet-core-webapi-publish.PNG

Visual Studio는 다음 폴더에 게시된 파일을 생성합니다.

/bin/Release/publish/

호스팅 제공업체에 따라 Web.Config 파일에서 호스팅 모델을 변경해야 할 수 있습니다.
기사-20210109-05-aspnet-core-webapi-publish.PNG

기본적으로 "inprocess"로 구성됩니다. 다음과 같이 호스팅 모델을 "OutOfProcess"로 변경합니다.

<?xml version="1.0" encoding="utf-8"?>
<configuration> <location path="." inheritInChildApplications="false"> <system.webServer> <handlers> <add name="aspNetCore" path="*" verb="*" modules="AspNetCoreModuleV2" resourceType="Unspecified" /> </handlers> <aspNetCore processPath=".MyApp.WebAPI.exe" stdoutLogEnabled="false" stdoutLogFile=".logsstdout" hostingModel="OutOfProcess" /> </system.webServer> </location>
</configuration>

모든 파일이 성공적으로 게시되고 Web.Config 파일이 수정되면 게시된 폴더로 이동하여 공유 호스팅 계정의 API 폴더에 전체 콘텐츠를 XCopy합니다.