SocketIO 400 Bad Request Error - javascript

I'm pretty new to web-dev and have currently been struggling with a bug for multiple days that I honestly have no clue how to resolve/have no idea what could be causing it. At this point I've exhausted what I think could be causing the problem, so any insights would be greatly appreciated!
I am running an Apache webserver through the Flask Python framework. My client-side JS (app2.js) is as follows:
// set up basic variables for app
var socket;
$(document).ready(function() {
socket = io.connect('https://' + document.domain + ':' + location.port+'/main');
console.log(document.domain);
console.log("Document ready");
socket.on('disconnect', function() {
console.log("disconnecting...");
});
console.log("Simple logging");
});
Further I have reduced my .html page that loads the above script to the following:
<!DOCTYPE html>
<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
<script type="text/javascript" src="//code.jquery.com/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/socket.io/1.3.6/socket.io.min.js"></script>
<script src="{{ url_for('static', filename='scripts/app2.js') }}"></script>
</html>
When I load my page, I will see the following printed in the Chrome console:
Document ready
Simple logging
GET https://DOMAIN/socket.io/?EIO=3&transport=polling&t=1465632212131-2&sid=d4082f4636fd4d04a5dcc4b660ee5b2a 400 (BAD REQUEST)
disconnecting...
POST https://DOMAIN/socket.io/?EIO=3&transport=polling&t=1465632212141-3&sid=d4082f4636fd4d04a5dcc4b660ee5b2a 400 (BAD REQUEST)
I have no clue what the source of these malformed GET/POST requests are, but as a consequence of them, my page becomes non-functional. If I refresh the page, I sometimes won't get these errors. Other times, I refresh the page and still get the same error logs and then if I stay on the page long enough, I get more GET/POST errors of the same flavor and a "disconnecting" message sprinkled in.
It's the lack of reproducibility that is throwing me off, and I'm not sure what else to consider/how to go about fixing this. I've tried to reduce the client-side .html/.js files to the bare minimum to see what could be wrong and for some reason the code is still failing. I would be happy to provide any additional information that would help pinpoint what is going on.
Thanks!

Related

Failed to load resource: the server responded with a status of 404 ()

I have written a small code using index.html and three .js files. It was working fine if i run it through my local. As soon as i uploaded it to github and hosted my webpage and opened it the above error is coming. i am attaching the url of my github page : https://sravya160597.github.io/courseracss/mod4_solution/index.html
please help me if anyone has a solution for this.
Taking a look at the page source, and comparing to your github repository, it appears that the problem is case sensitivity in github pages (whereas your localhost must be case-insensitive). Both your SpeakHello.js and SpeakGoodBye.js should start with a lowercase, as follows:
<head>
...
<script src="js/speakHello.js"></script>
<script src="js/speakGoodBye.js"></script>
<script src="js/script.js"></script>
</head>

<script> only loads half the time -- "Loading failed for the <script> with source", and only works when Firefox sends a range in the request

First off, apologies as I'm not experienced with StackOverflow. I also am clueless as to what the problem is.
I'm running a Flask server, and all other scripts have worked fine up to this point. However, when I attempt to load pdf.js in the same way, it only loads some of the time. Other times, it give this error in the Firefox console:
Loading failed for the <script> with source
However, I noticed that when it does work, it always sends a Range in the header.
I've tried loading it from another source, which worked fine. I've tried several different type in the <script> tag, from text/javascript to application/javascript to just blank. I've also tried changing how it's loaded in the JINJA2 template.
<script type="text/javascript" src="/static/pdfjs-dist/build/pdf.js">
</script>
Any ideas on what this is? Thank you!
EDIT:
Working Network Tab
Working Request
Non-Working Request
Non-Working Network Tab

noscript tag - php tracker does not work

