How to change host for vue-cli hot reload endpoint (sockjs)? - nginx

What do I have:
vue-cli app running in virtual machine (vue --version 3.7.0)
Laravel Homestead v8.3.2
Vagrant 2.2.4
VirtualBox
Nginx
vue.config.js:
module.exports = {
devServer: {
host: 'myvueapp.local',
https: true
}
}
Nginx config:
server {
listen 80;
listen 443 ssl http2;
server_name .myvueapp.local;
root "/home/path/to/myvueapp.local/public";
index index.html index.htm;
charset utf-8;
location / {
try_files $uri $uri/ /index.html =404;
proxy_pass https://myvueapp.local:8080;
}
sendfile off;
}
npm run serve output:
Local: https://myvueapp.local:8080/
Network: https://myvueapp.local:8080/
What do I do:
I run npm run serve in my VM. I can access Vue app from my host machine by myvueapp.local in browser.
What's my problem:
Hot reload does not work. sockjs connection is calling not myvueapp.local but myvueapp.local:8080. So, I'm getting
https://myvueapp.local:8080/sockjs-node/info?t=
net::ERR_CONNECTION_REFUSED

You need a public property on your devServer, like this
Then, hot reloading will work in fallback (http polling) mode, but to properly get websockets working, you need to handle upgrade requests in your proxy server. Here is a script that solves the problem for express. You will need to port this to nginx. It's just the last part concerning upgrade requests that you're missing.

Related

How do I configure nginx correctly to work with my Sinatra app running on thin?

I have a Sinatra app (app.rb) that resides within within /var/www/example. My setup is nginx, thin, and sinatra.
I have both nginx and thin up and running but when I navigate to my site, I get a 404 from nginx. I assume that the server block config is wrong. I've tried pointing root to /var/www/example/ instead of public but that makes no difference. I don't think the request makes it as far as the sinatra app.
What am I doing wrong?
Server block:
server {
listen 80;
listen [::]:80;
root /var/www/example/public;
index index.html index.htm index.nginx-debian.html;
server_name example.com www.example.com;
location / {
try_files $uri $uri/ =404;
}
}
config.ru within /var/www/example directory:
require File.expand_path('../app.rb', __FILE__)
run Sinatra::Application
config.yml within /var/www/example directory:
---
environment: production
chdir: /var/www/example
address: 127.0.0.1
user: root
group: root
port: 4567
pid: /var/www/example/pids/thin.pid
rackup: /var/www/example/config.ru
log: /var/www/example/logs/thin.log
max_conns: 1024
timeout: 30
max_persistent_conns: 512
daemonize: true
You have to tell nginx to proxy requests to your Sinatra application. The minimum required to accomplish that is to specify a proxy_pass directive in the location block like this:
location / {
proxy_pass http://localhost:4567;
}
The Nginx Reverse Proxy docs have more information on other proxy settings you might want to include.

NGINX This site can’t be reached

I have a front-end react app, that runs at localhost:3000. And a back-end that runs at localhost:9900.
I can access my back-end with a postman's(or curl) localhost:80/api request.
But I can't access either the site or the server via the web address: my-1stconnection.lan.test.
What's the problem?
NGINX config:
server {
listen 80;
listen [::]:80;
server_name my-1stconnection.lan.test;
location / {
proxy_pass http://localhost:3000/;
}
location /api {
proxy_pass http://localhost:9900/;
}
}
I forgot one important thing in order to activate the local server:
127.0.0.1 my-1stconnection.lan.test into /etc/hosts
After this fix, everything started working.

Access swagger-ui docker instance from nginx sub-location

I'm having trouble getting the Docker container to serve the static assets for swagger-ui behind my nginx proxy. My nginx config is:
server {
server_name api.example.com;
listen 443 ssl http2;
listen [::]:443 ssl http2;
location ^~ /docs {
proxy_pass http://127.0.0.1:9505/;
}
location / { proxy_pass http://127.0.0.1:9005; }
}
Where our main API responds at the root location, and proxies to the swagger docker container if /docs is specified in the url, launched via:
docker run -d -p 9505:8080 --name swagger -e API_URL=https://api.example.com/swagger.json swaggerapi/swagger-ui
I get the swagger-ui index.html contents when hitting https://api.example.com/docs but all the static assets 404 because they are trying to call https://api.example.com/swagger-ui.css, for example.
I'd prefer not to put a try_files in my root location block because then I end up with a lot of extra processing forcing all normal API requests though the swagger proxy first before erroring and going into the proper API proxy.
Is there some easy config change I'm missing about getting swagger to run at a sub-location like this?

How to rewrite URL to match a server using nginx?

I'm new to nginx. I have two projects, and the one is django web app which is running localhost 8000, and another is tornado which used to provide api service and running localhost 8888.
How do I config the nginx that redirects all the url requests(from 80 port) to localhost:8000 but /api requests to localhost:8888(tornado app)?
Edit your nginx config file. Add a server block and use proxy_pass in location blocks to proxy (redirect) the request.
server {
listen 80;
location / {
proxy_pass http://127.0.0.1:8000;
}
location /api {
proxy_pass http://127.0.0.1:8888;
}
}
Save it, and reload nginx.
nginx -s reload
https://gist.github.com/soheilhy/8b94347ff8336d971ad0

Nginx configuration not updating for browser

I am trying to serve a website with nginx. I have noticed that when I make changes to my /etc/nginx/sites-available/game, run sudo service nginx restart, it is not reflected when I try to pull it up in the browser.
The browser just hangs and waits for a response and then timesout.
However, it works perfectly fine if I try to do a curl request to my site on the command line. I get the normal nginx html basic file. Why is that? Here. (and yes, I have made a soft link from sites-enabled/game to sites-available/game)
server {
listen 80 default_server;
listen [::]:80 default_server ipv6only=on;
root /usr/share/nginx/html;
index index.html index.htm;
server_name my.site.uw.edu;
location / {
try_files $uri $uri/ =404;
}
}
Also, I am using Ubuntu 14.04. I don't think this version of Linux uses SELinux, but could this be some sort of security configuration related deal? I have had trouble in the past with SELinux when deploying on CentOS machines.
You can disable adding or modifying of “Expires” and “Cache-Control” response header using expires param:
expires off;
nginx docs

Resources