iPad에서 WebSocket + Authorization이 연결되지 않음

7602 단어 websocketTheiaApache2.4iPad

어라? 연결되지 않는다!



발단은 iPad에서의 개발 환경을 정비하려고 했기 때문이었습니다.
VPS에 개발 환경을 넣을 수 있으면 편리하다고 생각해, Theia 를 인스톨 해, 그대로는 누구라도 사용할 수 버리므로, Apache를 리버스 프록시로 해, Digest 인증을 넣어, 한층 더 SSL로 해와, 구축해 왔습니다. 그런데 PC의 브라우저에서는 기대대로 이어지는데, iPad라면 연결되지 않는다. . .
의미가 없잖아!

PC의 경우



Theia는 Node.js에서 기본적으로 포트 3000에서 작동합니다.
Apache를 역방향 프록시로 https://example.com/theia/를 통해 액세스하도록 설정했습니다.
또한 Theia는 WebSocket에서 /theia/services 이하에 액세스하기 때문에 역방향 프록시 설정에서 /theia/services/에 대한 액세스가 ws://localhost:3000/services/에 액세스하도록 설정했습니다.
(자세한 내용은 여기 참조).

Apache 로그에 주요 요청 헤더를 출력한 결과는 다음과 같습니다.
(어떤 헤더를 출력할지는 브라우저의 개발자 툴로 확인하고 있습니다만, iPad의 경우와 비교하기 위해서, Apache의 로그에 출력해 확인하기로 했습니다.)
"GET /theia/services HTTP/1.1" 200
Authorization:"Digest username=\"watashi\", realm=\"DAuth\", nonce=\"xxxxx\", uri=\"/theia/services\", algorithm=MD5, response=\"yyyyy\", qop=auth, nc=0000000c, cnonce=\"zzzzz\"
Sec-WebSocket-Extensions:"permessage-deflate; client_max_window_bits"
Sec-WebSocket-Key:"mfnf6LozGNRKYis+K8NXhQ=="
Sec-WebSocket-Version:"13"
Upgrade:"websocket"

프로토콜이 "websocket"으로 업그레이드되고 Digest 인증을위한 Authorization 헤더도 있습니다 (일부 편집 중).

iPad의 경우


"GET /theia/services HTTP/1.1" 401
Authorization:"-"
Sec-WebSocket-Extensions:"x-webkit-deflate-frame"
Sec-WebSocket-Key:"3CEhfYMZMFoXy4yWzU+igQ=="
Sec-WebSocket-Version:"13"
Upgrade:"websocket"

같은 사이트를 방문한 결과입니다. 프로토콜이 "websocket"으로 업그레이드되었지만 Digest 인증을위한 Authorization 헤더가 없습니다!
크롬도 사파리도 마찬가지였다.
Sec-WebSocket-Extensions의 내용이 다르지만 압축과 관련된 매개 변수이므로 관련이없는 것 같습니다.

그렇다면 ... 아파치 양식 인증



'헤더가 없다면 쿠키를 먹으면 좋겠는데'라는 말대로 쿠키를 사용한 로그인 세션에서 예상대로 동작하는지 시도해 보겠습니다. Theia의 개조는 커녕, 뭔가 그것을 위해 만드는 것은 번거롭기 때문에 Apache Form 인증을 이용합니다.
sudo a2enmod hogehoge에서 모듈을 추가해야했지만 제 경우에는 다음이 필요했습니다. 지금까지 넣은 모듈에 따라 다르다고 생각하므로 Apache를 다시 시작하고 오류가 발생하는 경우 오류 메시지를 참조하여 추가하십시오.
  • auth_form
  • request
  • session_cookie
  • session_crypt
  • session

    • 사이트 구성은 이런 느낌.
    /             ←ここには何も置かない
|—- auth      ←login.htmlとかを置く
|—- theia     ←ここをForm認証の対象にする

    인증의 설정은 이런 느낌. https이면 http를 https로 변경합시다. 기본 인증과 동일한 .htpasswd를 만들어 놓습니다.

    000-default.conf
    
        <Location "/theia">
          AuthType Form
          AuthName "FormAuth"
          AuthUserFile /etc/apache2/.htpasswd
          AuthFormProvider file
          AuthFormLoginRequiredLocation http://%{SERVER_NAME}/auth/login.html
          Session On
          SessionCookieName auth_form path=/theia
          SessionCryptoPassphrase secure
          Require valid-user
        </Location>
        <Location "/dologin.html">
          SetHandler form-login-handler
          AuthFormLoginRequiredLocation http://%{SERVER_NAME}/auth/login.html
          AuthFormLoginSuccessLocation http://%{SERVER_NAME}/theia/
          AuthFormProvider file
          AuthUserFile /etc/apache2/.htpasswd
          AuthType Form
          AuthName "FormAuth"
          Session On
          SessionCookieName auth_form path=/theia
          SessionCryptoPassphrase secure
       </Location>
       <Location /dologout.html>
          SetHandler form-logout-handler
          AuthFormLogoutLocation http://%{SERVER_NAME}/auth/loggedout.html
          Session On
          SessionMaxAge 1
          SessionCookieName auth_form path=/theia
          SessionCryptoPassphrase secure
       </Location>

    login.html
    
<html>
  <body>
      <h1>Login for Theia.</h1>
      <form method="POST" action="/dologin.html">
         Username: <input type="text" name="httpd_username" value="" />
        <br>
        Password: <input type="password" name="httpd_password" value="" />
        <input type="submit" name="login" value="Login" />
     </form>
  </body>
</html>

    loggedout.html
    <html>
  <body>
    Logged out.
    <br>
    <a href="login.html">Login</a>
  </body>
</html>

    이것으로 마침내 할 수있었습니다!

    하지만 logout은 차례가 아닙니다
    Theia를 숨겨 보았습니다.
    Apache를 통해 Express에 연결하는 방법

    좋은 웹페이지 즐겨찾기

    개발자 우수 사이트 수집

    개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
    best100-homepage