Thanks to visit codestin.com
Credit goes to github.com

Skip to content

docs: document CORS behavior between forwarded apps #7944

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Jun 12, 2023
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
111 changes: 111 additions & 0 deletions docs/networking/port-forwarding.md
Original file line number Diff line number Diff line change
Expand Up @@ -84,6 +84,117 @@ Valid `share` values include `owner` - private to the user, `authenticated` - ac

![Port forwarding from an app in the UI](../images/coderapp-port-forward.png)

### Cross-origin resource sharing (CORS)

When forwarding via the dashboard, Coder automatically sets headers that allow
requests between separately forwarded applications belonging to the same user.

When forwarding through other methods the application itself will need to set
its own CORS headers if they are being forwarded through different origins since
Coder does not intercept these cases. See below for the required headers.

#### Authentication

Since ports forwarded through the dashboard are private, cross-origin requests
must include credentials (set `credentials: "include"` if using `fetch`) or the
requests cannot be authenticated and you will see an error resembling the
following:

> Access to fetch at 'https://dev.coder.com/api/v2/applications/auth-redirect' from origin 'https://8000--dev--user--apps.dev.coder.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

#### Headers

Below is a list of the cross-origin headers Coder sets with example values:

```
access-control-allow-credentials: true
access-control-allow-methods: PUT
access-control-allow-headers: X-Custom-Header
access-control-allow-origin: https://8000--dev--user--apps.dev.coder.com
vary: Origin
vary: Access-Control-Request-Method
vary: Access-Control-Request-Headers
```

The allowed origin will be set to the origin provided by the browser if the
users are identical. Credentials are allowed and the allowed methods and headers
will echo whatever the request sends.

#### Configuration

These cross-origin headers are not configurable by administrative settings.

Applications can set their own headers which will override the defaults but this
will only apply to non-preflight requests. Preflight requests through the
dashboard are never sent to applications and thus cannot be modified by
them. Read more about the difference between simple requests and requests that
trigger preflights
[here](https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS#simple_requests).

#### Allowed by default

<table class="tg">
<thead>
<tr>
<th class="tg-0pky" rowspan="2"></th>
<th class="tg-0pky" rowspan="3"></th>
<th class="tg-0pky">From</th>
<th class="tg-0pky" colspan="3">Alice</th>
<th class="tg-0pky">Bob</th>
</tr>
<tr>
<th class="tg-0pky" rowspan="2"></th>
<th class="tg-0pky">Workspace 1</th>
<th class="tg-0pky" colspan="2">Workspace 2</th>
<th class="tg-0pky">Workspace 3</th>
</tr>
<tr>
<th class="tg-0pky">To</th>
<th class="tg-0pky">App A</th>
<th class="tg-0pky">App B</th>
<th class="tg-0pky">App C</th>
<th class="tg-0pky">App D</th>
</tr>
</thead>
<tbody>
<tr>
<td class="tg-0pky" rowspan="3">Alice</td>
<td class="tg-0pky" rowspan="2">Workspace 1</td>
<td class="tg-0pky">App A</td>
<td class="tg-0pky">✅</td>
<td class="tg-0pky">✅<span style="font-weight:400;font-style:normal">*</span></td>
<td class="tg-0pky">✅<span style="font-weight:400;font-style:normal">*</span></td>
<td class="tg-0pky">❌</td>
</tr>
<tr>
<td class="tg-0pky">App B</td>
<td class="tg-0pky">✅*</td>
<td class="tg-0pky">✅</td>
<td class="tg-0pky">✅<span style="font-weight:400;font-style:normal">*</span></td>
<td class="tg-0pky">❌</td>
</tr>
<tr>
<td class="tg-0pky">Workspace 2</td>
<td class="tg-0pky">App C</td>
<td class="tg-0pky">✅<span style="font-weight:400;font-style:normal">*</span></td>
<td class="tg-0pky">✅<span style="font-weight:400;font-style:normal">*</span></td>
<td class="tg-0pky">✅</td>
<td class="tg-0pky">❌</td>
</tr>
<tr>
<td class="tg-0pky">Bob</td>
<td class="tg-0pky">Workspace 3</td>
<td class="tg-0pky">App D</td>
<td class="tg-0pky">❌</td>
<td class="tg-0pky">❌</td>
<td class="tg-0pky">❌</td>
<td class="tg-0pky">✅</td>
</tr>
</tbody>
</table>

> '\*' means `credentials: "include"` is required

## SSH

First, [configure SSH](../ides.md#ssh-configuration) on your
Expand Down