I'm writing a multiroom chat server to learn nodejs.
The code is here: https://github.com/DanielHeath/furious-earth-2/tree/backbone
And the app is live here: http://furious-earth.herokuapp.com/
The issue is that when running in development mode, the page refreshes whenever you log in to a room.
What I've found so far:
This doesn't happen in production
Anything you write to the console is lost when the page reloads
The chrome debugger crashes the tab if you use it with socket.io code
The firefox debugger doesn't stop the page from reloading
The url is getting a '?' parameter appended
I can't figure out what is causing it - or even how to approach debugging it.
Any thoughts?
One thing to look for: event handlers on your page(s) bound to <a> elements or to things that cause form submission (<button> tags with type "submit", or "submit" <input> elements, and other things like that). If those don't properly prevent the default action of "click" events, then the browser will end up reloading the page(s).
Related
I am really a fresh guy for asp.net. I am using Visual Studio 2012.
I'm creating a login page, were there are two buttons Login and Exit.
When i click the Exit button then application have to be close and also stop the debugging.
My try: referred
I know there are other solutions on the given link for this problem but i prefer the following approach.
protected void Page_Load(object sender, EventArgs e)
{
ClientScript.RegisterOnSubmitStatement(typeof(Page), "closePage", "window.onunload = CloseWindow();");
}
and written the following javascript function within the Login.aspx.
<script language="javascript" type="text/javascript">
function CloseWindow() {
window.close();
}
</script>
Note: The above script works fine if i click on exit button but application also get close when i click Login button and also debugging is not getting stop.
Your page is doing exactly what you asked it to do.
In your Page_Load, you called:
ClientScript.RegisterOnSubmitStatement()
That method causes every form submission to execute the script you provided; that means all of your buttons will run your CloseWindow procedure when they are clicked.
If you only want one of your buttons to close the window, then you should only attach the CloseWindow method to one of them. The answer you selected from the linked question only works because there's only one button on the form. I'd recommend you go with one of the other answers, e.g. using:
OnClientClick="javascript:window.close();"
as an attribute on your Exit button.
Handle the two buttons separately. Do whatever you want with the login button to submit the page and handle the postback but don't tie any events to the CloseWindow() function. Then, simply create and handle the Exit button like:
<input type="button" onclick="CloseWindow();" value="Exit"/>
The easy answer for your note is to use Internet Explorer as the default launch browser in the debug toolbar.
Unlike a winforms application, an ASP.Net application is stateless. The code that runs in the browser is not dependent on the same resources as the code that is running in the Visual Studio debugger. The only connection between them are the requests that the browser makes to the server (VS 2012 debugger either treats itself as a server or uses IISExpress) and the responses that the server sends back as part of those requests.
In most cases, this means that, when you close the browser, the server keeps on going, waiting for more requests. Internet Explorer works a little differently than the other browsers with Visual Studio. When the IE instance that Visual Studio launches gets closed, the debugger process also closes.
If you really are just starting out the ASP.Net, you should try the ASP.Net MVC framework. It has a cleaner separation between server and client side code, which may help you avoid some of these types of issues.
Due to a PC crash, my project has lost some unsaved code and I am running to different errors. One of them being that on clicking on any anchor tag on the page, I can see the function for ng-click is called but also at the end page navigates to server-base path. I have no clue what causes this navigation and I am trying to find out. How can I debug to find out what is causing this page unload/ navigation? Is there any defined rule for angular that makes it go to default path if something goes wrong?
On the debug console, I can see the following highlighted network request made about which I have no clue
What does 'Other' as the request source mean? The GetSourceList calls specifies that angularjs called it, but what about the requests tagged as others?
I am developing a Chrome App with webviews. Pages intended for the webviews may also run in a regular browser. If inside a webview, pages send messages to the main App, but apparently they need to get a message from the App first, in order to know where to send their messages.
No problem - the main App sends a message as soon as it sees a 'loadstop' event which tells the pages where to send messages to. If a page is not in a webview then it never gets the message.
The problem is, I need to know when a page should stop waiting for the message and assume it is NOT in a webview.
When does 'loadstop' occur, relative to events in the page such as jQuery's .ready or .load? Is there a way to trap or trigger an event guaranteed to occur after 'loadstop' MIGHT be seen in the main App and a message sent and received by the webview's JavaScript.
When does 'loadstop' occur, relative to events in the page such as jQuery's .ready or .load?
According to the documentation for the loadstop event:
Fired when all frame-level loads in a guest page (including all its subframes) have completed. This includes navigation within the current document as well as subframe document-level loads, but does not include asynchronous resource loads.
This would suggest it's more akin to jQuery's .ready(), which executes after the DOM tree is loaded, but before waiting for asset (.css, .js) downloads.
Keep an eye on that documentation page; it's already much improved since two weeks ago.
Is there a way to trap or trigger an event guaranteed to occur after 'loadstop' MIGHT be seen in the main App and a message sent and received by the webview's JavaScript?
Your manifest.json declares your my-app-main.js background script (and your webview permission) which launches your my-webview-wrapper.html which includes your <webview> tag and also inlines some javascript (or sources a my-webview-wrapper.js file) that assigns event listeners to your webview via an onload function as such:
onload = function() {
webview = document.getElementById("the-id-attribute-of-my-webview");
webview.addEventListener("<EVENT>", function() {
// the cool stuff you want to do
}
}
<EVENT> can be any of the webview DOM events listed in the documentation I linked (including loadstop). Your main app shouldn't really care that any of this is happening. (It's async! It's javascript! It's magic!)
If you're still confused, just poke around Google's webview sample on GitHub.
Just spent about 5 hours sorting out this issue, so I thought sharing how I overcame it would be helpful to someone and save them some time (it seems to be a pretty recent fix - 9 hours ago at the time of posting this question - which I found here).
I am using jQuery version 1.10.1.
Overview
I am building a Facebook tab application. It is a competition entry form where the visitor will enter some information and upload a photo that they took on a recent holiday. I have the form working in all browsers before being embedded into Facebook.
The form is submitted using $.post(). The PHP script that jQuery points to in this process is on the same domain as the form itself.
Before you can submit the form, you must upload a file. The file upload process is built like so:
There is a <div> which acts as a button. Within this div, there is an <input type="file" /> field with its opacity set to 0.
When the invisible file input is clicked, the user selects a file.
When the file is selected, a .change() event is triggered and the <div> will display the text 'Click again to upload'. I did this rather than having the file upload immediately because during my research, I learned that Internet Explorer doesn't like you submitting a form within a .change() handler attached to a file input.
When you click the div again, the form is submitted via .submit(). The form targets a hidden iframe. The file beings uploading, and on completion the iframe triggers a .load() event.
The handler for the load event uses .contents().find("div").html() to get some stringified JSON that I have sent back in the PHP script that manages the file upload. The JSON contains the status of the file upload, and the URL to the processed image if it was successful.
Problem
The application works fine in all browsers except for Internet Explorer when it is embedded into Facebook. Internet Explorer gave the following in the console:
SCRIPT5: Access is denied.
SCRIPT5009: '$' is undefined.
I've researched the second error first and came across all the stuff that I expected to come across and already checked, such as:
The path to the script is wrong.
There may be a htaccess file blocking access to the file.
The script hasn't loaded correctly, clear cache etc and try again.
The possibility that I was trying to use a script that required jQuery before it was loaded.
I have double checked all of these and confirmed they are not the case.
I then moved onto the 'Access is denied' error and all the material I am coming across points to an issue regarding cross-domain requests using AJAX. There are also some articles that mention file uploading specifically, but nothing that was 100% relevant to me in this case.
Question
Why am I getting these errors in Internet Explorer when I try to use jQuery in an page that is embedded into Facebook? I got them even when I removed every other script on the page (except for jQuery), so I assume it is triggered by the presence of the hidden iframe that I have on the page to deal with image uploads.
First, I removed every other script on the page, at which point I only received the following error (obviously because I wasn't trying to make use of $ anymore):
SCRIPT5: Access is denied.
After trying about a dozen things (and combinations of those) that I found around the internet, I decided to use the non-minified version of jQuery so that I could more accurately determine the line that was causing my issue. After uploading that and taking another look in the console, I was pointed to line 1513, which looked like this:
if ( parent && parent.frameElement ) {
Above this line was a comment which made note of the issue that I was experiencing:
// IE will throw "permission denied" error when accessing "document" variable, see jQuery #13936
I Googled jQuery #13936 and came across this page, which suggested that I swap out the above line with:
if ( parent && parent.attachEvent && parent !== parent.top ) {
After making this change, I was glad to find the issue resolved and my form working as expected. I double checked the other browsers again and can confirm that they still work as expected as well.
Solved
This is a legit jQuery 1.10.1 bug: http://bugs.jquery.com/ticket/13980 .
Using jQuery 1.10.0, or 1.10.2 the error no longer occurs.
Ok, so all the rage these days is having a site like this:
mysite.com/
mysite.com/about
mysite.com/contact
But then if the user has Javascript enabled, then to have them browse those pages with Ajax:
mysite.com/#/
mysite.com/#/about
mysite.com/#/contact
That's all well and good. I have that all working perfectly well.
My question is, if the user arrives at "mysite.com/about", I want to automatically redirect them to "mysite.com/#/about" immediately if they have Javascript.
I have it working so if they arrive at "mysite.com/about", that page will load fine on its own (no redirects) and then all clicks after that load via ajax, but the pre-fragment URL doens't change. e.g. if they arrive on "mysite.com/about" and then click "contact", the new URL will be "mysite.com/about#/contact". I really don't like that though, it's very ugly.
The only way I can think of to automatically redirect a user arriving at "mysite.com/about" to "mysite.com/#/about" is to have some javascript in the header that is ONLY run if the page is NOT being loaded via ajax. That code looks like this ($ = jQuery):
$(function(){
if( !location.hash || location.hash.substr(1,1) != '/' ) {
location.replace( location.protocol+'//'+location.hostname+'/#'+location.pathname+location.search );
}
});
That technically works, but it causes some very strange behavior. For example, normally when you "view source" for a page that has some ajax content, that ajax content will not be in the source because you're viewing the original page's source. Well, when I view source after redirecting like this, then the code I see is ONLY the code that was loaded via Ajax - I've never seen anything like that before. This happens in both Firefox 3.6 and Chrome 6.0. I haven't verified it with other browsers yet but the fact that two browsers using completely different engines exhibit the same behavior indicates I am doing something bad (e.g. not just a bug with FF or Chrome).
So somehow the browser thinks the page I'm on "is" the Ajax page. I can continue to browse around and it works fine, but if I e.g. close Firefox and re-open it (and it re-opens the pages I was on), it only reloads the Ajax fragment of the page, and not the whole wrapper, until I do a manual refresh. (Chrome doesn't do this though, only Firefox). I've never seen anything like that.
I've tried using setTimeout so it does not do the redirect until after the page has fully loaded, but the same thing happens. Basically, as far as I can tell, this only works if the fragment is put there as the result of a user action (click), and not automatically.
So my question is - what's the best way to automatically redirect a Javascript capable browser from a "normal" URL to an Ajax URL? Anyone have experience doing this? I know there are sites that do this - e.g., http://rdio.com (a music site). No weirdness happens there, but I can't figure out how they're doing it.
Thanks for any advice.
This behavior is like the new twitter. If you type the URL:
http://twitter.com/dinizz
You will be redirected to:
http://twitter.com/#!/dinizz
I realize that this is done, not with javascript but in the server side. I am looking for a solution to implements this using ruby on rails.
Although I suggest you to take a look on this article: Making AJAX Applications Crawlable