I have developed a sveltekit app. During a development phase, I use a Vote configuration to proxy my api to a backend on same domain but different port. It works perfectly but when I compile for deployment the proxy stopped working. I saw that vite provides proxy only during development. How can I have a proxy also in production? Do I need an express project to host my compiled sveltekit app and proxy routes to the backend?
Ok I think I got it.
As mentioned in the official sveltekit node adapter
https://github.com/sveltejs/kit/tree/master/packages/adapter-node
I need to create a custom server for example using expressjs. From there using the http proxy I'm able to forward all the routes /api to the backend on port 3001
import { handler } from './build/handler.js';
import express from 'express';
import proxy from 'express-http-proxy';
const app = express();
const port = 3000;
const backend = 3001;
app.use('/api', proxy(`http://localhost:${backend}`));
app.use(handler);
app.listen(port, () => {
console.log(`Wine Diagnostic Frontend listening on port ${port}`);
console.log(`Reverse proxy forwarding to port ${backend}`);
});
As the guide says, the important thing to do after the sveltekit project is compiled, is to use the handler.js and not app.js in order to use a custom server.
Related
I currently have two docker containers:
- Frontend, which is ran with the flag -p 80:3000 to map my react app to my domain to serve the content
- Backend, which is ran with the flag -p 3001:3001 to map my backend(nodejs/express) to port 3001, where i will access the API routes
When my backend container is running, I can, for example, run curl localhost:3001/example and it will GET the api response back.
My problem is that I have just set up CloudFlare for my domain, so I now have HTTPS enabled, which Express does not support right out of the box (I also tried createServer with https, it didn't work). After doing some research, I discovered that I should be making a reverse proxy with nginx to have those HTTPS requests work with my HTTP server. Is this possible? Currently my backend won't work on my deployed website when I access the HTTPS routes and try to call to it. How do I go about setting up the reverse proxy to allow the HTTPS requests to go into HTTP ? Should I be somehow getting SSL certificate information and putting it somewhere as well? I've been trying to look up tutorials online, but none seem to address something like this from what I could find. Additionally, I found someone on SO that was having a similar problem, but it was never solved. here
For reference, here's a snippet of my backend if that's useful:
const express = require("express");
const webserver = express();
const cors = require("cors");
const mysql = require("mysql");
//connection pool creation
..
webserver.use(cors());
webserver.use(express.json());
// api routes
..
webserver.listen(PORT, () => {
console.log(`[Express] Server running on ${PORT}`);
});
I have a node express app with middleware that's intercepting all calls before it serves static content:
app.use((req, res, next) => {
console.log(`Request: ${req.url}`)
next()
})
app.use('/', express.static('public'))
The public directory serves up a static website.
I get the initial document request logged when loading the site for the first time, but when I click a link on the site the static HTML content IS loaded, BUT
the chrome dev tools don't show any network request
the express middleware doesn't log any request
I'm trying to debug this middleware (there's additional logic to add), but Chrome isn't even making the request to the localhost express server and seemingly just loads the content direct from disk.
How can I get Chrome to send all localhost requests to the express server?
There is a UI5 sample app:
https://github.com/SAP/openui5-sample-app
and it can be easily hosted with:
UI5 serve -o index.html
or with npm run serve-dist after building
But, how do i host it with express?
Strictly speaking, you ARE using an express app, when using the UI5 server via the command UI5 serve -o index.html. This code initializes the express app.
If you want to do it by your own, you can use the following code in an app.js file and start it via node app.js:
'use strict';
const express = require('express');
const app = express();
app.use(express.static('webapp'));
app.listen(8080, () => {*
console.log(`App listening at http://localhost:8080`)
})
This app basically does nothing else than serving files from the webapp folder. One disadvantage over using the UI5 Server is that you need to provide the resources in some way. You can reference the ui5 resources from a Content Delivery Network if you change the bootstrap script in you index.html file as show here:
<script id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/1.84.0/resources/sap-ui-core.js"
data-sap-ui-libs="sap.m"
...
This would serve the example app from your self-coded UI5 app.
I am working to build a web application that can direct various domain names to template sites in hapi / node. Any suggestions on how I might best set this up would be appreciated. What I've tried is below:
Server 1 has a web application with template websites at /site1, /site2 etc.
Server 2 is a proxy server to direct domains to their proper place. I attempted to use node-http-proxy (https://github.com/nodejitsu/node-http-proxy#setup-a-basic-stand-alone-proxy-server) but it does not support proxying to a specific path, only a url.
//does not work
{
"domain1.com": "http://www.server1.com/site1,
"domain2.com": "http://www.server1.com/site1,
"domain3.com": "http://www.server1.com/site2
}
var server = http.createServer(function(req, res) {
proxy.web(req, res, { target: endpoints[req.headers.host] });
});
I've got a NodeJS + Angular + MySQL webapp. Is there a way I could use KeystoneJS for blog only?
I am currently serving some pages as static Express pages, and some as an Angular App with UI Router's HTML5 mode enabled.
// Serves static pages generated by Express
app.use('/staticPage', staticPage);
app.use('/anotherStaticPage', anotherStaticPage);
// Serves Angular App
app.all('/*', function(req, res, next) {
res.sendFile(__dirname + '/ui/index.html');
});
/*
Need a way to also serve a blog powered by KeystonJS
It should be accessed at /blog/:postTitle
*/
If possible, I prefer to keep my existing set-up and simply add Keystone on top of it.
There are two ways you can do so.
(1) install keystone, and inside keystones index router, add your two static routers and one app router too.
(2) Add keystone to existing Express App.
However irrespective of keystoneJS. you have to remove generic handler for angularApp.
app.all('/app/*', function(req, res, next) {...});
Or else new blog related router has to be added above Angular, as you are doing so far.