web.mdx 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136
  1. ---
  2. title: Web
  3. description: Using OpenCode in your browser.
  4. ---
  5. OpenCode can run as a web application in your browser, providing the same powerful AI coding experience without needing a terminal.
  6. ![OpenCode Web - New Session](../../assets/web/web-homepage-new-session.png)
  7. ## Getting Started
  8. Start the web interface by running:
  9. ```bash
  10. opencode web
  11. ```
  12. This starts a local server on `127.0.0.1` with a random available port and automatically opens OpenCode in your default browser.
  13. :::caution
  14. If `OPENCODE_SERVER_PASSWORD` is not set, the server will be unsecured. This is fine for local use but should be set for network access.
  15. :::
  16. :::tip[Windows Users]
  17. For the best experience, run `opencode web` from [WSL](/docs/windows-wsl) rather than PowerShell. This ensures proper file system access and terminal integration.
  18. :::
  19. ---
  20. ## Configuration
  21. You can configure the web server using command line flags or in your [config file](/docs/config).
  22. ### Port
  23. By default, OpenCode picks an available port. You can specify a port:
  24. ```bash
  25. opencode web --port 4096
  26. ```
  27. ### Hostname
  28. By default, the server binds to `127.0.0.1` (localhost only). To make OpenCode accessible on your network:
  29. ```bash
  30. opencode web --hostname 0.0.0.0
  31. ```
  32. When using `0.0.0.0`, OpenCode will display both local and network addresses:
  33. ```
  34. Local access: http://localhost:4096
  35. Network access: http://192.168.1.100:4096
  36. ```
  37. ### mDNS Discovery
  38. Enable mDNS to make your server discoverable on the local network:
  39. ```bash
  40. opencode web --mdns
  41. ```
  42. This automatically sets the hostname to `0.0.0.0` and advertises the server as `opencode.local`.
  43. ### CORS
  44. To allow additional domains for CORS (useful for custom frontends):
  45. ```bash
  46. opencode web --cors https://example.com
  47. ```
  48. ### Authentication
  49. To protect access, set a password using the `OPENCODE_SERVER_PASSWORD` environment variable:
  50. ```bash
  51. OPENCODE_SERVER_PASSWORD=secret opencode web
  52. ```
  53. The username defaults to `opencode` but can be changed with `OPENCODE_SERVER_USERNAME`.
  54. ---
  55. ## Using the Web Interface
  56. Once started, the web interface provides access to your OpenCode sessions.
  57. ### Sessions
  58. View and manage your sessions from the homepage. You can see active sessions and start new ones.
  59. ![OpenCode Web - Active Session](../../assets/web/web-homepage-active-session.png)
  60. ### Server Status
  61. Click "See Servers" to view connected servers and their status.
  62. ![OpenCode Web - See Servers](../../assets/web/web-homepage-see-servers.png)
  63. ---
  64. ## Attaching a Terminal
  65. You can attach a terminal TUI to a running web server:
  66. ```bash
  67. # Start the web server
  68. opencode web --port 4096
  69. # In another terminal, attach the TUI
  70. opencode attach http://localhost:4096
  71. ```
  72. This allows you to use both the web interface and terminal simultaneously, sharing the same sessions and state.
  73. ---
  74. ## Config File
  75. You can also configure server settings in your `opencode.json` config file:
  76. ```json
  77. {
  78. "server": {
  79. "port": 4096,
  80. "hostname": "0.0.0.0",
  81. "mdns": true,
  82. "cors": ["https://example.com"]
  83. }
  84. }
  85. ```
  86. Command line flags take precedence over config file settings.