btwedutech/hoppscotch
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 6 Wiki Activity

feat: updated frontend docker containers to allow for runtime environment variable definitions

Browse Source
This commit is contained in:
Andrew Bastin
2023-07-14 16:43:38 +05:30
parent 6454d83486
commit 1b1a09c675
24 changed files with 466 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
packages/hoppscotch-selfhost-web/index.html
View File

@@ -1,6 +1,9 @@
<!DOCTYPE html>
<html lang="en">
<head>
<script>
globalThis.import_meta_env = JSON.parse('"import_meta_env_placeholder"')
</script>
<title>Hoppscotch • Open source API development ecosystem</title>
<meta charset="UTF-8" />
<link rel="icon" href="/favicon.ico" />

8
packages/hoppscotch-selfhost-web/meta.ts
View File

@@ -36,7 +36,7 @@ export const META_TAGS = (env: Record<string, string>): IHTMLTag[] => [
},
{
name: "image",
content: `${env.VITE_BASE_URL}/banner.png`,
content: `${env.APP_BASE_URL}/banner.png`,
},
// Open Graph tags
{
@@ -49,7 +49,7 @@ export const META_TAGS = (env: Record<string, string>): IHTMLTag[] => [
},
{
name: "og:image",
content: `${env.VITE_BASE_URL}/banner.png`,
content: `${env.APP_BASE_URL}/banner.png`,
},
// Twitter tags
{
@@ -74,7 +74,7 @@ export const META_TAGS = (env: Record<string, string>): IHTMLTag[] => [
},
{
name: "twitter:image",
content: `${env.VITE_BASE_URL}/banner.png`,
content: `${env.APP_BASE_URL}/banner.png`,
},
// Add to homescreen for Chrome on Android. Fallback for PWA (handled by nuxt)
{
@@ -84,7 +84,7 @@ export const META_TAGS = (env: Record<string, string>): IHTMLTag[] => [
// Windows phone tile icon
{
name: "msapplication-TileImage",
content: `${env.VITE_BASE_URL}/icon.png`,
content: `${env.APP_BASE_URL}/icon.png`,
},
{
name: "msapplication-TileColor",

2
packages/hoppscotch-selfhost-web/package.json
View File

@@ -29,6 +29,7 @@
"@hoppscotch/common": "workspace:^",
"@hoppscotch/data": "workspace:^",
"axios": "^1.4.0",
"@import-meta-env/unplugin": "^0.4.8",
"buffer": "^6.0.3",
"fp-ts": "^2.16.1",
"process": "^0.11.10",
@@ -74,6 +75,7 @@
"vite-plugin-windicss": "^1.9.1",
"vitest": "^0.34.2",
"vue-tsc": "^1.8.8",
"vite-plugin-fonts": "^0.6.0",
"windicss": "^3.5.6"
}
}

17
packages/hoppscotch-selfhost-web/prod_run.mjs Executable file
View File

@@ -0,0 +1,17 @@
#!/usr/local/bin/node
import { execSync } from "child_process"
import fs from "fs"
const envFileContent = Object.entries(process.env)
.filter(([env]) => env.startsWith("APP_"))
.map(
([env, val]) =>
`${env}=${val.startsWith('"') && val.endsWith('"') ? val : `"${val}"`}`
)
.join("\n")
fs.writeFileSync("build.env", envFileContent)
execSync(`npx import-meta-env -x build.env -e build.env -p "/site/**/*"`)
fs.rmSync("build.env")

18
packages/hoppscotch-selfhost-web/src/platform/auth.ts
View File

@@ -17,23 +17,21 @@ const currentUser$ = new BehaviorSubject<HoppUser | null>(null)
export const probableUser$ = new BehaviorSubject<HoppUser | null>(null)
async function logout() {
await axios.get(`${import.meta.env.VITE_BACKEND_API_URL}/auth/logout`, {
await axios.get(`${import.meta.env.APP_BACKEND_API_URL}/auth/logout`, {
withCredentials: true,
})
}
async function signInUserWithGithubFB() {
window.location.href = `${import.meta.env.VITE_BACKEND_API_URL}/auth/github`
window.location.href = `${import.meta.env.APP_BACKEND_API_URL}/auth/github`
}
async function signInUserWithGoogleFB() {
window.location.href = `${import.meta.env.VITE_BACKEND_API_URL}/auth/google`
window.location.href = `${import.meta.env.APP_BACKEND_API_URL}/auth/google`
}
async function signInUserWithMicrosoftFB() {
window.location.href = `${
import.meta.env.VITE_BACKEND_API_URL
}/auth/microsoft`
window.location.href = `${import.meta.env.APP_BACKEND_API_URL}/auth/microsoft`
}
async function getInitialUserDetails() {
@@ -53,7 +51,7 @@ async function getInitialUserDetails() {
message: string
}>
}>(
`${import.meta.env.VITE_BACKEND_GQL_URL}`,
`${import.meta.env.APP_BACKEND_GQL_URL}`,
{
query: `query Me {
me {
@@ -147,7 +145,7 @@ async function setInitialUser() {
async function refreshToken() {
const res = await axios.get(
`${import.meta.env.VITE_BACKEND_API_URL}/auth/refresh`,
`${import.meta.env.APP_BACKEND_API_URL}/auth/refresh`,
{
withCredentials: true,
}
@@ -166,7 +164,7 @@ async function refreshToken() {
async function sendMagicLink(email: string) {
const res = await axios.post(
`${import.meta.env.VITE_BACKEND_API_URL}/auth/signin`,
`${import.meta.env.APP_BACKEND_API_URL}/auth/signin`,
{
email,
},
@@ -284,7 +282,7 @@ export const def: AuthPlatformDef = {
const deviceIdentifier = getLocalConfig("deviceIdentifier")
await axios.post(
`${import.meta.env.VITE_BACKEND_API_URL}/auth/verify`,
`${import.meta.env.APP_BACKEND_API_URL}/auth/verify`,
{
token: token,
deviceIdentifier,

12
packages/hoppscotch-selfhost-web/vite.config.ts
View File

@@ -17,8 +17,9 @@ import { FileSystemIconLoader } from "unplugin-icons/loaders"
import * as path from "path"
import Unfonts from "unplugin-fonts/vite"
import legacy from "@vitejs/plugin-legacy"
import ImportMetaEnv from "@import-meta-env/unplugin"
const ENV = loadEnv("development", path.resolve(__dirname, "../../"))
const ENV = loadEnv("development", path.resolve(__dirname, "../../"), ["APP_"])
export default defineConfig({
envDir: path.resolve(__dirname, "../../"),
@@ -78,14 +79,15 @@ export default defineConfig({
routeStyle: "nuxt",
dirs: "../hoppscotch-common/src/pages",
importMode: "async",
onRoutesGenerated: (routes) =>
onRoutesGenerated(routes) {
generateSitemap({
routes,
nuxtStyle: true,
allowRobots: true,
dest: ".sitemap-gen",
hostname: ENV.VITE_BASE_URL,
}),
})
}
}),
StaticCopy({
targets: [
@@ -239,5 +241,9 @@ export default defineConfig({
modernPolyfills: ["es.string.replace-all"],
renderLegacyChunks: false,
}),
ImportMetaEnv.vite({
example: "../../.env.example",
env: "../../.env",
}),
],
})