here is my chat application present in C:\chat1 which contains index.html and index.js files
here is the path i am setting like this in config file of NGINX.
server {
listen 80;
server_name localhost;
#charset koi8-r;
#access_log logs/host.access.log main;
location / {
root C:/chat1/;
index index.html index.htm;
}
i changed forward slashes and backword slashes and changed to other application stil it is not loading instead it is show as welcome page as below
Welcome to nginx!
If you see this page, the nginx web server is successfully installed and working. Further configuration is required.
For online documentation and support please refer to nginx.org.
Commercial support is available at nginx.com.
Thank you for using nginx.
can anyone please help me on this issue.. Thanks in advance.
You issue is that you are loading the default nginx config also. In case of multiple server blocks, the one that came first answers the request. In your case it is default nginx config block which is answer. So simple fix you can try is add default_server.
server {
listen 80 default_server;
server_name localhost;
#charset koi8-r;
#access_log logs/host.access.log main;
location / {
root C:/chat1/;
index index.html index.htm;
}
If that doesn't help then you need delete the config of default server. You can see what config your nginx is actually loading by running nginx -T
Related
I'm working on a node js app and I have some images which I want to show on the frontend but after publishing the app on the digital-ocean server images are not showing up
Below is how the image directory structured
|__ static
|__ assets
|__ favicon
|__ images
Index.js
app.use(express.static(__dirname + '/static'));
HTML files (Using EJS)
<img src="/assets/images/banner.png">
Images are working fine on localhost but not on the server. Can't figure out the reason for this, Any leads would be great.
Update:
I checked for folder permission and it seems fine.
Found a work around but not sure about the reason for this issue, I removed the parent directory assets and moved the child directory directly under static and after this it worked perfectly fine.
Any explanation on this issue might help to understand.
Have you checked the folder permission ? That might be blocking you from publicly accessing files within the folder. You want to have 755 permission.
I had this issue, and it was because I had a nginx configuration causing issues. When I looked in the server logs, I saw the server trying to serve files located /usr/share/nginx/html/ instead of where they were actually located. After I deleted it, the issue went away.
File: static.conf
location ~* \.(?:jpg|jpeg|gif|png|ico)$ {
expires 7d;
access_log off;
add_header Cache-Control "public";
}
I am using Django Compressor on nginx & uwsgi
I have each docker container for nginx & uwsgi
I copied static folder to nginx:/static and others to uwsgi:/myapp/ in advance.
However compress.js made the compress file dynamically and set under uwsgi:myapp/static/CACHE of uwsgi container.
<script src="/static/CACHE/js/output.b6723c2174c0.js">
So consequently 404 not found for this file, because this request is redirect to nginx:/static not uwsgi:/myapp/static
How anyone solves this problem?
my nginx setting is below
server {
listen 8000;
server_name 127.0.0.1;
charset utf-8;
location /static {
alias /static;
}
location / {
auth_basic "Restricted";
auth_basic_user_file /etc/nginx/.htpasswd;
proxy_pass http://uwsgi:8001/;
include /etc/nginx/uwsgi_params;
}
}
It's about troubleshooting. There can be different issues.
Similar reported here django-compressor and nginx: 404 with compressed files
Having same issue I found that in settings.py the COMPRESS_ROOT was defined to the path which is not specified in the Nginx configuration.
Removing COMPRESS_ROOT fixed it. Refer to: Django Compressor Quickstart
Deploy React js(build directory) static files in Nginx server.
Using kubernetes, i am running the nginx server to serve the React js "build" directory for static files. I could access the simple index.html in the browser. But not the index.html with react js code. The root directory has the index.html file, static directory and other files in it. Directory structure is copied to this path.
nginx.conf is like below
events {
worker_connections 1024;
}
http {
server {
listen 80;
root /usr/share/nginx/html;
#index index.html;
location / {
index index.html;
try_files $uri $uri/index.html /index.html;
}
location /static/ {
autoindex on;
root /usr/share/nginx/html/static/;
}
}
}
In the browser, index.html is not loaded, but in source (right-click in the browser > select source), the index.html code is available. formatted index.html file copied from source in the browser is at this path. I am predicting that javascript(css,js) code is not executed or having issues loading in the browser. Otherwise, there is a problem with the nginx configuration to load the javascript files.
how to properly configure nginx to deploy Reactjs build directory files?
try_files does not tell nginx to serve the static file. Reaching the closing brace in the absence of any other operation causes it to serve the static file. try_files tests for the existence of the file in the local file system and may rewrite the URL.
You have syntax errors in your file i.a white spaces.
Remember to create service for nginx - type LoadBalancer and refer to it in deployment configuration file. You have to add your server if there are several servers that match the IP address and port of the request.
Here is example how you should execute this process. Make sure you followed every step from tutorial: nginx-configuration - there is example of exercise on PHP application but there are the same steps to reproduce with ReactJS app.
Your conf file should looks like this:
events {
worker_connections 1024;
}
http {
server {
listen 80;
root /usr/share/nginx/html;
index index.html index.htm;
server_name your_server_name_or_IP
location / {
try_files $uri $uri/index.html /index.html;
}
location /static/ {
autoindex on;
root /usr/share/nginx/html/static/;
}
}
}
The below code that works for me.
server {
listen 80;
root /usr/share/nginx/html;
index index.html index.htm;
server_name xyz.application.com;
server_name localhost;
location / {
ssi on;
set $inc $request_uri;
if (!-f $request_filename) {
rewrite ^ /index.html last;
}
index index.html;
try_files $uri $uri/index.html /index.html =404;
}
Setting the rewrite redirects to index.html page. I am not sure about the impact of ssi, set $inc $request_uri in the code.
I was wondering how I could get NGINX to look for files that are essentially out of the root value. This is how my nginx.conf looks like within server
server {
listen 80;
server_name localhost;
root /home/parallels/Downloads/nginx/rickshaw/examples;
location /all {
alias /home/parallels/Downloads/nginx/rickshaw/examples
try_files $uri $uri/ /sample.html /sample.htm;
}
#error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
}
I have a HTML file in rickshaw/examples that is calling on a javascript file that is located in /home/parallels/Downloads/nginx/rickshaw/javascript/charts.js by going like src="../javascript/charts.js. I tried using alias but that didn't really help. Any idea on how I could change the configuration file so that it can pick up on a file in a different relative directory. I know I could just copy the file into the root path but I want to find out how I can configure NGINX so that it looks for relative paths.
Thank you, and let me know if you need any further information!
try adding a static path
location /javascript/ {
alias /home/parallels/Downloads/nginx/rickshaw/javascript/;
autoindex off;
}
and access it src="/javascript/charts.js"
I have create a simple Nginx config file to server an Angular like so:
server {
listen 80;
listen [::]:80;
root /path/to/apps/myapp/current/dist;
access_log /path/to/apps/myapp/current/log/nginx.access.log;
error_log /path/to/apps/myapp/current/log/nginx.error.log info;
index index.html;
location ^~ /assets/ {
gzip_static on;
expires max;
add_header Cache-Control public;
}
location / {
try_files $uri $uri/ =404;
}
}
And all works fine as expected. because I'm using Angular UI Router, I'd like to forward all pages to index.html so Angular will take over (so a request to example.com/users/new will be redirect by Nginx to index.html, for Angular UI to handle it) for pages reloads, links, etc.
How can I achieve this?
I've playing around with options like:
server {
#implemented by default, change if you need different ip or port
#listen *:80 | *:8000;
server_name test.com;
return 301 $scheme://www.test.com$request_uri;
}
As specified in this answer. But I couldn't anything similar to work based on all requests.
Suggestions will be much appreciated.
You've nearly got it. try_files is the correct one to use, as Richard shows, you just needed to add your index.html in the list. However, there is no need to remove the =404 from the end, in fact, its better not to.
location / {
try_files $uri $uri/ /index.html =404;
}
Once the above change is implemented, reload the config with sudo nginx -s reload
$uri will try the request as a file, if this fails, it moves to the
next one.
$uri/ will try the request as a folder /index.html will
then be tried, which sends all requests to your index.html where your
angular app will be able to route things (also make sure you use
html5mode to avoid the use of # in the url.
=404 will be your final fallback, basically saying: I've tried this as a file, folder, and via index.html. If index.html fails/does not
exist for whatever reason, we will serve a 404 error.
Why =404?
If all goes well, the last one is never used, and routing will just try file, folder, angular app. And that would be it. But I see it as good practice to have the =404 on the end to cover all bases.
Important note about index.html catchall
Regardless of whether or not you use the =404 in try_files, by directing everything to index.html, you basically lose the ability to serve 404 errors from your webserver, unless index.html does not exist (which is where =404 comes in). This means that you will need to handle 'Not Found' urls and missing pages within Angular JS, and you need to be ok with the fact that the error page you use will return a HTTP 200 response, rather than 404. (This is because the moment you direct to the index.html, you've served a page to the user, thus 200).
For added reassurance on the above, google try_files angular js and you will find most examples incorporate =404.
References:
http://nginx.org/en/docs/beginners_guide.html#control
http://ajbogh.blogspot.ca/2015/05/setting-up-angularjs-html5-mode-in.html (just one example)
You need to add the router to the end of your try_files directive, like this:
location / {
try_files $uri $uri/ /index.html;
}
See this document for more.
location / {
try_files $uri$args $uri$args/ index.html;
}
This worked for me