입문

이 글은 Microsoft Azure Advent Calendar 2016의 이튿날 글이다.
전날은 nntsugu@github 씨였는데, 보도 내용은... null pointer exception이죠.

TL;DR

Azure 운용에서 얻은 버퍼 기술 소개

공식 언급 특별한 설명이 없는 항목

무엇이 가장 좋은지, 여기에 정답이 없다

이번 내용.

많은 바드 팁 (hacks)
1: 여러 저장소 배포 방법
2: 배포 스크립트 대기 시간 연장 방법
3: 포탈의 CORS 설정을 사용하면 머리가 닿지 않아요.
4: SiteExtension의 Reverse Proxy 침묵
5: 환경 변수를 사용하여 설정 값 유지
6: 웹 Apps의 무료 프레임워크에서 ssl 사용하기
잘못된 구성 방지

요구 사항

흔히 볼 수 있는 웹 서비스는 다음과 같습니까?
백엔드

+ PHP
+ composerを使ってパッケージ管理する
+ DB接続あり
+ ユーザー認証あり

프런트 엔드

+ Node.js
+ npmを使ってパッケージ管理する
+ npmを使ってビルドする

이런 상황에서 다음은 hacks입니다.

hacks01: 반모드: 서브모듈 지옥

WebApps 환경 구축을 위한 저장소
프론트 소스
백엔드 코드
repos
Dir
WebApps 환경 구축을 위한 저장소
/
프런트엔드 하위 모듈(PHP)
/app/
후단자 모듈
/view/
공통 영역 루트: /app/public/하위 모듈에 액세스할 수 있는 권한이 없으므로 인증용 Deploy Key는 하나일 수 있습니다.
GitHub에서 submodule 협업 시
WebApps에서 생성된 DeployKey를 저장소의 DeployKey에서 일시적으로 제거
GitHub 사용자의 SSH Keys가 다시 등록됩니다.
Deploy key가 인스턴스에 토출되기 때문에D:\home\.ssh\id_rsa.pub나는 그것을 주워서 붙였다.

그리고 하크식 방법도 힘들기 때문에 추천하지 않습니다!

hacks02: 반모드: 너무 복잡한 구축 스크립트

예를 들어 Node.js와 PHP가 혼합된 상황에서

npm install

npm run build

composer install

공개 영역에서 구축된 응용 프로그램 업데이트

migrate 데이터베이스

버려진 함수에 대한 지원이 부족합니다.
그것들을 파일로 나누어 호출할 수도 있다

@echo off

call deploy.node.cmd
call deploy.front.cmd
call deploy.api.cmd

echo Copy frontend components.
call xcopy "%DEPLOYMENT_TARGET%\front\dist" "%DEPLOYMENT_TARGET%\api\public" /E /H /R /Y

단번에 했지만 어디서 잘못되면 남은 임무는 내팽개쳐 버린다.
안 좋은데.
줄타기는 위험하니 멈춰라.
트랩 1: 패키지.제이슨 그거.
하위 모듈 배치 등에서 프로젝트의 루트를 제외하고package.하면, 만약, 만약...
배치 스크립트를 다시 써야 합니다.

:: 2. Install npm packages
IF EXIST "%DEPLOYMENT_TARGET%\package.json" (
  pushd %DEPLOYMENT_TARGET%
  echo Install npm components.
  call npm install --no-optional
  echo Build frontend components.
  call npm run build
  IF !ERRORLEVEL! NEQ 0 goto error
  popd
)

디렉터리 등 지정하기

:: 2. Install npm packages
IF EXIST "%DEPLOYMENT_TARGET%\view\package.json" (
  pushd %DEPLOYMENT_TARGET%\view
  echo Install npm components.
  call npm install --no-optional
  echo Build frontend components.
  call npm run build
  IF !ERRORLEVEL! NEQ 0 goto error
  popd
)

또한 Node는 다음과 같습니다.동적 입력 프롬프트에서 클릭
만약 package.json 프로젝트의 루트 디렉터리에 있지 않다면 package.json디렉터리 변경을 따르지 않으면 노드 버전을 변경할 수 없습니다.

{
  "engines":{
    "node": "^6.9.1"
  }
}

