I started a node.js http-server - "https://www.npmjs.com/package/http-server"
If i type a non existed file in the directory, than I get the browser msg:
This localhost page can’t be found
No webpage was found for the web address: http://localhost:8080/foo
Search Google for localhost 8080 foo
HTTP ERROR 404
My question:
Can I customise this error msg somehow?
Create 404.html file in your public directory and put content you want to be shown to that file
Example
Command line
# http-server ./public/
Content of ./public/404.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>404</title>
</head>
<body>
<p>My custom 404 message</p>
</body>
</html>
Related
I have an application on ExtJs 7.0.0-CE, it works well locally at webpack-dev-server running with npm run dev, but when I build as production and copy it to IIS doesn't.
I'm building using npm:
npm run build
The result at output is:
What I had observed is that the URL I'm calling is "http://myserver/indicators", but the Ext tries to load using only the base URL "http://myserver/".
The browser console show :
GET http://192.168.10.211/main.js?da2a6a29bf9e7731b19e net::ERR_ABORTED 404 (Not Found)
I think the get should include the virtual path, like:
GET http://192.168.10.211/indicators/main.js?da2a6a29bf9e7731b19e
And the main.js doesn't even exists at the output folder of build
Below I put some config files that may be relevant.
app.json
package.json
Application.js
App.js:
Ext.application({ extend: 'paineis.Application', name: 'paineis'});
The problem was what I suspected, the base url without the virtual path.
The solution was to remove the tag <base href="/"> from Index.html at the root folder of the application before build the application.
From:
<!DOCTYPE HTML>
<html manifest="">
<head><base href="/">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
.
.
.
To:
<!DOCTYPE HTML>
<html manifest="">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
.
.
.
With it removed, worked just fine and all files were found and application worked just fine!
I downloaded the latest copy of MathJax through Git, installed it somewhere, and wrote the following document:
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title>Notes - Wenke's Patterns in Prehistory</title>
<script id="MathJax-script" async src="../../../../MathJax/e5/tex-chtml.js">
</script>
</head>
<body>
$ e^i $
</body>
</html>
When I try to run it in a browser the console prints the message Loading failed for the <script> with source “file:///home/username/underconstruction/MathJax/e5/tex-chtml.js”..
I believe the README.md file that comes with the download indicated that tex-chtml.js was supposed to be the file to link in the HTML document. I've seen elsewhere reference to a MathJax.js file but that was not included in my download.
You specify the location ("../..") of the file "tex-chtml.js" relative to the location of the HTML-page containing $e^i$. The file is likely not there as the warning message indicates. If you specify a path relative to the current HTML-page be also sure that the relative path is the same on your localhost and on the server.
A simple method for using MathJax is given on https://www.mathjax.org.
You do not need to download MathJax from anywhere. Just include the following lines in your HTML-file:
<head>
<script>
MathJax = {tex: {inlineMath: [['$', '$'], ['\\(', '\\)']]}};
</script>
<script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script>
<script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax#3/es5/tex-mml-chtml.js"></script>
</head>
Server for PixiJS not working, "localhost sent an invalid response" error when connecting for client side
When I try connecting to the server (http://127.0.0.1:8080) through my chrome browser, I get a page which has this written on it:
"This page isn’t working
localhost sent an invalid response.
ERR_INVALID_REDIRECT"
And it also downloads a file called "download" with it. I have no idea as to why this happens. This "download" file is almost the exact same as the code in my index.html file. The code is the following:
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Testing pixi.JS</title>
<!-- The <script> tag's src should be relative to your root directory where your webserver is running -->
<script src="pixi/pixi.min.js"></script>
</head>
<body>
<script type="text/javascript">
let type = "WebGL";
if(!PIXI.utils.isWebGLSupported()){
type = "canvas";
}
</script>
</body>
</html>
<!-- MY INDEX.HTML CODE -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Testing pixi.JS</title>
<!-- The <script> tag's src should be relative to your root directory where your webserver is running -->
<script src="./pixi.min.js"></script>
</head>
<body>
<h1>Hello there!</h1>
<script type="text/javascript">
let type = "WebGL";
if(!PIXI.utils.isWebGLSupported()){
type = "canvas";
}
</script>
</body>
</html>
CODE TYPED INTO CMD AFTER MOVING TO SAME FOLDER AS INDEX.HTML:
npm install http-server -g
http-server
I expected the page to load but it doesn't. I have no idea as to what to do.
If you navigate to the full path it seems to work: http://127.0.0.1:8080/index.html It seems to be some http-server bug.
There are many other local web servers. I suggest browsersync:
npm install -g browser-sync
browser-sync start --server --index index.html
There is a bug, it seems only affect to Windows. You should install a lower version of http-server, 0.9.0 works.
Run the following command
npm install -g http-server#0.9.0
for more info click here.
I tried to connect to a netgear D700 using opera and edge but got the same response. Eventually I used the old 32bit internet explorer and got into the router. Once the firmware was updated I was able to use opera to get into the router.
Up to this point in my studies, I have been able to serve files to my dynamic web pages using Node.js and Express as follows.
app.use(express.static('./public'));
and then linking to files in the public folder.
The Wavesurfer.js documentation stated that a file has to be loaded from a url
Load an audio file from a URL:
wavesurfer.load('example/media/demo.wav');
I'm not to sure I understand what this mean. or how to link a file to wavesurfer.js using node.js
Edit:
I found this from the link Cross origin requests are only supported for HTTP.” error when loading a local file
Node.js
Alternatively, if you demand a more responsive setup and already use nodejs...
Install http-server by typing npm install -g http-server
Change into your working directory, where your some.html lives
Start your http server by issuing http-server -c-1
This spins up a Node.js httpd which serves the files in your directory as static files accessible from http://localhost:8080
Can't I achieve the same using express?
My code:
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<div id="waveform"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/wavesurfer.js/1.2.3/wavesurfer.min.js"></script>
<script>
var wavesurfer = WaveSurfer.create({
container: '#waveform',
waveColor: 'violet',
progressColor: 'purple'
});
wavesurfer.load('/public/recordings/o.mp3');
</script>
</body>
</html>
The errors I'm getting:
The AudioContext was not allowed to start. It must be resumed (or
created) after a user gesture on the page.
Access to XMLHttpRequest at 'file:///C:/public/recordings/o.mp3' from
origin 'null' has been blocked by CORS policy: Cross origin requests
are only supported for protocol schemes: http, data, chrome,
chrome-extension, https.
Ok so I think your problem is because you open the .html page in your browser locally (as a file://). Instead, try to load it from your Express server, something like http://localhost:port/some file.html
I've been trying to use express-ejs-layouts module.
My when I try second route, browser finds my JS and CSS resource file under my second EJS files -that was written by me into second route function.
What should I do?
My Layout appears properly with my first route process like the following.
my first route;
app.get('/', function(req, res) {
res.render('home/index');
});
my layout.ejs file;
<!DOCTYPE html>
<html lang="tr">
<head>
<link rel="stylesheet" href="bootstrap/css/bootstrap.css">
<link rel="stylesheet" href="css/styles.css">
</head>
<body>
<% include navbar %>
<%- body %>
<script src="js/jquery.js"></script>
<script src="bootstrap/js/bootstrap.js"></script>
</body>
</html>
So far everything is good. My resource files (css and js) linked and I can see my home/index.ejs properly. And then I try my second route like the following;
my second route;
app.get('/user/:id', function(req, res) {
res.render('user/index');
});
My browser console gives the below errors;
Failed to load resource: the server responded with a status of 404
(Not Found) http://localhost:1337/user/bootstrap/css/bootstrap.css
Failed to load resource: the server responded with a status of 404
(Not Found) http://localhost:1337/user/css/styles.css
Failed to load resource: the server responded with a status of 404
(Not Found) http://localhost:1337/user/js/jquery.js
Failed to load resource: the server responded with a status of 404
(Not Found) http://localhost:1337/user/bootstrap/js/bootstrap.js
Express needs a 'public' named folder to check resources. So I've put my resources files into a ".../public/" folder, rewrote src link and I got succeed.
I've defined a new static path;
app.use(express.static(__dirname + '/public'));
An then I changed my new layout.ejs file like the below;
<!DOCTYPE html>
<html lang="tr">
<head>
<link rel="stylesheet" href="/css/bootstrap.css">
<link rel="stylesheet" href="/css/styles.css">
</head>
<body>
<% include navbar %>
<%- body %>
<script src="/js/jquery.js"></script>
<script src="/js/bootstrap.js"></script>
</body>
</html>