How to host multiple ghost blogs on one server - sqlite

I have a droplet with two domains.
Each domain has a subdomain, I am trying to setup two ghost instances on each sub domain but it is giving me a really hard time.
I have a Centos server with a LEMP stack installed.
Ghost is running on the first subdomain fine, but the second one I can see the styling of the homepage/front-end, but when I visit /ghost or /admin I get an nginx 404 error not found.

Without your Nginx config file it's difficult to answer, but i will still try, you need to configure nginx to listen for those subdomains, if you have done that successfuly, you also need to configure ghost blog config.js on each blog to have different urls and port and database.
server {
listen 80;
server_name blog1.example.com;
location / {
proxy_pass http://127.0.0.1:2368/;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header Host $http_host;
}
}
server {
listen 80;
server_name blog2.example.com;
location / {
proxy_pass http://127.0.0.1:2369/;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header Host $http_host;
}
}
blog1.example.com config.js
production: {
url: 'http://blog1.example.com',
mail: {},
database: {
client: 'sqlite3',
connection: {
filename: path.join(__dirname, '/content/data/ghost1.db')
},
debug: false
},
server: {
host: '127.0.0.1',
port: '2368'
}
}
blog2.example.com config.js
production: {
url: 'http://blog2.example.com',
mail: {},
database: {
client: 'sqlite3',
connection: {
filename: path.join(__dirname, '/content/data/ghost2.db')
},
debug: false
},
server: {
host: '127.0.0.1',
port: '2369'
}
}

Related

Strapi admin API on subfolder hitting 404 on JS files behind nginx reverse proxy

