How to get html source code after javascript transformation? - php

for a project at school I am trying to make a website that can show your grades in a prettier way than it's being done now.
I have been able to log in to the site using cURL and now I want to get the grades in a string so I can edit it with PHP.
The only problem is that cURL gets the html source code when it hasn't been edited by the javascript that gets the grades.
So basically I want the code that you get when you open firebug or inspector in a string so I can edit it with php.
Does anyone have an idea on how to do this? I have seen several posts that say that you have to wait till the page has loaded, but I have no clue on how to make my site wait for another third-party site to be loaded.
The code that I am waiting to be executed and of which I want the result is this:
<script type="text/javascript">
var widgetWrapper = $("#objectWrapper325");
if (widgetWrapper[0].timer !== undefined) {
clearTimeout( jQuery('#objectWrapper325')[0].timer );
}
widgetWrapper[0].timer = setTimeout( function() {
if (widgetWrapper[0].xhr !== undefined) {
widgetWrapper[0].xhr.abort();
}
widgetWrapper[0].xhr = jQuery.ajax({
type: 'GET',
url: "",
data: {
"wis_ajax": 1,
"ajax_object": 325,
'llnr': '105629'
},
success: function(d) {
var goodWidth = widgetWrapper.width();
widgetWrapper.html(d);
/* update width, needed for bug with standard template */
$("#objectWrapper325 .result__overview").css('width',goodWidth-$("#objectWrapper325 .result__subjectlabels").width());
}
});
}, 500+(Math.random()*1000));
</script>

First you have to understand a subtle but very important difference between using cURL to get a webpage, and using your browser visiting that same page.
1. Loading a page with a browser
When you enter the address on the location bar, the browser converts the url into an ip address . Then it tries to reach the web server with that address asking for a web page. From now on the browser will only speak HTTP with the web server. HTTP is a protocol made for carrying documents over network. The browser is actually asking for an html document (A bunch of text) from the web server. The web server answers by sending the web page to the browser. If the web page is a static page, the web server is just picking an html file and sending it over network. If it's a dynamic page, the web server use some high level code (like php) to generate to the web page then send it over.
Once the web page has been downloaded, the browser will then parse the page and interprets the html inside which produces the actual web page on the browser. During the parsing process, when the browser finds script tags it will interpret their content as javascript, which is a language used in browser to manipulate the look of the web page and do stuff inside the browser.
Remember, the web server only sent a web page containing html content he has no clue of what's javascript.
So when you load a web page on a browser the javascript is ONLY interpreted once it is downloaded on the browser.
2. What is cURL
If you take a look at curl man page, you'll learn that curl is a tool to transfer data from/to servers which can speak some supported protocols and HTTP is one of them.
When you download a page with curl, it will try to download the page the same way your browser does it but will not parse or interpret anything. cURL does not understand javascript or html, all it knows about is how to speak to web servers.
3. Solution
So what you need in your case is to download the page like cURL does it and also somehow make the javascript to be interpreted as if it was inside a browser.
If you had follwed me up to here then you're ready to take a look at CasperJS.

Related

How to make a page full accesible by iFrame

