Can firebug detect ajax operations that are in progress? - javascript

The firebug console has various panels that can keep track of a lot of information. The net panel keeps track of almost all network traffic and reports various pieces of information on that traffic, e.g. headers, latency, request parameters, etc. What I would like to do is access all this information programatically from the javascript panel because I have a script that needs to know if there is a request in progress. I haven't found any documentation on how the various panels interoperate or if they are even aware of each other. I need to make the script as generic as possible so tying the script to the code on the page is not desirable because the script would not operate on other pages because of minor quirks like function names not being the same.

What you're asking for is to gain access to Firebug's internal functionality, which can only be done if they expose an API. As far as I know, they don't expose an API to javascript, other than the familiar console object.
What they do have however, is an API for firefox plugin development. So you can create a firefox plugin that then either extends the Net panel of firebug to do what you want, or exposes another javascript object called console.net or something like that.
Here is a good tutorial (well, part of a tutorial series) that explains specifically how to listen to events in the net panel: http://www.softwareishard.com/blog/firebug-tutorial/extending-firebug-net-panel-listener-part-viii/

Check out firebug plugin NetExport
Edit: Here is the source code:
Also this source code may interest you tracingconsole

Well as far as I know, the only way to really "know" about in-flight XMLHttpRequests is to explicitly "remember" them in the code. It's like timeouts and interval timers - if your code doesn't hang on to a handle, it's lost.
If the pages in question do everything via jQuery or some other framework, then it might be possible to worm into that code and leverage whatever's done to track ajax work, but exactly how you'd do that would depend on the framework.
It might help your progress if you were to explain more about what it is you want to achieve with this technique. In other words, while what you asked about directly may not be possible, it might be possible to find another way to do whatever it is you want.

Related

hidden class can be edited using console window. how to prevent someone to do this? [duplicate]

