コンテンツにスキップ

ブラウザでVNCクライアントをレンダリングする

Last reviewed: about 2 years ago

Cloudflareは、クライアントソフトウェアや設定なしで、ブラウザ内に仮想ネットワークコンピュータ（VNC）ターミナルをレンダリングできます。

管理者はCloudflare Tunnelを使用して、VNCホストをCloudflareのネットワークに接続できます。Cloudflare Accessを使用すると、誰がVNCサーバーにアクセスできるかを決定するためのゼロトラストポリシーを適用できます。Cloudflareのネットワークはその後、ゼロトラストポリシーを強制し、ユーザーが許可されると、ブラウザ内にクライアントをレンダリングします。

この手順では、以下の内容をカバーします：

  • Linux仮想マシン上にCloudflare Tunnelをインストールして実行する
  • Linux仮想マシン上にVNCをインストールして設定する
  • ホストに到達できるユーザーを決定するためのゼロトラストポリシーを構築する
  • ブラウザでVNCサーバーをレンダリングする

完了までの時間：

10分

開始する前に

  1. Cloudflareにウェブサイトを追加します。
  2. アカウントでCloudflare Zero Trustを有効にします。
  3. アイデンティティプロバイダーをCloudflare Zero Trustに接続します。

仮想マシン上でVNCを設定する

このセクションでは、TightVNCとGNOMEデスクトップ環境を使用してVNCサーバーをインストールする方法を説明します。すでにVNCサーバーがインストールされている場合は、このステップをスキップできます。

  1. VMのターミナルウィンドウを開きます。

  2. VNCソフトウェアをインストールするには、次のコマンドを実行します：

    Terminal window
    sudo apt-get update
    

    sudo apt-get install gnome-core gnome-panel ubuntu-gnome-desktop tightvncserver

  3. インストールが完了したら、次のコマンドでVNCサーバーインスタンスを作成できます：

    Terminal window
    sudo tightvncserver

  4. VNCサーバーのパスワードを選択します。このパスワードは、ブラウザのVNCサーバーにログインする際に使用されます。

  5. 次のコマンドを実行して、VNCサーバーの設定ディレクトリに移動します。

    Terminal window
    cd .vnc

  6. xstartupファイルを開きます。

    Terminal window
    vim xstartup

  7. ファイルを次の設定に更新します（これはデモ用です — ブラウザベースのVNCはほとんどの設定で動作します）：

    xsetroot -solid grey
    x-terminal-emulator -geometry 80x24+10+10 -ls -title "$VNCDESKTOP Desktop" &
    #x-window-manager &
    

    # GNOMEが動作するように修正
    export XKL_XMODMAP_DISABLE=1
    /etc/X11/Xsession
    

    #gnome-session &
    gnome-panel &
    nautilus &

  8. VNCサーバーを作成するには、次のコマンドを実行します：

    Terminal window
    vncserver

この時点で、ブラウザベースのVNCでテストする準備が整ったVNCサーバーがあります。既存のVNCブラウザで簡単なテストを行い、続行する前に必要なパッケージや設定変更がないか確認することをお勧めします。VNCサーバーが望ましい状態で表示されたら、設定を続行してください。

マシン上でCloudflare Tunnelを設定する

  1. これらの手順に従ってcloudflaredをインストールします。

  2. 次のコマンドでcloudflaredを認証します：

    Terminal window
    cloudflared tunnel login

  3. 次のコマンドでトンネルを作成します：

    Terminal window
    cloudflared tunnel create <NAME>

  4. 次のコマンドでトンネル設定ファイルを作成します：

    Terminal window
    vim config.yml

  5. 設定ファイルに次の設定を追加します。

    tunnel: <NAME>
    ingress:
    - hostname: vnc.kennyatx.com
      service: tcp://localhost:5901
    - service: http_status:404

    その際、<HOSTNAME>をブラウザでVNCサーバーを公開するために使用したいドメインに置き換えます。また、5901をVNCサーバーが実行されているポートに置き換えます。ポートのリストを取得するには、sudo ss -lnptを実行し、VNCを探して設定ファイルに指定すべき値を確認します。

  6. トンネルをルーティングしますして、ウェブサイトに接続します。

  7. トンネルを実行します：

    Terminal window
    cloudflared tunnel --config path/config.yaml run <NAME>

  8. ファイアウォールが有効になっている場合は、このガイドに従ってCloudflare Tunnelのためにアウトバウンド接続を開きます。

この時点で、実行中のVNCサーバーと、受信VNCリクエストを受け入れる準備が整ったCloudflare Tunnelがあります。

ゼロトラストVNCアプリケーションを作成する

最後のステップは、ブラウザでVNCサーバーを実行するためのゼロトラストアプリケーションを作成することです。

  1. ゼロトラスト ↗に移動し、アクセス > アプリケーションを選択します。

  2. アプリケーションを追加を選択し、セルフホスト型を選択します。

  3. アプリケーションに名前を付け、VNCサーバーを公開したいドメインを設定します。

    VNCアプリケーションのドメイン名入力の例

  4. アローまたはブロックポリシーを追加します。この例では、@example.comで終わるメールアドレスを持つユーザーのみを許可しています。

    VNCアプリケーションのためのゼロトラストポリシー入力の例

  1. 追加設定で、ブラウザレンダリングを_VNC_に設定します。

ユーザーは、設定したアイデンティティプロバイダーを使用したログイン画面を見ることになります。認証が成功すると、VNCサーバーのパスワードを入力するように求められる場合があります。

各VNCインスタンスに対して詳細なアクセス制御を定義できます。

Cloudflare DashboardDiscordCommunityLearning CenterSupport Portal
Cookie Settings