I'm trying to setup Strapi on my DO droplet.
I have a UI for my web app running on a subdomain (from here onwards: https://blah.mywebsite.com) - it's running a Next.js instance - but I believe that is irrelevant.
I also have Strapi running on a separate node process (via PM2) both the Next.js and Strapi node instances are done via pm2 using the following ecosystem.config.js file:
module.exports = {
apps: [
{
name: "webapp",
cwd: "/root/webapp",
script: "npm",
args: "start",
env: { NODE_ENV: "production" },
},
{
name: "strapi",
cwd: "/root/webappstrapi",
script: "yarn",
args: "start",
env: {
NODE_ENV: "production",
APP_KEYS: "STRINGGOESHERE,STRINGGOESHERE",
ADMIN_JWT_SECRET: "STRINGGOESHERE",
JWT_SECRET: "STRINGGOESHERE",
API_TOKEN_SALT: "STRINGGGOESHERE",
DATABASE_NAME: "DBNAMEHERE",
DATABASE_PASSWORD: "PASSWORDHERE"
},
},
],
};
From what I can see there isn't an issue with either node process and both are running just fine.
I then follow the tutorial here ("Subfolder unified"): https://docs.strapi.io/developer-docs/latest/setup-deployment-guides/deployment/optional-software/nginx-proxy.html#nginx-virtual-host
My Strapi config/server.js file looks like this:
module.exports = ({ env }) => ({
host: env("HOST", "0.0.0.0"),
port: env.int("PORT", 1337),
url: "https://blah.mywebsite.com/strapi",
app: {
keys: env.array("APP_KEYS"),
},
});
I have ran yarn build and run the build files via the aforementioned pm2 config above.
To setup the following URL structure:
https://blah.mywebsite.com/strapi/admin
https://blah.mywebsite.com/strapi/api
My Nginx config for the subdomain looks like this (following the strapi docs):
server {
listen 443 ssl http2;
listen [::]:443 ssl http2;
server_name blah.mywebsite.com;
root /var/www/blah.mywebsite.com/public;
# SSL
ssl_certificate /etc/letsencrypt/live/blah.mywebsite.com/fullchain.pem;
ssl_certificate_key /etc/letsencrypt/live/blah.mywebsite.com/privkey.pem;
ssl_trusted_certificate /etc/letsencrypt/live/blah.mywebsite.com/chain.pem;
# security
include nginxconfig.io/security.conf;
location / {
proxy_pass http://127.0.0.1:3000; # next.js
include nginxconfig.io/proxy.conf;
}
location /strapi/ {
rewrite ^/strapi/?(.*)$ /$1 break;
proxy_pass http://127.0.0.1:1337;
proxy_set_header X-Forwarded-Host $host;
proxy_set_header X-Forwarded-Server $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_set_header Host $http_host;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "Upgrade";
proxy_pass_request_headers on;
}
# additional config
include nginxconfig.io/general.conf;
}
# subdomains redirect
server {
listen 443 ssl http2;
listen [::]:443 ssl http2;
server_name *.blah.mywebsite.com;
# SSL
ssl_certificate /etc/letsencrypt/live/blah.mywebsite.com/fullchain.pem;
ssl_certificate_key /etc/letsencrypt/live/blah.mywebsite.com/privkey.pem;
ssl_trusted_certificate /etc/letsencrypt/live/blah.mywebsite.com/chain.pem;
return 301 https://blah.mywebsite.com$request_uri;
}
# HTTP redirect
server {
listen 80;
listen [::]:80;
server_name .blah.mywebsite.com;
include nginxconfig.io/letsencrypt.conf;
location / {
return 301 https://blah.mywebsite.com$request_uri;
}
}
Now when I navigate to https://blah.mywebsite.com/strapi/admin - the HTML resolves - but I get a blank page - looking at the browser console I get:
GET blah.mywebsite.com/strapi/admin/runtime~main.67ca8ce7.js net::ERR_ABORTED 404
GET blah.mywebsite.com/strapi/admin/main.57d09928.js net::ERR_ABORTED 404
So it looks like the build JS bundle files aren't being served by my server.
Looking at the pm2 logs for my strapi node instance I only see:
[2022-09-11 18:45:03.145] http: GET /admin/ (3 ms) 200
So it looks like the requests for the JS files aren't hitting the Strapi node process - which leads me to believe Nginx isn't passing on the GET requests for the JS files...
How do I solve this?
I mentioned it in https://stackoverflow.com/a/75129704/4300071 a while ago.
You must add slash to at the end of url in url in the config/server.js
module.exports = ({ env }) => ({
host: env("HOST", "0.0.0.0"),
port: env.int("PORT", 1337),
url: "https://blah.mywebsite.com/strapi/",
app: {
keys: env.array("APP_KEYS"),
},
});
after that npm run build and now it should be work.

Deploy Nuxt SSR to subdirectory on domain using pm2 and nginx

I have a domain that serves more than one application with different programming languanges.
So when we access the application through the browser, the URL should be:
mydomain.org/app-name
I need help on how to deploy my NUXT SSR app on subdirectory.
This is my nginx configuration:
map $sent_http_content_type $expires {
"text/html" epoch;
"text/html; charset=utf-8" epoch;
default off;
}
server {
#listen 80;
listen 443 ssl http2;
listen [::]:443 ssl http2;
server_name mydomain.org;
if ($scheme = "http") {
return 301 mydomain.org$request_uri;
}
# note that these lines are originally from the "location /" block
root /usr/share/nginx/html;
index index.php index.html index.htm main.js server.js;
charset utf-8;
location /app-one/ {
try_files $uri $uri/ /app-one/index.php?$args;
}
location /app-two/ {
try_files $uri $uri/ /app-two/index.php?$args;
}
#here is my nuxt app
location /nuxt-app/ {
expires $expires;
proxy_redirect off;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_read_timeout 1m;
proxy_connect_timeout 1m;
proxy_pass http://publicIPAddress:3015/;
}
Below is my nuxt.config.js:
const pkg = require("./package");
const VuetifyLoaderPlugin = require("vuetify-loader/lib/plugin");
import axios from "axios";
module.exports = {
server: {
port: 3015
},
router: {
base: "/payroll-staging/",
// prefetchLinks: true
},
/*
** Build configuration
*/
build: {
transpile: ["vuetify/lib"],
plugins: [new VuetifyLoaderPlugin()],
loaders: {
stylus: {
import: ["~assets/style/variables.styl"]
}
},
extractCSS: true,
optimization: {
splitChunks: {
cacheGroups: {
styles: {
name: 'styles',
test: /\.(css|vue)$/,
chunks: 'all',
enforce: true
}
}
}
},
/*
** You can extend webpack config here
*/
extend(config, ctx) {}
}
};
I also set this code inside package.json file:
"config": {
"nuxt": {
"host": "0.0.0.0",
"port": "3015"
}
}
I already tried using ecosystem.config.js file:
module.exports = {
apps: [
{
name: 'app-name',
exec_mode: 'cluster',
instances: 'max', // Or a number of instances
script: './node_modules/nuxt/bin/nuxt.js',
args: 'start'
}
]
}
After that I run:
% npm run build
% pm2 start
But the result when I tried to access the app URL, it always returns:
Cannot GET /
failed load
Can someone help me to fix this?
Maybe there is another step that I missed?

How to use my.nuxt.dev instead of my.nuxt.dev:3001 without changing the port?

In my DNS, I have the an URL my.nuxt.dev redirecting to 192.168.1.2 where my Nuxt instance is installed. In nuxt.config.js, I have configured:
server: {
port: 3001,
host: 'my.nuxt.dev'
},
Now, when I want to access the Nuxt website, I have to open my.nuxt.dev:3001. What should I change in my configuration to just use my.nuxt.dev (without using another port) ?
===
I tried to fix it with Nginx proxy:
/etc/nginx/sites-enabled/my-nuxt.conf
server {
listen 80;
server_name my.nuxt.dev;
location / {
proxy_set_header X-Forwarded-For $remote_addr;
proxy_set_header Host $http_host;
proxy_pass "http://127.0.0.1:3001";
}
}
But I get an error message in my browser:
502 Bad Gateway
nginx/1.18.0 (Ubuntu)
Maybe because I also have another Nginx server block (virtual host) on the same port (?):
/etc/nginx/sites-enabled/my-laravel.conf
server {
listen 80;
server_name my.laravel.dev;
...
}
I finally fixed it by replacing 127.0.0.1 by my.nuxt.dev at proxy_pass line.

Adding two separate Webpack dev server apps into subfolders using Docker and NGINX

I have app1 and app2, both running with webpack-dev-server on separate ports. The client wants the apps under the same domain in different subfolders.
domain.com/app/app1
domain.com/app/app2
I set up a docker-compose.yml file:
version: '3'
services:
proxy:
image: nginx:alpine
ports:
- '80:80'
volumes:
- './nginx.conf:/etc/nginx/conf.d/nginx.conf:ro'
Here's the nginx.conf file
upstream app1 {
server host.docker.internal:5000;
}
upstream app2 {
server host.docker.internal:5001;
}
server {
listen 80;
server_name myapp;
proxy_http_version 1.1;
proxy_redirect off;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "Upgrade";
proxy_set_header Host localhost;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Host $server_name;
location /app/app1 {
proxy_pass http://app1;
}
location /app/app2 {
proxy_pass http://app2;
}
}
I tried different webpack settings, but nothing seems to work. Here's the webpack.config.js for app1:
output: {
filename: 'main.js',
},
devServer: {
historyApiFallback: true,
host: '0.0.0.0',
port: 5000,
},
When I visit http://myapp/app/app1, the index.html loads fine, but I get a 404 on the main.js script. The file is accessible at http://myapp/app/app1/main.js, but inside index.html, the script points to main.js, instead of app/app1/main.js.
<script type="text/javascript" src="main.js"></script></body>
I tried changing output.publicPath in webpack, but then the script is no longer available. Is there a way to change the path inside the script tag without messing everything else up? Or how would I go about making this work when the app is running inside a subfolder?
Found the solution, no thanks to the webpack docs. historyApiFallback.index needs to point to the same location as publicPath. Also, for hot reload to work and avoid console errors, you'll need to add disableHostCheck: true. Here's my final webpack config for one of the apps:
output: {
filename: 'main.js',
publicPath: '/app/app1',
},
devServer: {
disableHostCheck: true,
historyApiFallback: {
index: '/app/app1',
},
port: 5000,
publicPath: '/app/app1',
},

Browser-Sync Proxy Middleware

I have a question regarding proxy middleware
I initialize Browser-Sync like this :
gulp.task('browser-sync', function() {
files = [
'**/*.php'
];
browserSync.init(files,{
open:false,
port: 3000,
ui: {
port: 3000 + 1
},
proxy: {
baseDir: "./",
target : "http://example.com",
}
});
});
And I use nginx to proxy to http://127.0.0.1:3000
server {
listen EXTERNAL_IP:80;
server_name development.example.com;
location / {
proxy_pass http://127.0.0.1:3000;
}
}
However browser-sync calls 127.0.0.1:3000 instead of http://development.example.com
How can I tell browser-sync that it should call http://development.example.com ?
Thanks!
server {
listen EXTERNAL_IP:80;
server_name development.example.com;
location / {
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_pass http://127.0.0.1:3000;
}
}
It was actually a nginx thing :)

Resources