The page 1 works an loads well into an iframe, but when I try to access through JS I got this error.
Uncaught DOMException: Blocked a frame with origin "https://domain1.com" from accessing a cross-origin frame (the frame that is trying to access is in "https://domain2.com" )
I'have the full access in both servers, and I already tried with 'X-Frame-Options' & header 'Access-Control-Allow-Origin' header, even tried to remove the X-Frame-Options header.
I don't know what else do.
I recommend that you not use iframes for your use case. Instead, fetch the content that you want to insert into the page through an XHR call, and insert it directly into the page. This only works if you're inserting your own content that you control.
That way, the content will actually be in the DOM of your main web page, and the outer elements around your content will grow in height automatically, subject to your CSS overflow setup and that kind of thing.
Here's an example of how I load a central footer from a corporate web site onto lots of web sites from the same company:
...
<div id='lazyFooter'></div>
</body>
<script>
function footerCallback(json_data){
document.getElementById('lazyFooter').outerHTML = json_data[0];
}
window.onload = function() {
var script = document.createElement('script');
script.src = 'https://footers.ourcompany.com/footer.min.json'
script.async = true;
document.getElementsByTagName('head')[0].appendChild(script);
}
</script>
This example uses JSONP, so the file that you load needs to be formatted as a Javascript function:
footerCallback(["\ <style class=\"embed\">\n\
#font-face{font-family:'Darby Sans ... </style><footer class=\"
... </div>\n\ </footer>\n\ "]);
If you're embedding someone else's content and it's not formatted as a JSONP response, then you have (at least) two options:
Use an iframe instead and deal with the Javascript hassles to set the height. (Ugly, not portable across browsers.)
Deploy a simple server-side microservice with an AWS Lambda function or something, for fetching the third-party content on the server side and packaging it as a JSONP response that you can embed in your page. Or, if you can run that microservice on the same domain as your site, then you don't need to worry about JSONP and you can simply proxy bare HTML from the third-party site through the microservice to your XHR call.

How to read a log file live that is constantly updating in server to web textbox

the log file will be in notepad format the values will be like this 11.23445646,56.3456578954
10.23445646,26.3456578954
16.23445646,-46.3456578954
I'm planning to get the data from server to website textbox, of first value which I marked as italic the values will change after few seconds the updated value will come first. I tried some PHP example but not getting it in the below text box the values I need to get.. for example: x=11.23445646, y=56.3456578954, pls guide me
Longtitude <input id="x" type="number" value = "" onkeyup="updateMarker('x')">
Latitude <input id="y" type="number"value = "" onkeyup="updateMarker('y')">
Updated Answer
You can do this now using Web Socketing. Here is a guide and hello-wrold example of a php websocket server:
http://socketo.me/docs/hello-world
And to see how to implement client side javascript of websocket, you can see the bottom of the link put above, which shows you this snippet:
var conn = new WebSocket('ws://localhost:8080');
conn.onopen = function(e) {
console.log("Connection established!");
};
conn.onmessage = function(e) {
console.log(e.data);
};
Old
PHP does not support live connections generally in the way you expect, you have to simulate it via repeated AJAX request. How? For instance on each second, or each two seconds.
You first have to write an ajax in your HTML with jQuery library:
Sending a request each second:
var url = "url_to_you_file";
var textarea_id = "#textarea";
setInterval(function(){
$.ajax({
url : "site.com/get-file-logs.php",
type : "POST",
success : function(data){
$(".textarea").html(data);
}
});
}, 1000);
Then in PHP file you would write this:
$file_path = "path_to_your_file";
$file_content = file_get_contents($file_path);
echo $file_content;
The above example gets the file content and sends it back to your browser. You may want to process it in a certain way; that then changes your approach a little bit. Because you must always stick to JSON format when you try to get data back from server to be manipulated by Javascript.
PHP doesn't really do "live" page updates since normally when a web browser (or other user agent) loads a web page once it's done downloading the page then PHP is already finished and can't touch what's already on the client.
Best way to do this would probably be to use a JavaScript AJAX call to periodically load the updated values from a PHP script and then update the values on the page.
Or if it's a really small page (in byte size) you could just make it automatically reload the whole page (with updated values) if that is not a problem for you.
In any case every time the PHP script is called it would just open the file in read mode and only read the latest values from the beginning of the file and return those. See fread(). Or maybe file_get_contents() or file() would be easier and just read the first line.
AJAX is a bit larger topic and I don't currently have the time to explain the whole process of updating the page using JavaScript. Google is your friend.

How to check remote server for status

I'm looking for something.
The problem is that I want to make my app do more locally and less remote.
It needs to put a parameter in every request (or websession id)
I tried the following
$.getJSON('http://*******************.com/loginapi.php?uuid=0x1a2b3c4e', function(jd) {
var reg = jd.usrreg;
var uuid = jd.usrpin;
var usrid = jd.usrid;
});
});
That does nothing, on the server side I don't even see a request to that page.
document.write(uuid) does not give anything back, when I go in my browser to the requested page I see the following:
{"usrreg":"0","usrpin":"0x1a2b3c4e","usrid":"0"}
I also tried with form data, so when I press login it sends a request to the server, but I should still get something back like usrreg=0 or 1, because it means the person is not registered, or usrreg=2 for wrong user/pass.
How can I read the value that I get when I open the page?
Cross Domain Request with Ajax are fobidden cause of Same Origin Policy: http://en.wikipedia.org/wiki/Same_origin_policy
So what are you alternatives?
Learn to use AJAX with JSONP - will only work if the other side provides it
Write a PHP bridge running locally that provides the remote data for you
Use postMessage: https://developer.mozilla.org/en-US/docs/Web/API/window.postMessage

