laipeng/reflex
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

state.js: determine upload URL dynamically (#2531)

Browse Source
This commit is contained in:
Masen Furer 2024-02-07 15:33:16 -08:00 committed by GitHub
parent eabbbea171
commit 450aa909ca
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 14 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
reflex/.templates/web/utils/state.js
View File

@ -2,7 +2,7 @@
import axios from "axios"; import axios from "axios";
import io from "socket.io-client"; import io from "socket.io-client";
import JSON5 from "json5"; import JSON5 from "json5";
import env from "env.json"; import env from "/env.json";
import Cookies from "universal-cookie"; import Cookies from "universal-cookie";
import { useEffect, useReducer, useRef, useState } from "react"; import { useEffect, useReducer, useRef, useState } from "react";
import Router, { useRouter } from "next/router"; import Router, { useRouter } from "next/router";
@ -74,18 +74,23 @@ export const getToken = () => {
}; };
/** /**
* Get the URL for the websocket connection * Get the URL for the backend server
* @returns The websocket URL object. * @param url_str The URL string to parse.
* @returns The given URL modified to point to the actual backend server.
*/ */
export const getEventURL = () => { export const getBackendURL = (url_str) => {
// Get backend URL object from the endpoint. // Get backend URL object from the endpoint.
const endpoint = new URL(EVENTURL); const endpoint = new URL(url_str);
if (SAME_DOMAIN_HOSTNAMES.includes(endpoint.hostname)) { if (SAME_DOMAIN_HOSTNAMES.includes(endpoint.hostname)) {
// Use the frontend domain to access the backend // Use the frontend domain to access the backend
const frontend_hostname = window.location.hostname; const frontend_hostname = window.location.hostname;
endpoint.hostname = frontend_hostname; endpoint.hostname = frontend_hostname;
if (window.location.protocol === "https:" && endpoint.protocol === "ws:") { if (window.location.protocol === "https:") {
endpoint.protocol = "wss:"; if (endpoint.protocol === "ws:") {
endpoint.protocol = "wss:";
} else if (endpoint.protocol === "http:") {
endpoint.protocol = "https:";
}
endpoint.port = ""; // Assume websocket is on https port via load balancer. endpoint.port = ""; // Assume websocket is on https port via load balancer.
} }
} }
@ -296,7 +301,7 @@ export const connect = async (
client_storage = {}, client_storage = {},
) => { ) => {
// Get backend URL object from the endpoint. // Get backend URL object from the endpoint.
const endpoint = getEventURL() const endpoint = getBackendURL(EVENTURL)
// Create the socket. // Create the socket.
socket.current = io(endpoint.href, { socket.current = io(endpoint.href, {
@ -397,7 +402,7 @@ export const uploadFiles = async (handler, files, upload_id, on_upload_progress,
upload_controllers[upload_id] = controller upload_controllers[upload_id] = controller
try { try {
return await axios.post(UPLOADURL, formdata, config) return await axios.post(getBackendURL(UPLOADURL), formdata, config)
} catch (error) { } catch (error) {
if (error.response) { if (error.response) {
// The request was made and the server responded with a status code // The request was made and the server responded with a status code