vercel

env fix vercel Vercel Fix Vercel Fix Vercel Fix Vercel Fix vercel fix vercel fix vercel config vercel vercel vercel vercel vercel vercel vercel vercel vercel vercel Vercel
Zaki-1052 · Apr 1, 2024 · 5bb59c3 · 5bb59c3
1 parent ab077b2
commit 5bb59c3
Show file tree

Hide file tree

Showing 4 changed files with 68 additions and 11 deletions.
diff --git a/README.md b/README.md
@@ -49,6 +49,7 @@ Welcome to my **Chat-Bot Portal**, a full-featured *Node.js*-based web applicati
   - **Retrieval Augmented Generation** of *uploaded files*.
 - New **Google Gemini** & **Mistral** Models...Ultra *Coming Soon*!
 - **Keyboard Shortcuts** to control various *ChatGPT-like functions*.
+- **Editable Custom Instructions** via a *frontend UI*.
 - **Model Selector** of various *OpenAI APIs*. Includes:
   - **GPT-4**: Default – Snapshot of the *Most Intelligent* Version
   - **GPT-4-Vision**: Able to View & Analyze *Images*
@@ -63,7 +64,7 @@ Welcome to my **Chat-Bot Portal**, a full-featured *Node.js*-based web applicati
   - **Gemini-Vision**: Multi-Modal Model – One-Time Use
   - **Gemini-1.5-Pro**: Early Access Model – *1 Million Tokens*!
   - **Gemini-Ultra**: Currently *Unreleased* – Largest Model
-  - **Claude Opus-Instant**: Six New *Anthropic* High *Performance* Models
+  - **Claude Opus-Instant**: *Six* New *Anthropic* High *Performance* Models
     - *Claude-Opus* is said to perform *better than GPT-4* at some tasks!
   - **Mistral**: *Tiny-Medium*
     - **Five** *New* **Mistral AI** Models
@@ -72,6 +73,9 @@ Welcome to my **Chat-Bot Portal**, a full-featured *Node.js*-based web applicati
 
 ## Examples
 
+<details>
+<summary>Images/Demos</summary>
+
 ### Latest [**Demo**](https://youtu.be/MvuxNr60u0M) Video
 
 Fully showcases all installation, features, and model utilization.
@@ -104,6 +108,8 @@ https://github.com/Zaki-1052/GPTPortal/assets/134018102/de7cb401-54f3-4cdd-a041-
 
 ![Base Interface](public/uploads/interface.jpeg)
 
+</details>
+
 ## Structure
 
 - **portal.html**: The main HTML file for user interaction. It includes the chat interface layout, a message input area, an image upload and export button for history, voice chat functionality, a model selector, and it links to the `script.js` file.
@@ -130,6 +136,12 @@ https://github.com/Zaki-1052/GPTPortal/assets/134018102/de7cb401-54f3-4cdd-a041-
 
 ## Installation
 
+### Vercel Deployment
+
+[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?template=[YOUR_GITHUB_REPOSITORY_URL]&env=OPENAI_API_KEY,USER_USERNAME,USER_PASSWORD,GOOGLE_API_KEY,MISTRAL_API_KEY,CLAUDE_API_KEY)
+
+### Manual Build
+
 1. **Clone the Repository**:
    - Use *Git* to clone the repository to your local machine:
 

diff --git a/public/script.js b/public/script.js
@@ -3,14 +3,16 @@
 // configures host and port 
 
 /// Initialize a variable to hold the base URL
-let baseURL = 'http://localhost:3000'; // default value
+let baseURL = window.location.origin;
 
 // Function to fetch configuration from the server
 async function fetchConfig() {
   try {
     const response = await fetch('/config');
     const config = await response.json();
-    baseURL = `http://${config.host}:${config.port}`;
+    if (config.host && config.port) {
+      baseURL = `http://${config.host}:${config.port}`;
+    }
     console.log(`Base URL set to: ${baseURL}`);
   } catch (error) {
     console.error("Error fetching configuration:", error);

diff --git a/server.js b/server.js
@@ -1292,21 +1292,40 @@ app.post('/update-instructions', (req, res) => {
 // Set trust proxy to ensure the server can be accessed via any host
 app.set('trust proxy', true);
 
+app.get('*', (req, res) => {
+  res.redirect('/public/portal.html');
+});
+
 app.get('/portal', (req, res) => {
   res.sendFile('portal.html', { root: 'public' });
 });
 
 // Expose a configuration endpoint for the client
 app.get('/config', (req, res) => {
-  res.json({
-    host: process.env.HOST_CLIENT || 'localhost',
-    port: process.env.PORT_CLIENT || 3000
-  });
+  // Check if running on Vercel
+  const isVercelEnvironment = process.env.VERCEL === '1' || process.env.NODE_ENV === 'production';
+
+  // If it's Vercel, we don't need to specify host and port
+  if (isVercelEnvironment) {
+    res.json({
+      // We could omit host and port entirely or set them to null/undefined
+      host: undefined,
+      port: undefined
+    });
+  } else {
+    // For non-Vercel environments, return the necessary configuration
+    res.json({
+      host: process.env.HOST_CLIENT || 'localhost',
+      port: process.env.PORT_CLIENT || 3000
+    });
+  }
 });
 
-const PORT_SERVER = process.env.PORT_SERVER || 3000;
-const HOST_SERVER = process.env.HOST_SERVER || '0.0.0.0';
 
-const server = app.listen(PORT_SERVER, HOST_SERVER, () => {
-  console.log(`Server running at http://${HOST_SERVER}:${PORT_SERVER}`);
+const isVercelEnvironment = process.env.VERCEL === '1' || process.env.NODE_ENV === 'production';
+const PORT = isVercelEnvironment ? process.env.PORT : process.env.PORT_SERVER || 3000;
+const HOST = isVercelEnvironment ? '0.0.0.0' : process.env.HOST_SERVER || 'localhost';
+
+const server = app.listen(PORT, HOST, () => {
+  console.log(`Server running at http://${HOST}:${PORT}`);
 });
diff --git a/vercel.json b/vercel.json
@@ -0,0 +1,24 @@
+{
+  "routes": [
+    {
+      "src": "/",
+      "dest": "/server.js"
+    },
+    {
+      "src": "/(.*)",
+      "dest": "/public/portal.html"
+    }
+  ],
+  "env": {
+    "OPENAI_API_KEY": "",
+      "USER_USERNAME": "",
+      "USER_PASSWORD": "",
+      "GOOGLE_API_KEY": "",
+      "MISTRAL_API_KEY": "",
+      "CLAUDE_API_KEY": ""
+  },
+  "build": {
+    "env": {
+    }
+  }
+}