I'm struggling for few days to find a solution. It seems that my nuxt/axios proxy configuration are not taken into account when my site is on production. Locally everything is working fine but once the site is on the server my ajax calls hit mysite.com/api/ect... instead of being proxy to mysite.com/api/v1/ect. I tried to play with axios.baseURL and various configuration but nothing seems to work.
axios: {
proxy: true,
credentials: true,
},
proxy: {
'/api/': { target: 'mysite.com/api/v1', pathRewrite: {'^/api/': ''} },
},
Maybe the issue comes from my Nginx configuration ? I use a reverse proxy to serve a nuxt app on mysite.com and a laravel api on mysite.com/api. Can this be the problem ?
# FORGE CONFIG (DO NOT REMOVE!)
include forge-conf/mysite.com/before/*;
server {
listen 443 ssl http2;
listen [::]:443 ssl http2;
server_name mysite.com;
server_tokens off;
root /home/forge/api/public;
# FORGE SSL (DO NOT REMOVE!)
ssl_certificate /etc/nginx/ssl/....
ssl_certificate_key /etc/nginx/ssl/....
ssl_protocols TLSv1.2 TLSv1.3;
ssl_ciphers .....
ssl_prefer_server_ciphers off;
ssl_dhparam /etc/nginx/dhparams.pem;
add_header X-Frame-Options "SAMEORIGIN";
add_header X-XSS-Protection "1; mode=block";
add_header X-Content-Type-Options "nosniff";
index index.html index.htm index.php;
charset utf-8;
# FORGE CONFIG (DO NOT REMOVE!)
include forge-conf/mysite.com/server/*;
location /api {
try_files $uri $uri/ /index.php?$query_string;
}
location = /favicon.ico { access_log off; log_not_found off; }
location = /robots.txt { access_log off; log_not_found off; }
access_log off;
error_log /var/log/nginx/mysite.com-error.log error;
error_page 404 /index.php;
location ~ \.php$ {
fastcgi_split_path_info ^(.+\.php)(/.+)$;
fastcgi_pass unix:/var/run/php/php7.4-fpm.sock;
fastcgi_index index.php;
include fastcgi_params;
}
location / {
proxy_pass http://127.0.0.1:3000;
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;
}
location ~ /\.(?!well-known).* {
deny all;
}
}
# FORGE CONFIG (DO NOT REMOVE!)
include forge-conf/mysite.com/after/*;
Thanks for your help and recommendation,
Don't use API_URL if you use proxy mode. Use prefix instead of.
Turn on debug for check the proxyRequest:
proxy property in nuxt.config.js:
proxy: {
// target, others options
logLevel: ‘debug’,
onProxyReq(proxyReq, req, res) {
// console.log here
}
}
Related
I have a multi-tenancy app hosted on DO. Users are able to create subdomains and also set their preferred custom domain. Need help in setting up the right Nginx config, here is the current one:
Requirements:
1- User setup for their required subdomain on app's domain (with SSL) - WORKING
2- User setup for their own custom domain - for this I have set up an A record to the server IP and below is the Nginx config - NOT WORKING
3- User custom domain is loaded with SSL - need help on how to structure this? Would an A record suffice?
#FORGE CONFIG (DO NOT REMOVE!)
include forge-conf/wiki.pk/before/*;
server {
listen 80;
listen [::]:80;
server_name .one.com "";
return 301 https://$host$request_uri;
}
server {
listen 443 ssl http2;
listen [::]:443 ssl http2;
server_name .one.com "";
#server_name ~.;
#server_name _;
#server_name ~^(?.*)$;
server_tokens off;
root /home/forge/one.com/public;
#FORGE SSL (DO NOT REMOVE!)
ssl_certificate /etc/nginx/ssl/one.com/1233982/server.crt;
ssl_certificate_key /etc/nginx/ssl/one.com/1233982/server.key;
ssl_protocols TLSv1.2 TLSv1.3;
ssl_ciphers ECDHE-ECDSA-AES128-GCM-SHA384;
ssl_prefer_server_ciphers off;
ssl_dhparam /etc/nginx/dhparams.pem;
add_header X-Frame-Options "SAMEORIGIN";
add_header X-XSS-Protection "1; mode=block";
add_header X-Content-Type-Options "nosniff";
index index.html index.htm index.php;
charset utf-8;
#FORGE CONFIG (DO NOT REMOVE!)
include forge-conf/one.com/server/*;
location / {
try_files $uri $uri/ /index.php?$query_string;
}
location = /favicon.ico { access_log off; log_not_found off; }
location = /robots.txt { access_log off; log_not_found off; }
access_log off;
error_log /var/log/nginx/one.com-error.log error;
error_page 404 /index.php;
location ~ \.php$ {
fastcgi_split_path_info ^(.+\.php)(/.+)$;
fastcgi_pass unix:/var/run/php/php8.0-fpm.sock;
fastcgi_index index.php;
include fastcgi_params;
}
location ~ /\.(?!well-known).* {
deny all;
}
}
#FORGE CONFIG (DO NOT REMOVE!)
include forge-conf/one.com/after/*;
Would appreciate all the help.
I'm trying to get my Wordpress blog hosted on blog.domain.com to work on domain.com/blog.
I have been able to do this with proxy_pass successfully but the issue is certain scripts such as the login page for admins (/wp-login.php) does not work - it gives me File not found.. I have isolated the issue to my Laravel applications FastCGI setup in my Nginx configuration. When I comment it out, my blog works but then my Laravel app is inaccessible. I've been trying different configurations but I have little knowledge with Nginx.
server {
listen 443 ssl http2;
listen [::]:443 ssl http2;
server_name mydomain.com;
server_tokens off;
root /home/appfolder/mydomain.com/public;
...
...
add_header X-Frame-Options "SAMEORIGIN";
add_header X-XSS-Protection "1; mode=block";
add_header X-Content-Type-Options "nosniff";
index index.html index.htm index.php;
charset utf-8;
# FORGE CONFIG (DO NOT REMOVE!)
include forge-conf/mydomain.com/server/*;
location / {
try_files $uri $uri/ /index.php?$query_string;
}
# WHEN I COMMENT OUT THIS BLOCK, BLOG WORKS BUT LARAVEL BREAKS
location ~ \.php$ {
fastcgi_split_path_info ^(.+\.php)(/.+)$;
fastcgi_pass unix:/var/run/php/php7.4-fpm-mydomain.sock;
fastcgi_index index.php;
include fastcgi_params;
}
location /blog {
proxy_redirect off;
proxy_set_header Host $host;
proxy_pass https://blog.mydomain.com;
}
location /blog/wp-content {
proxy_pass https://blog.mydomain.com/wp-content;
}
location /blog/wp-includes {
proxy_pass https://blog.mydomain.com/wp-includes;
}
location /blog/wp-content/uploads {
proxy_pass https://blog.mydomain.com/wp-content/uploads;
}
location /blog/wp-login.php {
proxy_pass https://blog.mydomain.com/wp-login.php;
}
location /blog/wp-admin {
proxy_pass https://blog.mydomain.com/wp-admin;
}
location /bitnami {
proxy_pass https://blog.mydomain.com/bitnami;
}
location /mod_pagespeed_beacon {
proxy_pass https://blog.mydomain.com/mod_pagespeed_beacon;
}
location = /favicon.ico { access_log off; log_not_found off; }
location = /robots.txt { access_log off; log_not_found off; }
access_log off;
error_log /var/log/nginx/mydomain.com-error.log error;
error_page 404 /index.php;
location ~ /\.(?!well-known).* {
deny all;
}
}
...
Hosted on an Ubuntu server managed by Laravel Forge. Any ideas?
Update: As per Richards answer, I have started getting it working a little bit but I need to add rules for all files which doesn't seem efficient.
I'm trying to get all .PHP files related to Wordpress (after /blog/) to be forwarded to the proxy. I have tried:
location ~ /blog/wp-admin/(\d+) {
add_header X-debug-message "$1";
proxy_pass https://blog.mydomain.com/wp-admin/$1;
}
But this doesn't seem to work.
I sorted it out by creating a regular expression to match anything after /wp-admin/ on forward it to the proxy. The configuration I use is:
location ~ (blog\/wp-admin)\/(.*)\.php$ {
proxy_pass https://blog.mydomain.com/wp-admin/$2.php?$query_string;
}
$2 is the second capture group (.*) which is appended to the proxy_pass URL and added any further arguments with ?$query_string.
I have a nuxt application SPA for the front end and a laravel API. Nuxt calls on API for request. I am trying to deploy this in one digital ocean droplet but I am having problems with it. My laravel application seems to be working but I cant get nuxt to show here is my set up
Ubuntu 20
nginx 1.18
php 7.4
laravel nginx server block
server {
listen 80;
server_name DROPLET_IP;
root /var/www/laravel-api/public;
add_header X-Frame-Options "SAMEORIGIN";
add_header X-XSS-Protection "1; mode=block";
add_header X-Content-Type-Options "nosniff";
index index.html index.htm index.php;
charset utf-8;
location / {
try_files $uri $uri/ /index.php?$query_string;
}
location = /favicon.ico { access_log off; log_not_found off; }
location = /robots.txt { access_log off; log_not_found off; }
error_page 404 /index.php;
location ~ \.php$ {
fastcgi_pass unix:/var/run/php/php7.4-fpm.sock;
fastcgi_index index.php;
fastcgi_param SCRIPT_FILENAME $realpath_root$fastcgi_script_name;
include fastcgi_params;
}
location ~ /\.(?!well-known).* {
deny all;
}
}
here is my nuxt server block:
server {
listen 3000;
server_name DROPLET_IP;
keepalive_timeout 60;
index index.html;
location / {
root /var/www/nuxt-front/dist;
}
}
both of these are in their own sites-available and symlink to sites enable.
for some reason when I access http://DROPLET_IP:3000. it just hangs.
Is there a special way I should be doing this to run as expected?
Use root
server {
listen 80;
server_name example.com;
keepalive_timeout 60;
root /var/www/nuxt-front/dist;
}
or
use proxy pass
server {
listen 80;
server_name example.com;
location / {
proxy_pass http://127.0.0.1:3000;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_cache_bypass $http_upgrade;
}
}
I'm running a static built nuxt.js app on my server. It uses the nuxt auth module for authentificating against my laravel backend which runs laravel passport.
My auth-strategy looks like this:
auth: {
strategies: {
'laravel.passport': {
url: 'https://correct_url',
//client_id: 1, //for local use
//client_secret: 'CLIENTSECRET1', //for local use
client_id: 2,
client_secret: 'CLIENTSECRET2',
userinfo_endpoint: 'https://correct_url/oauth/me'
}
}
},
In my local environment (yarn run dev) everything runs fine. After I built and deployed my nuxt-app (yarn run build) the authentification process comes to the authorisation step (where I can click "Authorize" or "cancel"). After I click "Authorize" browser redirects to my nuxt-app but requests still give me:
{"message":"Unauthenticated."}
After a few investigations the only possible cause for this could be the nginx-site which is automatically created through laravel forge. Config looks like this:
# FORGE CONFIG (DO NOT REMOVE!)
include forge-conf/correct_url/before/*;
server {
listen 443 ssl http2;
listen [::]:443 ssl http2;
server_name correct_url;
root /home/forge/correct_url/dist;
# FORGE SSL (DO NOT REMOVE!)
ssl_certificate /etc/nginx/ssl/correct_url/589448/server.crt;
ssl_certificate_key /etc/nginx/ssl/correct_url/589448/server.key;
ssl_protocols TLSv1.2;
ssl_ciphers ECDHE-RSA-AES256-GCM-SHA512:DHE-RSA-AES256-GCM-SHA512:ECDHE-RSA-AES256-GCM-SHA384:DHE-RSA-AES256-GCM-SHA384:ECDHE-RSA-AES256-SHA384;
ssl_prefer_server_ciphers on;
ssl_dhparam /etc/nginx/dhparams.pem;
add_header X-Frame-Options "SAMEORIGIN";
add_header X-XSS-Protection "1; mode=block";
add_header X-Content-Type-Options "nosniff";
index index.html index.htm index.php;
charset utf-8;
# FORGE CONFIG (DO NOT REMOVE!)
include forge-conf/correct_url/server/*;
location / {
try_files $uri $uri/ /index.html;
}
location = /favicon.ico { access_log off; log_not_found off; }
location = /robots.txt { access_log off; log_not_found off; }
access_log off;
error_log /var/log/nginx/correct_url-error.log error;
error_page 404 /index.php;
location ~ \.php$ {
fastcgi_split_path_info ^(.+\.php)(/.+)$;
fastcgi_pass unix:/var/run/php/php7.2-fpm.sock;
fastcgi_index index.php;
include fastcgi_params;
}
location ~ /\.(?!well-known).* {
deny all;
}
}
# FORGE CONFIG (DO NOT REMOVE!)
include forge-conf/correct_url/after/*;
is there something I overlooked or am I on the wrong path?
I have working Vuejs + Laravel App behing NGINX proxy. All my Laravel request are rest based and at www./app/$. It was working fine at separte ports. But when i switched to SSL. My frontend (Vuejs) still working fine but whenever I tried to send post request to backend (laravel), I receive [error] 8#8: *80 FastCGI sent in stderr: "Primary script unknown" while reading response header from upstream.
In 443 ssl block I am diverting all rest api calls to phpfpm but its not working somehow. What is recommended way of deploying these vuejs+ laravel on SSL nginx.
In the past, I've tried moving phpfpm in the ssl server block. I tried adding http on in fastcgi setting. After all changes, Following code:
Following is my Conf file.
server {
listen 81; # backend at laravel
index index.php index.html;
root /var/www/public;
access_log /var/log/nginx/access.log;
error_log /var/log/nginx/error.log;
location / {
try_files $uri /index.php?$args;
}
location ~ \.php$ {
fastcgi_split_path_info ^(.+\.php)(/.+)$;
fastcgi_pass app:9000;
fastcgi_index index.php;
include fastcgi_params;
fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
fastcgi_param PATH_INFO $fastcgi_path_info;
}
}
server {
listen 88; # frontend vuejs build app
index index.html;
server_name app.lookahead.com www.app.lookahead.com;
error_log /var/log/nginx/error.log;
access_log /var/log/nginx/access.log;
root /var/www/front;
location = /favicon.ico { access_log off; log_not_found off; }
location = /robots.txt { access_log off; log_not_found off; }
return 301 https://$host$request_uri;
}
server {
listen 443;
server_name app.lookahead.com;
ssl_certificate /etc/certs/app.lookahead.com/cert.crt;
ssl_certificate_key /etc/certs/app.lookahead.com/cert.key;
ssl on;
ssl_session_cache builtin:1000 shared:SSL:10m;
ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
ssl_ciphers HIGH:!aNULL:!eNULL:!EXPORT:!CAMELLIA:!DES:!MD5:!PSK:!RC4;
ssl_prefer_server_ciphers on;
access_log /var/log/nginx/access.log;
location / {
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_pass http://localhost:8088;
proxy_read_timeout 90;
return 301 https://www.app.lookahead.com$request_uri;
}
location ^~ /api {
root /var/www/public; #backend api at this root
try_files $uri $uri/ /api/index.php$is_args$args;
location ~* \.php(/|$) {
fastcgi_pass app:9000;
fastcgi_split_path_info ^(.+\.php)(/.*)$;
include fastcgi_params;
fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
}
}
}
##https://www.app.lookahead.com
server {
server_name www.app.lookahead.com;
listen 443;
ssl_certificate /etc/certs/app.lookahead.com/cert.crt;
ssl_certificate_key /etc/certs/app.lookahead.com/cert.key;
ssl on;
ssl_session_cache builtin:1000 shared:SSL:10m;
ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
ssl_ciphers HIGH:!aNULL:!eNULL:!EXPORT:!CAMELLIA:!DES:!MD5:!PSK:!RC4;
ssl_prefer_server_ciphers on;
root /var/www/front; #frontend static vuejs files at this root
index index.html;
error_log /var/log/nginx/error.log;
access_log /var/log/nginx/access.log;
location ^~ /api {
root /var/www/public; # backend api is at this root
try_files $uri $uri/ /api/index.php$is_args$args;
location ~* \.php(/|$) {
fastcgi_pass app:9000;
fastcgi_split_path_info ^(.+\.php)(/.*)$;
include fastcgi_params;
fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
}
}
# nginx serving frontend
location / {
try_files $uri $uri/ #rewrites;
}
location #rewrites {
rewrite ^(.+)$ /index.html last;
}
}