8000 docs: update coder desktop docs with coder connect tunnel and trouble… · evnsh/coder@3ab51da · GitHub
[go: up one dir, main page]

Skip to content 8000

Commit 3ab51da

Browse files
committed
docs: update coder desktop docs with coder connect tunnel and troubleshooting
- Move 'Accessing web apps in a secure browser context' to troubleshooting section - Use compacted view (details/summary) for troubleshooting topics - Remove 'Issues updating Coder Desktop' section as requested Addresses coder#18071
1 parent 535a59e commit 3ab51da

File tree

1 file changed

+141
-3
lines changed

1 file changed

+141
-3
lines changed

docs/user-guides/desktop/index.md

Lines changed: 141 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
# Coder Desktop (Beta)
21

32
Use Coder Desktop to work on your workspaces as though they're on your LAN, no
43
port-forwarding required.
@@ -121,6 +120,145 @@ Before you can use Coder Desktop, you will need to sign in.
121120

122121
1. Coder Connect is now running!
123122

124-
## Next Steps
123+
## Coder Connect
124+
125+
While active, Coder Connect will list the workspaces you own and will configure your system to connect to them over private IPv6 addresses and custom hostnames ending in `.coder`.
126+
127+
![Coder Desktop list of workspaces](../../images/user-guides/desktop/coder-desktop-workspaces.png)
128+
129+
To copy the `.coder` hostname of a workspace agent, you can click the copy icon beside it.
130+
131+
You can also connect to the SSH server in your workspace using any SSH client, such as OpenSSH or PuTTY:
132+
133+
```shell
134+
ssh your-workspace.coder
135+
```
136+
137+
Any services listening on ports in your workspace will be available on the same hostname. For example, you can access a web server on port `8080` by visiting `http://your-workspace.coder:8080` in your browser.
138+
139+
> [!NOTE]
140+
> Currently, the Coder IDE extensions for VSCode and JetBrains create their own tunnel and do not utilize the Coder Connect tunnel to connect to workspaces.
141+
142+
### Ping your workspace
143+
144+
<div class="tabs">
145+
146+
### macOS
147+
148+
Use `ping6` in your terminal to verify the connection to your workspace:
149+
150+
```shell
151+
ping6 -c 5 your-workspace.coder
152+
```
153+
154+
### Windows
155+
156+
Use `ping` in a Command Prompt or PowerShell terminal to verify the connection to your workspace:
157+
158+
```shell
159+
ping -n 5 your-workspace.coder
160+
```
161+
162+
</div>
163+
164+
## Sync a local directory with your workspace
165+
166+
Coder Desktop file sync provides bidirectional synchronization between a local directory and your workspace.
167+
You can work offline, add screenshots to documentation, or use local development tools while keeping your files in sync with your workspace.
168+
169+
1. Create a new local directory.
170+
171+
If you select an existing clone of your repository, Desktop will recognize it as conflicting files.
172+
173+
1. In the Coder Desktop app, select **File sync**.
174+
175+
![Coder Desktop File Sync screen](../../images/user-guides/desktop/coder-desktop-file-sync.png)
176+
177+
1. Select the **+** in the corner to select the local path, workspace, and remote path, then select **Add**:
178+
179+
![Coder Desktop File Sync add paths](../../images/user-guides/desktop/coder-desktop-file-sync-add.png)
180+
181+
1. File sync clones your workspace directory to your local directory, then watches for changes:
182+
183+
![Coder Desktop File Sync watching](../../images/user-guides/desktop/coder-desktop-file-sync-watching.png)
184+
185+
For more information about the current status, hover your mouse over the status.
186+
187+
File sync excludes version control system directories like `.git/` from synchronization, so keep your Git-cloned repository wherever you run Git commands.
188+
This means that if you use an IDE with a built-in terminal to edit files on your remote workspace, that should be the Git clone and your local directory should be for file syncs.
189+
190+
> [!NOTE]
191+
> Coder Desktop uses `alpha` and `beta` to distinguish between the:
192+
>
193+
> - Local directory: `alpha`
194+
> - Remote directory: `beta`
195+
196+
### File sync conflicts
197+
198+
File sync shows a `Conflicts` status when it detects conflicting files.
199+
200+
You can hover your mouse over the status for the list of conflicts:
201+
202+
![Desktop file sync conflicts mouseover](../../images/user-guides/desktop/coder-desktop-file-sync-conflicts-mouseover.png)
203+
204+
If you encounter a synchronization conflict, delete the conflicting file that contains changes you don't want to keep.
205+
206+
## Troubleshooting
207+
208+
<details>
209+
<summary>Accessing web apps in a secure browser context</summary>
210+
211+
Some web applications require a [secure context](https://developer.mozilla.org/en-US/docs/Web/Security/Secure_Contexts) to function correctly.
212+
A browser typically considers an origin secure if the connection is to `localhost`, or over `HTTPS`.
213+
214+
As Coder Connect uses its own hostnames and does not provide TLS to the browser, Google Chrome and Firefox will not allow any web APIs that require a secure context.
215+
216+
> [!NOTE]
217+
> Despite the browser showing an insecure connection without `HTTPS`, the underlying tunnel is encrypted with WireGuard in the same fashion as other Coder workspace connections (e.g. `coder port-forward`).
218+
219+
If you require secure context web APIs, you will need to mark the workspace hostnames as secure in your browser settings.
220+
221+
We are planning some changes to Coder Desktop that will make accessing secure context web apps easier. Stay tuned for updates.
222+
223+
<div class="tabs">
224+
225+
### Chrome
226+
227+
1. Open Chrome and visit `chrome://flags/#unsafely-treat-insecure-origin-as-secure`.
228+
229+
1. Enter the full workspace hostname, including the `http` scheme and the port (e.g. `http://your-workspace.coder:8080`), into the **Insecure origins treated as secure** text field.
230+
231+
If you need to enter multiple URLs, use a comma to separate them.
232+
233+
![Google Chrome insecure origin settings](../../images/user-guides/desktop/chrome-insecure-origin.png)
234+
235+
1. Ensure that the dropdown to the right of the text field is set to **Enabled**.
236+
237+
1. You will be prompted to relaunch Google Chrome at the bottom of the page. Select **Relaunch** to restart Google Chrome.
238+
239+
1. On relaunch and subsequent launches, Google Chrome will show a banner stating "You are using an unsupported command-line flag". This banner can be safely dismissed.
240+
241+
1. Web apps accessed on the configured hostnames and ports will now function correctly in a secure context.
242+
243+
### Firefox
244+
245+
1. Open Firefox and visit `about:config`.
246+
247+
1. Read the warning and select **Accept the Risk and Continue** to access the Firefox configuration page.
248+
249+
1. Enter `dom.securecontext.allowlist` into the search bar at the top.
250+
251+
1. Select **String** on the entry with the same name at the bottom of the list, then select the plus icon on the right.
252+
253+
1. In the text field, enter the full workspace hostname, without the `http` scheme and port: `your-workspace.coder`. Then select the tick icon.
254+
255+
If you need to enter multiple URLs, use a comma to separate them.
256+
257+
![Firefox insecure origin settings](../../images/user-guides/desktop/firefox-insecure-origin.png)
258+
259+
1. Web apps accessed on the configured hostnames will now function correctly in a secure context without requiring a restart.
260+
261+
</div>
262+
263+
</details>
125264

126-
- [Connect to and work on your workspace](./desktop-connect-sync.md)

0 commit comments

Comments
 (0)
0