How to retrieve data from chrome's network console tool - javascript

This is captured from chrome's developer console
Based from the attached image, is it actually possible to retrieve the data in javascript/Node.js?
I've had already looked into Firefox's documentation for performance.getEntries() and it displays were performance results, none of them captured the containing data/responses .
Doing something like
return performance.getEntries();
or
return performance.getEntriesByType("resource");
will return a json formatted lists, none of them contains the data needed to be extracted.

It seems to me that it is a ajax request, if you can set a hook of all the ajax request, then you can store and retrieve them. You can do this by type code on chrome's console, and the code you may need is here: Add a "hook" to all AJAX requests on a page. Basically it rewrite the XMLHttpRequest.prototype.send method to do what you need.

Related

text/html output when requesting JSONP

I have been playing around with the jQuery library the last week or two.
Very handy! I am now playing with the AJAX requests to retrieve things such as the weather, current downloads and more, which have been going well so far!
I have now tried to connect up to my ISP to get my current data usage (peak, off peak etc).
When I use Chrome, I can manually type the variables into the URL and have the required JSON code show in the browser. The issue is, that it seems to return text/html instead of application/json.
When you go into developer tools, it shows text/html. This make it difficult for me to retrieve the data from my home server using AJAX and JSONP. See here for a failed query (but you can still see the text/html output, which is in a JSON format! Failed JSON Query on ISP
My question is, how could I get this data from the server URL, then make it into JSON that jQuery can read?
When I try the .load , $.get functions I run into Cross Origin Issues...
EDIT:Here is the PDF documentation for the API (Download at the bottom of the page)
Notice that I need to append certain values (user / pass / token). My ultimate aim is to have my JS read these values and store them.
The issue is, that it seems to return text/html instead of application/json.
That's a serverside issue. Go and file a bug report.
This make it difficult for me to retrieve the data
Not by itself. You should be able to override the settings how responses are parsed, e.g. in jQuery by using the datatype parameter.
using AJAX and JSONP
Notice that you cannot use JSONP, as it is not supported by that API (judging from the docs and a simple ?callback=test try). If you want support for that, file a bug report against the service provider.
When I try the .load, $.get functions I run into Cross Origin Issues...
Yes. They don't send CORS headers either. I suspect that this API is only used internally, and by devices that are not subject to a same-origin policy.
how could I get this data from the server URL, then make it into JSON that jQuery can read?
Use a proxy on your own server (that runs in the same domain as your app). It can also fix that content-type header.
For more details see also Ways to circumvent the same-origin policy, though most of the methods require cooperation of the service provider (to implement serverside features).
If i understand you correctly You ask for a certain value and it gives you a string. For most API's in the world they send a string that you have to parse into JSON or some language code. I would suggest looking at Parsing JSON Strings link. It explains how to take well formated strings and parse them into JSON readable objects.
var obj = jQuery.parseJSON( '{ "name": "John" }' );
alert( obj.name === "John" );
if you go on further and start using php take a look that Parsing JSON Strings with PHP
EDIT:
use .done() method to grab text from other pages after AJAX call.
$.ajax(...).done(function(html){
//do what you want with the html from the other page
var object = $.parseJSON(html)
}

Chrome: advanced usage of dev tools

I faced few problems while using Chrome dev tool. Just want to know whether it's possible and if yes - how. Suggest I have a really massive client side, with hundred of responses per page.
How to find endpoint which handle the response? I mean the first place in js code where the response come in.
How to find the response by it content? For instance, I want to know in which response I've got 45902309509902 value from the table.
How to find endpoint which handle the response?
On the Network tab, you can see where the request was originated, it's the column labelled "Initiator:"
That has a link that will show you the code originating the ajax call (I assume by "response" you're talking about an ajax response). From there, you should be able to find the callback that request is associated with. A lot of times, if you use a library like jQuery, you'll be shown the jQuery code doing the request rather than yours. You can still find what you need, though, by using the un-minified version of the libray, setting a breakpoint on that code (perhaps even a conditional one on, say, the URL being requested), and then when the breakpoint is hit using the call stack to find out where in your code the call actually originates.
How to find the response by it content?
This will be slightly more difficult. Again in the Network tab, you can click each ajax request and see (and search through) the text of there response under the Response sub-tab.

How Can I hide the ajax post parameter in console

Is there any way to hide the parameter that I send via post method using the Encoding or any other methods. Because Its roughly show my password in console and If I use Firebug with console Export It send my console log to any server we want show my password can leak through this.
Firebug can't do this, but you can use the console.clear(); after ajax is completed for an empty console.
Also you can use a way to encrypt the password that you sent like md5() function.
As far as I know, Firebug can't do this. However, there is a very useful Firefox extension, in the spirit of Firebug, called Tamper Data. This should be able to do what you want.
No.
It would be up to you to process the output of ConsoleExport when it is received on the target server, to mask sensitive information (passwords and others). (Also it would make sense to connect to that server using SSL.)
A filtering feature in ConsoleExport might be a good idea but there is no such option at present.

How to get data from remote website?

Lets say there is a url out there e.g. www.website.com/data.jsp
the link has the following JSON data
{"successful":"true","rows":[{"zip":"65472","user_id":"10843","name":"Rufio"}]}
I just want to be able to extract this data at runtime however I am having a hard time getting it using getJSON
$.getJSON("test2.jsp",function(result){
$("div").append(result.rows[0].user_id + " ");
});
Now if I run it using a local file with the data residing in test2.jsp as shown above it appends the user_id. However when I try to access "www.website.com/data.jsp" instead nothing happens. I don't believe the website is configured to work with JSONP either.
I need a way to figure out how to pull this data from the website at run time. Does anyone have any solutions or workarounds?
p.s. Is this something that might need to be sorted out on the other end? The people who own the website set this scenario up to be like a fake api call like typically you would pass in parameters to get back the specific information that you would need. In the case of this endpoint or url it just returns a single record or the file just contains the data listed above. They would like me to extract the data from their url at runtime.
You can't make a normal ajax call to to this other domain due to same origin policy.
You can use JSONP to load the remote page, but looking at that example output you wouldn't be able to access the data unless the remote site is setup for JSONP (assigning the JSON to a variable, calling a callback function, etc).
You could create a server-side passthrough script of your own. You don't mention what server-side technology you have available, but if you can use PHP, you do a passthrough like this:
<?php
echo file_get_contents("http://www.website.com/data.jsp");
?>
PHP (or any other server-side language) can fetch the remote data, and now you can use ajax to call your own script (which works since you're on the same domain).

HTTP 200 Response yet there's no valid content?

I've been looking into an issue i'm experiencing when posting to a server, specifically when opening a Word file from the returned response.
An XMLHttpRequest object via JavaScript is being used to send data back to the clients machine from the web server using the .open and .send functions - the responseText having the resultant XML within.
After looking in Fiddler this request shows the following:
However you can see there's the red symbol, looking at the Fiddler documentation this means that the "Session was aborted by the client, Fiddler, or the Server.".
Furthermore the header for the response appears to be correct:
What would cause the aforementioned behaviour? The browser is not displaying any visible script errors (IE8) and i've made sure that JavaScript errors are not supressed. Looking at the TextView filter in Fiddler you can see the Word data, mentions of Fonts and styles etc.
Thanks for your time!
It appears the issue was due to a mis-registered MXSML .DLL, after re-registering the DLL in question functionality was restored.

Categories

Resources