트랩 2: SCM_COMMAND_TIMEOUT
출력 없는 대기 시간 처리(PHP composer 등)
처리에 시간이 걸리면 스크립트 배치 시간이 초과되어 분실됩니다.
나중에 배치할 일괄에서 Y/n 확인 등 입력 처리를 기다리는 것을 잊어버리면 시간 초과만 기다릴 수 있습니다./view/package.json의 값은 초수를 더하면 길어지지만 양날의 검이다.(길면 배치가 끝나지 않는 지옥)
기본값은 60입니다.

hacks03: 반모드: 무시된 http 헤더

각 인스턴스에 대해 Azure portal에서 CORS를 지정할 수 있습니다.

하지만 그곳에서 설정하면 사용자 정의 머리를 찰 수 있다.이 방법에는 SCM_COMMAND_IDLE_TIMEOUT 헤드가 추가되지 않습니다.

Document Microsoct Azure｜ App Service의 CORS 및 웹 API의 CORS

CORS 를 사용하여 활성화Access-Control-Allow-Credentials하면 각 인스턴스의 CORS 설정에 아무것도 넣지 않습니다.
그리고 응용 프로그램으로 제목을 쓰거나 credencials 파일에 쓰십시오.
참조:
http://m2wasabi.hatenablog.com/entry/2016/11/30/123538

hacks04: 미묘한 점: 조용한 Reverse Proxy

Site Extension에는 ReverseProxy가 있습니다.
전송 원본 정보를 추가하지 않고 전송 목적지 서버에 다시 쓰기 요청만 보내기 때문에
전송 대상 서버를 보면 어디서 접근했는지 알 수 없습니다.
API에 액세스하는 웹 응용 프로그램을 공유하는 것은 매우 고통스럽습니다.

또한 전송 대상 서버는 Web.config의rewrite roules에 기술합니다
Azure에서는 환경 설정을 여기에 삽입하기 어렵다
직접 써야 돼요.
이것은 자동화를 어렵게 한다.
Reverse Proxy의 출처는 공개되지 않았으며, 아마도 스스로 쓸 수밖에 없을 것이다.
자동 배치에 삽입할 수 있는 좋은 역방향 에이전트 확장이 있다면 소개해 주십시오.

hacks05: 서버별 설정을 환경 변수에 투입

응용 프로그램이 설정한 항목에서 각 응용 프로그램의 환경 변수를 지정할 수 있습니다.
환경 변수의 선택 방법은 처리 시스템에 따라 다르다.

실제 줍는 방법은 다음과 같다.

Node.js

process.너는 env에서 주울 수 있다

Webpack with Node.js

Webpack definision 플러그인에서 텍스트 지정하기
구축된 후에도 구축할 때의 환경 변수를 사용할 수 있다.
참조:
http://qiita.com/mikakane/items/5ab96c4c7e187ab6c9f1

PHP

phpdotenv 사용하기Web.config 파일에 쓰는 것이 더 좋을 수 있습니다.
응용 프로그램에서 .env 파일을 통해 환경 설정
로컬 개발 환경 등 다른 서버에서 실행할 때 .env 파일을 교체하십시오.
Azure 특유의 운용 방법으로 배포 스크립트에서 다음과 같이 기술한다.
azure의 경우 프로필을 참고할 수 있습니다.
.env.azure

APP_ENV=production
DB_HOST=${MYSQL_DB_HOST}
DB_NAME=${MYSQL_DB_NAME}
...

copy /Y .env.azure .env

hacks06: 웹 앱의 무료 프레임워크에서 ssl 사용하기

WebApps의 SSL 액세스는 유료 서비스 계획에서만 사용할 수 있습니다.
동일한 서비스 계획에 App Service가 ON으로 인증된 인스턴스가 있는 경우
다른 실례도 https 접근을 사용했습니다.

따라서 인증이 유효한 가상 웹 앱을 만들면 https를 통해 접근할 수 있겠지.

이상적인 백엔드 구성

배포 스크립트는 가능한 한 간단합니다.

다중 언어의 혼합 서버가 걷잡을 수 없이 변했기 때문에 멈춰라.
지속적인 배포 활용
모든 사용하는 체계 구조는 반드시 실례를 세워야 한다.

