feat(webapp): allow running the webapp without the stack - #1234
Open
acoseac wants to merge 1 commit into
Open
Conversation
The webapp calls the API at a relative URL, so `npm run dev` on its own had nowhere to send `/api` and vite's SPA fallback answered those calls with index.html. Several views additionally read VITE_APP_* variables that only the Docker build sets, and threw at runtime without them. Point the dev server's `/api` at a real API, defaulting to the public one so that the webapp can be worked on without desec-stack, overridable with DESEC_API_ORIGIN. Supply matching defaults for the VITE_APP_* variables in .env.development, which vite reads in development mode only, leaving the production build unchanged. Also fix the webapp directory in the top-level README, which said `cd webapp/` rather than `cd www/webapp/`. Closes desec-io#397
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Closes #397
#397 asks for README instructions to start the webapp in dev mode without the docker stack, against a sandbox or production API. That turned out not to be documentable as-is, because it does not currently work:
baseURL: '/api/v1/'), sonpm run devhas nowhere to send/api. Vite's SPA fallback answers those calls withindex.html—GET http://localhost:8080/api/v1/returns200and a page of HTML, so every API call fails on parsing rather than visibly.VITE_APP_*variables that onlywww/Dockerfilesets, and call.split(' ')on them. Without the stack they are undefined, and e.g./custom-setup/{domain}throwsTypeError: Cannot read properties of undefined (reading 'split')on load.So this makes it work and then documents it.
Dev server proxy
/apiis forwarded to a real API,https://desec.ioby default, so the webapp can be worked on with nothing else running.DESEC_API_ORIGINpoints it elsewhere:Certificate verification is skipped for an explicitly given origin, since a local stack usually serves a self-signed certificate — without that, proxying to one fails with
Error: self-signed certificate. The default public API is always verified.Environment defaults
.env.developmentsupplies the fiveVITE_APP_*variables with values matching the public service. Vite reads.env.developmentin development mode only, so the production build is untouched: I verified the exact env value appears in what the dev server serves and does not appear anywhere innpm run buildoutput.There's a judgement call here I'm happy to revisit — this commits a working default rather than shipping a
.env.development.exampleto copy. It seemed closer to what the issue asks for (npm run devjust works), but if you'd rather not have tracked defaults, say the word.Also
The top-level README told contributors to
cd webapp/; the directory iswww/webapp/. That step has been broken as written.On the sandbox question
@andreasnuesslein asked in the issue whether a sandbox API existed to point at, and the answer at the time was "not yet". I could not find one referenced anywhere in the repo or docs, so this documents the production API, with an explicit warning that accounts and domains created there are real and that it rate-limits. Happy to switch the default if a sandbox exists now.
Verification
npm run dev,GET /api/v1/through the dev server returns the real API root, byte-identical to queryinghttps://desec.io/api/v1/directlyDESEC_API_ORIGINoverride checked against a stand-in HTTPS server with a self-signed certificate, before and after thesecurehandling/custom-setup/example.comloads with no uncaught errors, checked with a listener installed at document start; the same page onmainthrows thesplitTypeErrornpm test(4 passed) andnpm run buildboth fine