From cb1e4713c95aed15aca39e14ce2a5182c1241b15 Mon Sep 17 00:00:00 2001 From: "hazmi.arifin" Date: Tue, 23 Jan 2024 11:43:00 +0700 Subject: [PATCH 1/2] + add https config for nginx --- Dockerfile | 1 + nginx-https.conf | 58 ++++++++++++++++++++++++++++++++++++++++++++++++ replace.sh | 7 +++++- 3 files changed, 65 insertions(+), 1 deletion(-) create mode 100644 nginx-https.conf diff --git a/Dockerfile b/Dockerfile index 7366c4b4..1aafe02f 100644 --- a/Dockerfile +++ b/Dockerfile @@ -1,6 +1,7 @@ FROM sonicorg/sonic-client-web-base:v1.0.0 COPY nginx.conf /etc/nginx/nginx.conf +COPY nginx-https.conf /etc/nginx/nginx-https.conf COPY dist/ /usr/share/nginx/html/ COPY replace.sh / RUN chmod 777 /replace.sh diff --git a/nginx-https.conf b/nginx-https.conf new file mode 100644 index 00000000..7f225d77 --- /dev/null +++ b/nginx-https.conf @@ -0,0 +1,58 @@ +worker_processes 1; + +events { + worker_connections 1024; +} + +http { + default_type application/octet-stream; + include /etc/nginx/mime.types; + client_max_body_size 10G; + sendfile on; + client_header_timeout 3600; + client_body_timeout 3600; + keepalive_timeout 3600; + proxy_send_timeout 3600; + proxy_read_timeout 3600; + proxy_connect_timeout 3600; + + server { + listen 80; + server_name localhost; + return 301 https://$host$request_uri; + } + + server { + listen 443 ssl; + server_name localhost; + + ssl_certificate /etc/nginx/certs/cert.crt; + ssl_certificate_key /etc/nginx/certs/cert.key; + ssl_protocols TLSv1 TLSv1.1 TLSv1.2; + ssl_ciphers HIGH:!aNULL:!MD5; + + location / { + root /usr/share/nginx/html; + index index.html index.htm; + try_files $uri $uri/ /index.html; + } + + location /server/ { + proxy_pass http://sonic-server-gateway:3000/; + proxy_http_version 1.1; + proxy_set_header Upgrade $http_upgrade; + proxy_set_header Connection "upgrade"; + } + location /server/v3/api-docs/swagger-config { + #WORKAROUND fixed knife4j doc base path + return 200 '{"configUrl":"/server/v3/api-docs/swagger-config","oauth2RedirectUrl":"","operationsSorter":"alpha","tagsSorter":"alpha","urls":[{"name":"sonic-server-controller","serviceName":"sonic-server-controller","url":"/server/api/controller/v3/api-docs?group=default","contextPath":"/server/api/controller","order":1},{"name":"sonic-server-folder","serviceName":"sonic-server-folder","url":"/server/api/folder/v3/api-docs?group=default","contextPath":"/server/api/folder","order":2}],"validatorUrl":""}'; + } + + location /chrome/ { + proxy_pass http://localhost:9222/; + proxy_http_version 1.1; + proxy_set_header Upgrade $http_upgrade; + proxy_set_header Connection "upgrade"; + } + } +} diff --git a/replace.sh b/replace.sh index 4e0b27a4..02179523 100644 --- a/replace.sh +++ b/replace.sh @@ -1,4 +1,9 @@ nohup google-chrome --remote-debugging-address=0.0.0.0 --remote-debugging-port=9222 --no-sandbox --disable-dev-shm-usage --headless --disable-gpu >/dev/null 2>&1 & sed -i "s/SONIC_SERVER_HOST/${SONIC_SERVER_HOST}/g" /usr/share/nginx/html/assets/*.js sed -i "s/SONIC_SERVER_PORT/${SONIC_SERVER_PORT}/g" /usr/share/nginx/html/assets/*.js -/usr/sbin/nginx -c /etc/nginx/nginx.conf -g 'daemon off;' +sed -i "s/SONIC_SERVER_HTTPS/${SONIC_SERVER_HTTPS}/g" /usr/share/nginx/html/assets/*.js +NGINXCONF=/etc/nginx/nginx.conf +if [ "${SONIC_SERVER_HTTPS}" = "true" ]; then + NGINXCONF=/etc/nginx/nginx-https.conf +fi +/usr/sbin/nginx -c $NGINXCONF -g 'daemon off;' From 6c9dd1a3543aaaedb00aaa3b3ae4528f1edc7911 Mon Sep 17 00:00:00 2001 From: hazmi-e205 Date: Tue, 23 Jan 2024 15:14:48 +0700 Subject: [PATCH 2/2] + implement support HTTPS and can switch through Environment --- replace.sh | 7 ++++++- src/config/sysdefines.js | 12 ++++++++++++ src/http/axios.js | 5 ++++- src/views/RemoteEmulator/AndroidRemote.vue | 14 +++++++++----- src/views/RemoteEmulator/IOSRemote.vue | 9 ++++++--- 5 files changed, 37 insertions(+), 10 deletions(-) create mode 100644 src/config/sysdefines.js diff --git a/replace.sh b/replace.sh index 02179523..28f2143e 100644 --- a/replace.sh +++ b/replace.sh @@ -1,9 +1,14 @@ nohup google-chrome --remote-debugging-address=0.0.0.0 --remote-debugging-port=9222 --no-sandbox --disable-dev-shm-usage --headless --disable-gpu >/dev/null 2>&1 & sed -i "s/SONIC_SERVER_HOST/${SONIC_SERVER_HOST}/g" /usr/share/nginx/html/assets/*.js sed -i "s/SONIC_SERVER_PORT/${SONIC_SERVER_PORT}/g" /usr/share/nginx/html/assets/*.js -sed -i "s/SONIC_SERVER_HTTPS/${SONIC_SERVER_HTTPS}/g" /usr/share/nginx/html/assets/*.js NGINXCONF=/etc/nginx/nginx.conf if [ "${SONIC_SERVER_HTTPS}" = "true" ]; then NGINXCONF=/etc/nginx/nginx-https.conf + WSORIGINAL="ws:\/\/\${e}:\${t}\/websockets" + WSREPLACED="wss:\/\/${SONIC_SERVER_HOST}:${SONIC_SERVER_PORT}\/server\/websockets\/hub\/\${e}\/\${t}" + PROTORIGINAL="\`http:\/\/\`" + PROTREPLACED="\`https:\/\/\`" + sed -i "s/$PROTORIGINAL/$PROTREPLACED/g" /usr/share/nginx/html/assets/*.js + sed -i "s/$WSORIGINAL/$WSREPLACED/g" /usr/share/nginx/html/assets/*.js fi /usr/sbin/nginx -c $NGINXCONF -g 'daemon off;' diff --git a/src/config/sysdefines.js b/src/config/sysdefines.js new file mode 100644 index 00000000..459ac5c9 --- /dev/null +++ b/src/config/sysdefines.js @@ -0,0 +1,12 @@ +export default class SysDefines { + + getWebProtocol() { + // Replace to return "https://" for HTTPS Support + return `http://`; + } + + getWebsocketUrl(host, port) { + // Replace to return "wss://SONIC_SERVER_HOST:SONIC_SERVER_PORT/server/websockets/hub/${host}/${port}" for HTTPS Support + return `ws://${host}:${port}/websockets`; + } +} \ No newline at end of file diff --git a/src/http/axios.js b/src/http/axios.js index 59038163..0de00033 100644 --- a/src/http/axios.js +++ b/src/http/axios.js @@ -20,7 +20,9 @@ import qs from 'qs'; import { ElMessage } from 'element-plus'; import { i18n, $tc } from '@/locales/setupI18n'; import { router } from '../router/index.js'; +import SysDefines from '@/config/sysdefines'; +let sysDef = new SysDefines(); let baseURL = ''; if (process.env.NODE_ENV === 'development') { baseURL = 'http://localhost:3000/server/api'; @@ -30,9 +32,10 @@ if (process.env.NODE_ENV === 'production') { } const $http = axios.create(); baseURL = baseURL.replace(':80/', '/'); +baseURL = baseURL.replace('http://', sysDef.getWebProtocol()); $http.defaults.baseURL = baseURL; // $http.defaults.timeout = 20000; -$http.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest'; +// $http.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest'; $http.defaults.withCredentials = true; $http.defaults.paramsSerializer = (params) => qs.stringify(params, { arrayFormat: 'brackets' }); diff --git a/src/views/RemoteEmulator/AndroidRemote.vue b/src/views/RemoteEmulator/AndroidRemote.vue index 8847ab70..216ba72d 100644 --- a/src/views/RemoteEmulator/AndroidRemote.vue +++ b/src/views/RemoteEmulator/AndroidRemote.vue @@ -72,7 +72,7 @@ import { } from '@element-plus/icons'; import { useI18n } from 'vue-i18n'; - +import SysDefines from '@/config/sysdefines'; import AudioProcessor from '@/lib/audio-processor'; import wifiLogo from '@/assets/img/wifi.png'; import RenderDeviceName from '../../components/RenderDeviceName.vue'; @@ -496,17 +496,20 @@ const setImgData = () => { }; isShowImg.value = true; }; + +const sysDef = new SysDefines(); const openSocket = (host, port, key, udId) => { if ('WebSocket' in window) { + baseUrl = sysDef.getWebsocketUrl(host, port); // websocket = new WebSocket( - `ws://${host}:${port}/websockets/android/${key}/${udId}/${localStorage.getItem( + `${baseUrl}/android/${key}/${udId}/${localStorage.getItem( 'SonicToken' )}` ); // __Scrcpy = new Scrcpy({ - socketURL: `ws://${host}:${port}/websockets/android/screen/${key}/${udId}/${localStorage.getItem( + socketURL: `${baseUrl}/android/screen/${key}/${udId}/${localStorage.getItem( 'SonicToken' )}`, node: 'scrcpy-video', @@ -517,7 +520,7 @@ const openSocket = (host, port, key, udId) => { changeScreenMode(screenMode.value, 1); // terminalWebsocket = new WebSocket( - `ws://${host}:${port}/websockets/android/terminal/${key}/${udId}/${localStorage.getItem( + `${baseUrl}/android/terminal/${key}/${udId}/${localStorage.getItem( 'SonicToken' )}` ); @@ -1650,9 +1653,10 @@ const getDeviceById = (id) => { let audioPlayer = null; const isConnectAudio = ref(false); const initAudioPlayer = () => { + baseUrl = sysDef.getWebsocketUrl(agent.value.host, agent.value.port); audioPlayer = new AudioProcessor({ node: 'audio-player', - wsUrl: `ws://${agent.value.host}:${agent.value.port}/websockets/audio/${agent.value.secretKey}/${device.value.udId}`, + wsUrl: `${baseUrl}/audio/${agent.value.secretKey}/${device.value.udId}`, onReady() { isConnectAudio.value = true; }, diff --git a/src/views/RemoteEmulator/IOSRemote.vue b/src/views/RemoteEmulator/IOSRemote.vue index 5007fa68..d43fd23a 100644 --- a/src/views/RemoteEmulator/IOSRemote.vue +++ b/src/views/RemoteEmulator/IOSRemote.vue @@ -69,6 +69,7 @@ import { InfoFilled, } from '@element-plus/icons'; import { useI18n } from 'vue-i18n'; +import SysDefines from '@/config/sysdefines'; import PackageList from '@/components/PackageList.vue'; import RenderDeviceName from '../../components/RenderDeviceName.vue'; import PocoPane from '../../components/PocoPane.vue'; @@ -490,20 +491,22 @@ const setImgData = (data) => { }; isShowImg.value = true; }; +const sysDef = new SysDefines(); const openSocket = (host, port, key, udId) => { if ('WebSocket' in window) { + baseUrl = sysDef.getWebsocketUrl(host, port); websocket = new WebSocket( - `ws://${host}:${port}/websockets/ios/${key}/${udId}/${localStorage.getItem( + `${baseUrl}/ios/${key}/${udId}/${localStorage.getItem( 'SonicToken' )}` ); terminalWebsocket = new WebSocket( - `ws://${host}:${port}/websockets/ios/terminal/${key}/${udId}/${localStorage.getItem( + `${baseUrl}/ios/terminal/${key}/${udId}/${localStorage.getItem( 'SonicToken' )}` ); screenWebsocket = new WebSocket( - `ws://${host}:${port}/websockets/ios/screen/${key}/${udId}/${localStorage.getItem( + `${baseUrl}/ios/screen/${key}/${udId}/${localStorage.getItem( 'SonicToken' )}` );