I would like to know if there is a way to prevent an html page with jQuery or javascript to be modified by the user to change its behavior.
A user can modify it using tools such as FireBug or the Google Chrome developer bar to hide or show divs, add event listeners to page elements and so on.
I've seen some web pages showing a blocking div when the page is loaded and a pop-up telling to answer some question. If you answer it, the div hides and you can see the page normally.
But if you try to hide the blocking div using FireBug, the page reloads and there is no way to see the page correctly if you don't ansewer the question asked in the pop-up.
I want to know how could I prevent user from doing such things.
Thanks a lot.
It is not possible (which is a very good thing).
To defeat the method described in the question:
You can use the keyboard shortcuts to the console/tools (Ctrl+Shift+I in Chrome)
You can use the resource/net panel to see the source
You can see it at any other level, e.g. Fiddler
You can use a bookmarklet for easier access
No, you can't prevent people seeing or modifying your source/script if they want to...the ones you most want to prevent are the most able to circumvent any deterrent (and that's all anything you do is, a deterrent, not a stop) you put in place.
The only way to do it (in my opinion) is not have the page content load until the user does your desired action. After he answers the question (or whatever) you send an AJAX request for the content (of course, as thejh said, you should also validate the answer on the server, preferably in the same request). So you load page header, banners and anything not critical, but the actual content (say an article on a blog) should not be loaded until the user does your action.
Everything that a user's browser receives belongs to the user, so you can't enforce anything on that.
For sure you can't prevent anybody from doing what he wants to, but you can make changes more difficult.
Take a look at the DOMEvents, especially the Mutation-Events.
Those give you the ability to see when something has changes(attributes, removed/inserted nodes, data in textnodes ...). For example you could build a function that watches some special attributes you would'nt have to get changed and reload the page, if this happens.
As others have already said, it isn't possible to control what the end user does with data you've sent them.
It may be possible to detect the console object that Firebug and others use, but what can your site do with that information once you've got it? You can't disable firebug or prevent it from being used, or even know whether it has been used.
The bottom line is that once the web page and javscript code have been sent to the browser, it is out of your control.
The closest you can get to what you want is to move some of your code out of Javascript and to the server, where it will be untouchable by the user. However you'll still have to have some client-side code, which will still be at the mercy of malicious users.
The other alternative is to move to Flash or something similar, where the end user doesn't have direct access to the code or the object model. This has it's own downsides though, and you'd be bucking the trend, which is to move away from Flash toward HTML5 and Javascript.
It's impossible. When you send code to the client, the client can look at it and modify it. Only code that runs on your server is protected aganist that.
I don't think it's possible to do that unless you can make sure (or force) users to use browsers that don't have developer tool.
Use ajax to get remote information don't send the user all the information such as answers to polls etc get the answer after he picked a choice from the server using ajax for example. Client-side validation is never a good thing hell thats how I used to delete other stupid people's databases due to that unless people learn properly how things REALLY work they should get taught the hard way such as losing everything in a case of root access vulnerability.
I don't know why HTML has to be blocked it wasn't blocked since browsers came out he'll I could make my own browser with a socket and get HTML transfered right to some textbox and see it in my favorite notepad/editor etc..
As for javascript you can simply send javascript commands in browser address bar (how convenient of browsers in supporting hackers hehe but it's also used for inter-op communication with other technologies such as flash so it has a evil/good side to it as everything.)
If you didn't know you can just do
javascript: alert('hi');
or if your javascript game or whatever has globally scoped variables you can modify em easily
javascript: score=9999;damage=99999;
etc etc like i said it's all good it weeds out the bad programmers and gets em fired or teaches em a lesson in the future.
I've seen many big sites still fall to a SIMPLE XSS attack (Cross-site scripting) which is just baffling how these programmers get a job, I'd do a better interview or some shit it's ridiculous

Do you have any idea how Google Docs Javascript do the interval data autorefresh?

Alright, Here it goes:
I'm currently implementing a software which autorefresh/autopull/autoreload the data to keep the screen live by using AJAX.
This is actually working, but I know I´ve used the simplest approach which is:
SetInterval (javascript)
Call the Refresh Method over and over each n seconds.
Read the Json Data, rebuild the HTML and update it.
This can also be done by just calling a SetTimeOut (javascript) and the end of the AJAX request.
In the refresh method I internally check that it´s not being called simultaneously, etc.
However... this is the simplest approach, it works but, in slow computers, firefox and ie, I can see this activity sometimes freezes the browser, and I know this might not be necessary because of the AJAX call, but how "intensive" is the javascript operation overall... but, after running a profiler, Overall javascript (using jquery by the way) seem to be fine. Also if I disable the autorefresh, the browser wont freeze by short seconds in slow computers.
I decided to investigate how several of the majors AJAX applications works out there.
Facebook for instance.. they do a request all the time, every N seconds, interpret the JSON and update the screen, but, google docs... I can seem to find any request.. This is maybe because: they are just telling the javascript debugger engine that they do not want their request to be logged??, or, are they using another approach to the refresh dilemma?
I read in another answer here at stackoverflow, that Google Docs keeps an open connection..
Can this be the answer? http://ajaxpatterns.org/HTTP_Streaming
What do you guys know about this?
Just as a side note, the application I´m developing is meant to be accessed by thousands of users at a time, and I know the JavaScript refresh routine only tells a little part of the history, but the Server Side Application and the database is currently supporting such a load according to the stress tests I did by using several thousands of virtualized stations. I just want to know what you think about the client browser problem specifically.
Regards and
If you are still reading this..
Thanks you for your time.
I suspect they're using WebSockets. Browser support is flaky, so your mileage may vary with this approach.
You may also want to look at APE (ajax push engine), which is a decent implementation of long polling with a client/server architecture.
You can read up on Long Polling. But then you'll have to handle dropped connections etc.

How can we find the downloaded jquery plugin trying to connect to its developers site?

I am usually downloading several jQuery plugings.
How can I check whether the script is stealing any information (such as user cookie, session id..) and sending to its developer's server?
In php, we are checking backdoor scripts by looking for some functions (system, passthru, shell_exec, etc). Is there any such type of function in JavaScript to connect to its developers site?
Obviously, your first step should be to read the code. There are a number of tell-tale signs you can look for, including looking for URLs in the code, and any encrypted code.
Of course, some code may be too complex to make this a realistic suggestion, particularly if it's been minified and obfuscated, but it should be possible to scan through it. If it is doing anything like this, it'll be using the same functions it uses to communicated with your own site (ie jQuery's ajax functions), so you won't see specific function calls that raise suspicion, but suspect URLs in the code should be checked out, and you should definitely avoid encrypted code (obfuscated is generally okay, but not encrypted).
Secondly, search the internet for other people commenting about the plugin. If there is anything untoward happening, its likely that other people will have noticed it. Avoid using plugins that don't have enough users to get any comments one way or the other.
Finally, use a tool like Firebug to watch for HTTP requests that occur while you're using a site containing the plugin. If it's communicating with base, it can't hide from you; the browser's debugging tools will happily show you what you need to know.
Hope that helps.
I don't think you can do anything else than read the whole code, and check if it is stealing anything.
Another thing you could do, is to search in the codes after words like 'document.cookie' and 'navigator' and other things that are necesary for stealing information.

Where can I get advice on how to build completely ajax web apps?

I am building a completely ajax web app (this is the first web app I have ever created). I am not exactly sure if I am going about it the right way. Any suggestions or places where I can go to find suggestions?
Update:
I currently am using jQuery. I am working on fully learning that. I have designed a UI almost completely. I am struggling in some parts trying to balance a good UX, good design and fitting all the options I want to fit in it.
I have started with the design. I am currently struggling with whether to use absolute positioning or not and if not how do I use float etc. to do the same type of thing. I am trying to make it have a liquid layout (I hate fixed-layout pages) and am trying to figure out what I should use to make it look the same in most screen sizes.
Understand JavaScript. Know what a closure is, how JavaScript's event handling works, how JavaScript interacts with the DOM (beyond simply using jQuery), prototypal inheritance, and other things. It will help you when your code doesn't work and you need to fix it.
Maintain usability. All the AJAX magic you add is useless if users cannot figure out how to use it. Keep things simple, don't overload the user by giving him information he doesn't need to know (hide less important information, allowing the user to click a link to show it), and if possible, test your app with actual users to make sure that the interface is intuitive to them.
Code securely. Do not allow your server to get hacked. There are many different types of security flaws in web apps, including cross-site scripting (XSS), cross-site request forgery (CSRF), and SQL injection. You need to be well aware of these and other pitfalls and how to avoid them.
One starting point is to look at the Javascript Libraries and decide which one to use:
http://code.google.com/apis/libraries/
http://en.wikipedia.org/wiki/Comparison_of_JavaScript_frameworks
You probably don't want to do raw Javascript code without any library. Once you decide on a library to use, then you can look at its documentations online or the books about using them. jQuery does have pretty good documentation.
Define "right way."
There are many "right ways" to code an app.
Things to keep in mind are trying to design a nice interface. The interface can make or break an application and studies show that it can even make it seem faster if you do it right. jQuery is good for this.
Another thing to consider going in is what browsers do you want to support? Firefox is really doing well and Google Chrome's market share is growing so you will want so support those for sure. IE is a tough one as it doesn't have the best support for standards, but if you are selling a product you will really want this.
One of the best articles that I've ever come across about the structure of an ajax web application is this one. A little outdated because it refers to XML as the primary data-interchange format, now JSON. jQuery, a javascript framework, contains excellent functionality for both DOM manipulation and AJAX calls. Both are a must in any AJAX-driven web app.

How to track my jQuery plugin's usage?

I would like to know if there is a way of tracking who is using my jQuery plugin by using some javascript code inside the plugin itself. My plugin is being used on different sites, so I'd like to know where it is being used and how many times it is being accessed.
You could just present a registration form for people to fill out before the download the source code, asking them for some basic contact information and the website they'll be using it on. I don't think #SLaks' idea of a 1x1 pixel gif is that bad of an idea, however it does cause additional load on both your server and it's also an additional request for the visitors to all the sites that use your plugin.
Because jQuery plugins are just plain JavaScript code, many people might just remove the part that adds the tracking image, considering it to be an invasion of privacy or just a waste of resources, or for whatever reasons. They may feel like it was trickery or it was "snuck in". Asking for people to register however it a clear demonstration of your motives. It's not sneaky, you're clearly wanting to track usage and I think most developers will understand that.
Even if the registration form is optional it should give you a pretty good feel for who's downloading and using your plugin.
You could create an <img> element in the plugin that points to a server-side script that increments a counter. (This would work across domains)
However, this could be viewed as spying, especially for intranet sites.
It would probably be very controversial; I wouldn't recommend it.
You could easily do a get request to an API on your server. For example just
$.get("http://youserver.com/api/track/");
And then on your server you could see who was it was that used your plugin using PHPs $_SERVER["REMOTE_HOST"] and incrament a counter.

Categories

Resources