Set $_SESSION in ajax request

I have this Jquery Ajax function to login in a web page.
url="<?php echo Yii::app()->createUrl("security/login") ?>"
$.ajax({
type:"POST",
url:url,
data:{},
success: function (jsonResponse) {
var json=JSON.parse(jsonResponse);
if(json.result == "SUCCESS")
{
<?php $_SESSION['LOGGED_USER']="USER"; ?>
}
},
error: function (jqXHR, textStatus, errorThrown) {
console.log(errorThrown);
}
});
And in my views layout I have this
session_start();
if( isset($_SESSION['LOGGED_USER']) )
{
print_r("LOGGED");
}
else
{
print_r("NOT LOGGED");
}
When I enter for the first time to the page It prints "NOT LOGGED" but it seems that it sets automatically the session so that when I reload the page It prints "LOGGED".
How can I set my session correctly in my ajax request?
Thank you very much :)
It seems a lot of people are confused about client vs server when it comes to Ajax. Let me see if i can clear that up:
Your JS runs in the browser (client). PHP runs on the server. The two are different languages that run on entirely different machines; they don't share the same variables or anything. They do not talk directly to each other, or really even know anything about each other. Their sole means of communication is via HTTP requests. (Well, there's WebSockets too...but that's a bit advanced yet.)
JS and PHP typically do not even run at the same time. Depending on your setup and where this script lives, one of two things is happening, and in this case, neither one is what you want.
The JS is in a file of some type the server doesn't feed to PHP. The PHP code is still in the file when the browser sees it -- and being invalid JS, causes a syntax error when you try to run it. Probably before you even get to do the Ajax post.
The JS is in a file of some type the server does feed to PHP. The PHP interpreter dutifully goes through the file, finds all the PHP code in it, and parses and runs it. The PHP code in it runs on the server, possibly before the page is even sent to the browser. (And since PHP doesn't speak JS, and doesn't even care if what it generates is valid HTML or JS...any non-PHP code in the page is irrelevant.) Anyway, by the time the browser runs your script above, it looks like this:
...
success: function (jsonResponse) {
var json=JSON.parse(jsonResponse);
if(json.result == "SUCCESS")
{
}
},
...
because PHP has already gone through the file and interpreted the bit about setting $_SESSION['LOGGED_USER']. If the user has an active session at all, logged in or not, that LOGGED_USER variable is set the second his browser requests that page.
The PHP script that's handling requests for security/login needs to set the session variable. Your JS won't be able to do it, as the session data is entirely server-side, and you can't let the browser just up and tell the server to run arbitrary PHP code without opening up a massive security hole. (Picture what could happen if the browser could say "hey, PHP, run this". All i'd have to do is pop up a JS console, see how you're doing it...and at the very least, i could write a line of JS in the console to set that variable whether i'm logged in or not.)
Or, if you really wanted, you could create another page that the JS posts to, that sets the session data. That seems a waste, though...and it might be quite difficult to do securely. (If PHP doesn't already know you're logged in, you'd have to re-authenticate and all that.) I wouldn't consider it unless for some reason security/login can't be modified.

Detect ajax code in javascript content

How can we detect, in the content of javascript code returned by the web server, the portion of code that allows client Web to make AJAX calls?
In other words, I want to know if there are existing libraries that can return the URL contained in the javascript code returned by the web server to the Web client. The URL returned by the web server to web client will allow the web client to make Ajax calls to the web server.
Here is an example
in the javascript code returned by a web server to web client, there are the following lines:
$.ajax({
type: "POST",
url: '/index.php?option=com_rechercheperso&view=recupeSecteur&format=raw',
data: 'style='+value_style+'&type='+value_type,
success: function(response){
$('#secteur').html(response);}
});
}
The question, is there a library that allows us to return the url ('/ index.php? Com_rechercheperso option = & view = & format = raw recupeSecteur') in analyzing the content of javascript code.
Thank you for your answers
Toufik
From the description I assume, that the Server is handing back a page, in which there are scripts using ajax calls with predefined urls, and you want to get those urls.
If right, you could use any language to call that page which loads the scripts (php, perl or even a JS ajax), and search with a regexp for all the urls in the responseText, and then try the matching ones for forther ajax calls against the Server.
Looks like brute-force solution, but should work.

Categories