Skip to content

fix: use HTTPS for API and WSS for WebSocket connections#12

Merged
ailuckly merged 1 commit into
developfrom
feat/realtime-voice-stt-p0-p1
Apr 11, 2026
Merged

fix: use HTTPS for API and WSS for WebSocket connections#12
ailuckly merged 1 commit into
developfrom
feat/realtime-voice-stt-p0-p1

Conversation

@ailuckly
Copy link
Copy Markdown
Owner

  • Change VITE_APP_URL from http://:9009 to https:// in env files
  • Auto-detect ws/wss protocol based on page URL in aiChat.ts
  • Ensures getUserMedia works on HTTPS and WebSocket doesn't get blocked by mixed content policy

📌 变更内容

  • 如:新增用户登录 API
  • 如:修复登录失败时错误提示

✅ 测试验证

  • 本地运行通过
  • 自测通过
  • CI 流水线通过

PR 提交规范提醒:

  • 确保提交主题信息符合约定式提交规范 (feat/fix/docs/style/refactor/test/chore)
  • 确保代码已经通过本地测试
  • 确保没有提交敏感信息(密码、密钥等)

- Change VITE_APP_URL from http://:9009 to https:// in env files
- Auto-detect ws/wss protocol based on page URL in aiChat.ts
- Ensures getUserMedia works on HTTPS and WebSocket doesn't get
  blocked by mixed content policy
Copilot AI review requested due to automatic review settings April 11, 2026 15:17
@ailuckly ailuckly merged commit 9f89ed5 into develop Apr 11, 2026
2 checks passed
Copy link
Copy Markdown

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR updates the frontend’s API/WebSocket connection configuration to avoid mixed-content issues by moving staging/production URLs to HTTPS and switching WebSocket connections to WSS when appropriate.

Changes:

  • Update .env.test and .env.production to use https://{{HOST}} (removing :9009).
  • Update VocaTaWebSocketClient.connect() to choose ws vs wss dynamically and build the WS URL from VITE_APP_URL (with fallback to window.location.origin).

Reviewed changes

Copilot reviewed 3 out of 3 changed files in this pull request and generated 4 comments.

File Description
vocata-web/src/utils/aiChat.ts Builds WS URL using a derived protocol (ws/wss) and host computed from VITE_APP_URL.
vocata-web/.env.test Changes test env API base URL template to HTTPS and drops explicit port.
vocata-web/.env.production Changes production env API base URL template to HTTPS and drops explicit port.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment on lines +108 to +111
const appUrl = import.meta.env.VITE_APP_URL || window.location.origin
const isSecure = appUrl.startsWith('https')
const wsProtocol = isSecure ? 'wss' : 'ws'
const host = appUrl.replace(/^https?:\/\//, '')
Copy link

Copilot AI Apr 11, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

isSecure is derived from VITE_APP_URL, but the PR description says WS protocol should be auto-detected from the current page URL. In practice VITE_APP_URL is typically always set via .env.*, so this won’t switch to wss when the page is served over HTTPS but the env is misconfigured.

Consider deriving the protocol from window.location.protocol (fallback to env only when window is unavailable) and build the host via new URL(appUrl) (or similar) to avoid edge cases like trailing slashes or accidental paths producing wss://example.com//ws/... or wss://example.com/foo/ws/....

Suggested change
const appUrl = import.meta.env.VITE_APP_URL || window.location.origin
const isSecure = appUrl.startsWith('https')
const wsProtocol = isSecure ? 'wss' : 'ws'
const host = appUrl.replace(/^https?:\/\//, '')
const hasWindow = typeof window !== 'undefined'
const appUrl = hasWindow ? window.location.origin : import.meta.env.VITE_APP_URL
const baseUrl = new URL(appUrl)
const isSecure = hasWindow ? window.location.protocol === 'https:' : baseUrl.protocol === 'https:'
const wsProtocol = isSecure ? 'wss' : 'ws'
const host = baseUrl.host

Copilot uses AI. Check for mistakes.
Comment on lines 113 to 114
console.log('🔌 尝试连接WebSocket:', wsUrl)
console.log('🔐 使用Token:', token.substring(0, 20) + '...')
Copy link

Copilot AI Apr 11, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This logs part of the bearer token to the browser console. Even partial tokens can be sensitive when users share logs/screenshots or when console output is captured by monitoring tooling.

Recommend removing token logging or guarding it behind a strict development-only check (e.g., import.meta.env.DEV).

Suggested change
console.log('🔌 尝试连接WebSocket:', wsUrl)
console.log('🔐 使用Token:', token.substring(0, 20) + '...')
console.log('🔌 尝试连接WebSocket:', `${wsProtocol}://${host}/ws/chat/${this.conversationUuid}`)

Copilot uses AI. Check for mistakes.
Comment thread vocata-web/.env.test
# 测试环境配置
# 注意:VITE_APP_URL 将在CI/CD构建时动态替换
VITE_APP_URL=http://{{STAGING_HOST}}:9009
VITE_APP_URL=https://{{STAGING_HOST}}
Copy link

Copilot AI Apr 11, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This change removes the explicit :9009 port from VITE_APP_URL. If staging traffic still reaches the backend on a non-default port (or if TLS termination isn’t providing HTTPS on 443), API and WebSocket connections built from this value will break.

If the port is still required in some environments, keep it in the template (or introduce a dedicated port env var) so CI/CD substitution remains unambiguous.

Suggested change
VITE_APP_URL=https://{{STAGING_HOST}}
VITE_APP_URL=https://{{STAGING_HOST}}:9009

Copilot uses AI. Check for mistakes.
# 生产环境配置
# 注意:VITE_APP_URL 将在CI/CD构建时动态替换
VITE_APP_URL=http://{{PRODUCTION_HOST}}:9009
VITE_APP_URL=https://{{PRODUCTION_HOST}}
Copy link

Copilot AI Apr 11, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This change removes the explicit :9009 port from VITE_APP_URL. If production traffic still reaches the backend on a non-default port (or if TLS termination isn’t providing HTTPS on 443), API and WebSocket connections built from this value will break.

If the port is still required in some environments, keep it in the template (or introduce a dedicated port env var) so CI/CD substitution remains unambiguous.

Suggested change
VITE_APP_URL=https://{{PRODUCTION_HOST}}
VITE_APP_URL=https://{{PRODUCTION_HOST}}:9009

Copilot uses AI. Check for mistakes.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants