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.
Related
This is a PERN app. I don't remember ever getting this error and I haven't found any records when doing a Google search.
I don't see anything wrong in the index.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<meta
name="description"
content="Web site created using create-react-app"
/>
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
<!--
manifest.json provides metadata used when your web app is installed on a
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
-->
<!-- <link rel="manifest" href="%PUBLIC_URL%/manifest.json" /> -->
<!--
Notice the use of %PUBLIC_URL% in the tags above.
It will be replaced with the URL of the `public` folder during the build.
Only files inside the `public` folder can be referenced from the HTML.
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
<title>React App</title>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
<!--
This HTML file is a template.
If you open it directly in the browser, you will see an empty page.
You can add webfonts, meta tags, or analytics to this file.
The build step will place the bundled scripts into the <body> tag.
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
</body>
</html>
Any idea where it comes from? I get it as soon as I start the app.
I'm just a beginner but it happens when you are passing the wrong URL to the fetch function, suppose that your db.json file is running on port 8000 and you are passing port 3000, that's why.
useFetch("http://localhost:3000/blogs/" + id);
Instead, try this, it might helps. :)
useFetch("http://localhost:8000/blogs/" + id);
Hope it helps.
So I had this same error when I installed npm gh-pages. My solution was to delete the Homepage link in package.json and it worked.
I had the same problem .
If you are using node server, install this npm install body-parser
and add these lines in your server-side code
const bodyParser = require("body-parser"); router.use(bodyParser.json());
I'm new at this, but I found if I added a proxy to my package.json (client side, not server side) it worked! It looks like this in package.json (placed above my dependencies): "proxy": "http://localhost:3001", . I believe it's because the client side can't read it, and the proxy tells it to pass it to the server side which can read it.
I got the same error while deploying the React app on Vercel. Turns out, I forgot to add environment variables to the project settings on Vercel.
Check if you are calling your api prefixing the protocol, like this 'https://apiurl...', not like this 'api.something'
Faced the same issue and it was my json path was incorrect. Initially it was fetch('./movies.json') which was incorrect path.
Fix it and now working fine:
useEffect(() => {
fetch('../movies.json')
.then(res => res.json())
.then(data => setMovies(data.posts))
}, [])
I was trying to fetch data from the backend into my react application, with out mentioning the proper path of the url in the loader function of the react-router library, hence this issue occured and once I defined the correct path, it worked just fine.
const response = await fetch("http://localhost:8080/events");
I forgot to mention "events" in the url.
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>
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>
I am taking baby steps into the MEAN stack but can't figure out step 1, how to run my app. What do I use for a development web server and how do I start it in my directory?
If I just launch index.html as a file it will not work.
Here is my code
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="utf-8">
<title>My Site</title>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.3/angular.min.js"> </script>
<link rel="stylesheet" href="style.css">
<script>
document.write('<base href="' + document.location + '" />');
</script>
<script src="app.js"></script>
<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/3.2.1/css/bootstrap-combined.min.css"
rel="stylesheet">
</head>
<body ng-app="myApp" ng-controller="MainCtrl">
<a class="btn" ng-click="visible = true">Show the Form</a>
<div ng-show="visible">I used to be hidden!</div>
</body>
</html>
app.js
var app = angular.module( 'myApp', [] );
app.controller( 'MainCtrl', function( $scope ) {
$scope.visible = false;
});
If you simply want to explore AngularJS functionality(or any other front end library for that matter), you don't need a Node.js app.
Assuming you already have npm installed just follow these simple steps:
npm install http-server -g
go from your console to the folder containing your html files
enter http-server -c-1 -p 9000
That would start a simple web server on port 9000 with no caching on your specified directory.
Then simply go to http://0.0.0.0:9000/your_page.html from a browser and voila.
If you want to explore more options on http-server
This code can run without a http server, just in the browser. Note that you are using a really outdated version of Angular (1.0.3), they just released version 1.3.0.
If you want to run your stuff on a local development server, you could use something like yeoman, which generates the app boilerplate for you and comes with a local node server and a build job (check for example https://github.com/yeoman/generator-webapp or https://github.com/yeoman/generator-gulp-webapp)
If you just want a super easy hhtp server and have python installed you can also use python -m SimpleHTTPServer to start up an http server in the current folder.
Here is your code in plunker and it works: http://plnkr.co/edit/j2SqmrP1yWqR68Gm3UCn?p=preview
As you are using the MEAN stack, you should probably check node.js to implement your web server. Check http://www.nodebeginner.org/, it should allow you to code a very simple one.
Posting here as requested original post can be found here
Hello, I would like to build ember.js using Ubuntu 13.
I have cloned the official Github project, cd into the project and as described in the readme file I did:
bundle install
rake dist
no error is shown on screen and as a result I get a directory shown in the image
I would like to use ember and ember-data, so I include
ember.js
ember-data-deps.js
files in my test project.
The problem is that I am getting a TypeError: App.Router is undefined
I am using this at my client.js file to init ember
this.App = Ember.Application.create();
App.Router.map(function() {
this.route('contributors');
this.route('contributor', {path: '/contributors/:contributor_id'});
});
Am I doing something wrong in the build process?
Should I include some other js files in my project?
Thank you in advanced.
The TypeError: App.Router is undefined error is because ember.js is not loaded correctly or in the correct order.
To get ember-data (that is separate from ember.js) you have to clone this repo (https://github.com/emberjs/data) and follow the build instructions in the readme file, it's straight forward, and once you have the dist directory from the ember-data build process get the file ember-data.js development version or ember-data.min.js for production (well, production... ember-data is still considered unstable for production environments).
here is a simple ember project setup using ember-data:
index.html
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>ember app</title>
</head>
<body>
<script type="text/x-handlebars">
hello world!
</script>
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script type="text/javascript" src="http://builds.emberjs.com.s3.amazonaws.com/handlebars-1.0.0-rc.3.js"></script>
<script type="text/javascript" src="http://builds.emberjs.com.s3.amazonaws.com/ember-latest.js"></script>
<script type="text/javascript" src="http://builds.emberjs.com.s3.amazonaws.com/ember-data-latest.js"></script>
<script type="text/javascript" src="app.js"></script>
</body>
</html>
app.js
var App = Ember.Application.create({
ready: function () {
console.log("app started...");
}
});
hope it helps