배포 스크립트 만들기

사전에 알지 못한 상황에서 사용자 정의 배치 스크립트를 작성하는 것은 매우 어렵다.
따라서 azure-cli를 사용하여 배치 스크립트의 산란을 만듭니다.
Node.js의 프로그램 라이브러리이기 때문에 환경 보호입니다.

npm install -g azure-cli

저장소의 루트에 서서 다음 명령을 사용하여 생성.env 및 .deploymentNode

azure config mode asm
azure site deploymentscript --node

PHP

azure config mode asm
azure site deploymentscript --php

DotNet

azure config mode asm
azure site deploymentscript --aspWAP pathToYourWebProjectFile.csproj -s pathToYourSolutionFile.sln

생성된 파일을 저장소로 종합한 후
azure에 배치할 때 자동으로 배치 스크립트로 이동합니다.
Node.js야.NET 샘플을 찾으면 찾을 수 있어요.
PHP 샘플을 못 찾아서 만들었어요.
deploy.cmd
자신이 쓴 것은 아래의 부분뿐이다.

:: 2. Install composer
IF EXIST "%DEPLOYMENT_TARGET%\composer.json" (
  pushd "%DEPLOYMENT_TARGET%"

  IF NOT EXIST "%DEPLOYMENT_TARGET%\composer.phar" (
    echo Download composer installer
    call :ExecuteCmd php -r "copy('https://getcomposer.org/installer', 'composer-setup.php');"
    IF !ERRORLEVEL! NEQ 0 goto error
    echo Install Composer
    call :ExecuteCmd php composer-setup.php
    IF !ERRORLEVEL! NEQ 0 goto error
    echo Deleting installer
    call :ExecuteCmd php -r "unlink('composer-setup.php');"
    IF !ERRORLEVEL! NEQ 0 goto error
  )

  echo Composer self update
  call :ExecuteCmd php composer.phar self-update
  IF !ERRORLEVEL! NEQ 0 goto error
  echo Install Composer plugin
  call :ExecuteCmd php composer.phar global require "hirak/prestissimo"
  IF !ERRORLEVEL! NEQ 0 goto error

  echo Composer install
  call :ExecuteCmd php composer.phar install --no-dev
  IF !ERRORLEVEL! NEQ 0 goto error
  popd
)

:: 3. Laravel update
IF EXIST "%DEPLOYMENT_TARGET%\.env.azure" (
  pushd "%DEPLOYMENT_TARGET%"
  echo Copy .env file
  call :ExecuteCmd copy /Y ".env.azure" ".env"
  echo Migrate database
  call :ExecuteCmd php artisan migrate --force
  IF !ERRORLEVEL! NEQ 0 goto error
  popd
)

API 서버 및 프런트엔드 분리

프런트엔드와 백엔드가 분리된 경우
다음 응용 프로그램 구성을 고려할 수 있습니다.

CASE1: CORS를 통한 API 서버 교환

인증 주변에 대해 프런트엔드, 백엔드에 각각 기술 요구

데이터 낭비 없음, 네트워크 친화적

CASE2: 프런트엔드 및 API 서버를 리버스 프록시로 교체

CORS가 번거로운 곳은 인프라를 통해 흡수할 수 있다

프로그래머의 입장에서 보면 사이트 내 링크와 같기 때문에 2000년대 기술의 로트 엔지니어도 사용할 수 있다

마지막

번거로울 것 없이 CI 서버에서 로컬 Git를 관리하는 것이 좋지 않습니까?
그렇게 생각하지만 가장 좋은 구성에 관해서는 길을 잃었다.
Azure의 어둠에 관해서는 아직 다 쓸 수 없는 곳이 많다
나는 그 속에서 광명을 잡고 전진하고 싶다.
그리고 App Service on Linux도 편리해 보여서 한번 써보고 싶어요.
기존 앱 서비스와 동거 & 무료 프레임워크가 존재하지 않기 때문에 지갑과 상의하면서 사용해야 한다.

그럼 다음 이벤트 달력은...

Microsoft Azure Advent Calendar 2016
내일은 @ksasaki 선생님입니다.잘 부탁드립니다.