I searched but I could not find anything that suits my problem.
I have a JS wich gather some information and then sends it to a php file. Now I try calling the php file directly if the visitor has JS disabled.
This is in between < body> and < /body>.
<script type="text/javascript">
var id = 4;
</script>
<script type="text/javascript" src="http://www.example.org/tracking.js"></script>
<noscript><img src="http://www.example.org/tracking.php?id=4&nojs=true" ></noscript>
I turn of my JS in my browser, visit the site and I see a call to tracking.php
But... during the day, my 80 visitor have not even once called tracking.php.
I have looked at my apache access log and the only one accessing tracking.php is me :(
Do you guys have any suggestions or examples on why my visitors, who have JS disabled, does not communicate with the noscript file? Is there something wrong with the code?
Thanks in advance!

Why does this JQuery.get example from w3schools not work for me?

This is going to be downright obvious to someone else, but for the life of me, I cannot figure it out.
I've copied the HTML from http://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_ajax_get
I changed one line slightly so that .get url points to the full w3schools.com url (this works just fine on their example page). This is the code:
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
$.get("http://www.w3schools.com/jquery/demo_test.asp",function(data,status){
alert("Data: " + data + "\nStatus: " + status);
});
});
});
</script>
</head>
<body>
<button>Send an HTTP GET request to a page and get the result back</button>
</body>
</html>
This code works just fine for me on the w3schools website, but when I paste it into a new file called "hi.html" on my home computer and open it up in Chrome and Firefox, it fails.
I'm copying and pasting this html directly, why does this fail?
Your web browser prevents the Ajax request from executing because of the same-origin policy (https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy). Basically, when you run the script on localhost:80, you can only make Ajax requests to pages on localhost:80. W3Schools is on a different host.
The same-origin policy exists for security reasons. For example, suppose you are logged into Facebook. If the same-origin policy didn't exist, a programmer could make a malicious website that makes an Ajax request for Facebook.com and it would return with your login cookies. It could then send your login cookie to the malicious programmer. The malicious programmer could then take your login cookies and impersonate you on Facebook.

jQuery: Can't run $.get (http get) on Chrome

I want to use JavaScript to make a simple http get.
I used jQuery to perform my request. My code runs on IE8.0 but not in Chrome (ver 6.0).
My page has the following code: (to simplify, i made a simple request to a html page, but my needs is other)
<!DOCTYPE html PUBLIC "-//IETF//DTD HTML 2.0//EN">
<html>
<script type"text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<SCRIPT TYPE="text/javascript" >
function sendGet(){
$.get(
"http://www.google.pt",
function(data) {
alert('page content: ' + data);
});
}
</SCRIPT>
<head>
<title> Http Get Demonstration </title>
</head>
<body>
<p/>
<input type="button" value="Http Get" onclick="sendGet();" />
</body>
</html>
As i said, when i load this page on IE and press the button, i get the alert with the html code. But in Chrome the alert appears with empty text (null?). In Chrome Console from "Developer tools" i get the message: "XMLHttpRequest cannot load http://www.google.pt/. Origin null is not allowed by Access-Control-Allow-Origin."
Anyone can explain me what's the meaning of this message? And what i should change to my page run in Chrome?
Thanks
Due to same origin policy you cannot send AJAX requests to different domains than the one hosting your page. So unless your page is hosted on http://google.pt you cannot send an AJAX request to this domain. One possible workaround is to setup a server side script on your domain which will act as bridge between google.pt and the client or use JSONP if the distant domain supports it.
Although i can't remember if i changed any IE option, the Darin Dimitrov seems explain my problem.
I found some tricks can be used (beyond the Dimitrov answer):
use a PHP script:
http://jquery-howto.blogspot.com/2009/04/cross-domain-ajax-querying-with-jquery.html
configure IE by editing regedit (not recomended):
http://msdn.microsoft.com/en-us/library/dd565656(VS.85).aspx
(I belive there's some other way to disable cross domain protection without editing regedit. But i couldn't find it)
Are you opening the html file directly from a file (e.g. does the address bar say file://usr/path/to/the/file)?
We've found chrome won't let you 'ajax' in files from other domains when running under file://. However, in Safari it works fine.
Best solution for us is to use something like MAMP to run a local Apache server.

Categories