LoginSignup
0
0

More than 1 year has passed since last update.

CodeanywhereにVSCodeからSSH接続する

Posted at

この記事を読むとできること

(macの)VSCodeからCodeanywhereのcontainerに接続できる。

作業前に...

この記事では複数回、コピーしておいた文字列を貼り付ける必要があります。
メモ帳などに溜めながら読み進めることをお勧めします。

1. 公開鍵&秘密鍵を生成する

まずは、macでターミナルを開いて、以下を実行します。

公開鍵と秘密鍵のキーペアを生成
ssh-keygen -t rsa

色々聞かれますが、基本的にEnterで進みます。
image.png

これで、公開鍵と秘密鍵が生成されました。後で使うので公開鍵を表示してみましょう。

公開鍵の内容を表示
cat .ssh/id_rsa.pub

scsh 2021-12-03 0.46.03.png

ssh-rsaから始まる長い文字列が表示されればOK。コピーしておきましょう。

2. Codeanywhereに公開鍵を登録する

CodeanywhereでDashboardにアクセスして、Open IDEからcontainerを開きましょう。
image.png

CodeanywhereのTerminalが開いていない場合は、上部タブメニュー[Terminal]->[New Terminal]から開きましょう。
まずは、/home/caboxに移動します。

しばらくcontainerのTerminalを使うので、macのターミナルで実行しないように注意してください。

/home/caboxへ移動
cd /home/cabox

以下を実行してauthorized_keysというファイルを作成します。

authorized_keysを作成
touch .ssh/authorized_keys

次に、authorized_keysに、先ほどコピーしておいた公開鍵を書き込みます。
以下の<Your Public Key>の部分を先ほどコピーしたssh-rsaから始まる文字列に置き換えてから実行してください。

公開鍵をauthorized_keysに書き込む
echo "<Your Public Key>" > .ssh/authorized_keys 

これでCodeanywhereにSSH接続する準備が整いました。

3. macのターミナルからcontainerにSSH接続してみる

上部タブバー[Help]->[Getting Started]からGetting Startedを開きましょう。
SSH access to の右側に書いてあるhostから始まる文字列をコピーしておきましょう。
scsh 2021-12-03 1.18.25.png

それでは、macのターミナルから以下を実行します。

ssh接続
ssh cabox@<Host & Port>

@以降は先ほどコピーした文字列に置き換えてください。上の例だと以下のようになります。 ssh cabox@host31.codeanyhost.com -p 30533

以下のような表示が出れば接続完了です。Ctrl+Dで接続を解除しておきましょう。
image.png

4. VSCodeに拡張機能Remote-SSHを導入する

いよいよVSCodeからCodeanywhereにSSH接続します。
VSCodeを起動して、Shift+Command+Xで拡張機能バーを開きます。Remote SSHと検索して、インストールしましょう。

image.png

VSCodeの画面左下に緑色のボタンができていると思うので選択しましょう。
image.png

image.png

画面上部に表示されたリストからOpen SSH Configuration File->*/*/.ssh/configを選択しましょう。このパスは後で必要なので覚えておきましょう。

image.png

では、ファイルに書き込んでいきます。

先ほど覚えておいたパスと、3章で取得したhostXX.codeanyhost.com -p YYYYYを使います。

<Alias>には好きな名前を付けることができます。codeanywhereとかcontainerの名前にしておくとわかりやすいでしょう。

<Host>にはhostXX.codeanyhost.comを書いてください。
User caboxは変更せず書いてください。
<Port>にはYYYYYを、
<Path>には先ほど覚えておいた/*/*/.ssh/id_rsaを書いてください。

config
Host <Alias>
  HostName <Host>
  User cabox
  Port <Port>
  IdentityFile <Path>

以下のようになったでしょうか。ファイルを上書き保存しておきましょう。
image.png

では、もう一度左下の緑ボタンを選択して[Connect to Host...]を選択します。
image.png

先ほど<Alias>に入力したものが接続先として表示されているはずですので、選択します。
image.png

image.png

画面左下にSSH:〜と表示され、SSH接続が出来ました。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0