I'm currently using DOM Parser for my project. Also, I'm using CURL in php to scraping the website. I want to get a value from the script tag in the head of the HTML I get. But I really confused how to do that. If run the code bellow :
$data_dom = new simple_html_dom();
$data_dom->load($html);
foreach($data_dom->find('script') as $script){
echo $script->plaintext."<br>";
}
The result was the empty value, when I inspect it, only br tag appear. I want to get everything that using script tag. Here is the head value :
<head>
I will give you the script I want to get
.....
<script type="text/javascript">
var keysearch = {"departureLabel":"Surabaya (SUB : Juanda) Jawa Timur Indonesia","arrivalLabel":"Palangkaraya (PKY : Tjilik Riwut | Panarung) Kalimantan Tengah Indonesia","adultNum":"1","childNum":"0","infantNum":"0","departure":"SUB","arrival":"PKY","departDate":"20181115","roundTrip":0,"cabinType":-1,"departureCode":"ID-Surabaya-SUB","arrivalCode":"ID-Palangkaraya-PKY"};
(function(window, _gtm, keysearch){
if (window.gtmInstance){
var departureExp = keysearch.departureCode.split("-");
var arrivalExp = keysearch.arrivalCode.split("-");
gtmInstance.setFlightData({
'ITEM_TYPE': 'flight',
'FLY_OUTB_CODE': departureExp[2],
'FLY_OUTB_CITY': departureExp[1],
'FLY_OUTB_COUNTRYCODE': departureExp[0],
'FLY_OUTB_DATE': keysearch.departDate,
'FLY_INB_CODE': arrivalExp[2],
'FLY_INB_CITY': arrivalExp[1],
'FLY_INB_COUNTRYCODE': arrivalExp[0],
'FLY_INB_DATE': keysearch.returnDate,
'FLY_NBPAX_ADL': keysearch.adultNum,
'FLY_NBPAX_CHL': keysearch.childNum,
'FLY_NBPAX_INF': keysearch.infantNum,
});
gtmInstance.pushFlightSearchEvent();
}
}(window, gtmInstance, keysearch));
var key = "rkey=10fe7b6fd1f7fa1ef0f4fa538f917811dbc7f4628a791ba69962f2ed305fb72d061b67737afd843aaaeeee946f1442bb";
var staticRoot = 'http://sta.nusatrip.net';
$(function() {
$("#currencySelector").nusaCurrencyOptions({
selected: getCookie("curCode"),
});
});
</script>
</head>
I want to get the key variable. I will use it to get the data from the website. Thanks
Depending on what the rest of the markup looks like, you may be able to just use DOMDocument and XPath, then parse out the value of the var with preg_match. This example will echo the key.
<?php
$html = <<<END
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="text/javascript">
var keysearch = {"departureLabel":"Surabaya (SUB : Juanda) Jawa Timur Indonesia","arrivalLabel":"Palangkaraya (PKY : Tjilik Riwut | Panarung) Kalimantan Tengah Indonesia","adultNum":"1","childNum":"0","infantNum":"0","departure":"SUB","arrival":"PKY","departDate":"20181115","roundTrip":0,"cabinType":-1,"departureCode":"ID-Surabaya-SUB","arrivalCode":"ID-Palangkaraya-PKY"};
(function(window, _gtm, keysearch){
if (window.gtmInstance){
var departureExp = keysearch.departureCode.split("-");
var arrivalExp = keysearch.arrivalCode.split("-");
gtmInstance.setFlightData({
'ITEM_TYPE': 'flight',
'FLY_OUTB_CODE': departureExp[2],
'FLY_OUTB_CITY': departureExp[1],
'FLY_OUTB_COUNTRYCODE': departureExp[0],
'FLY_OUTB_DATE': keysearch.departDate,
'FLY_INB_CODE': arrivalExp[2],
'FLY_INB_CITY': arrivalExp[1],
'FLY_INB_COUNTRYCODE': arrivalExp[0],
'FLY_INB_DATE': keysearch.returnDate,
'FLY_NBPAX_ADL': keysearch.adultNum,
'FLY_NBPAX_CHL': keysearch.childNum,
'FLY_NBPAX_INF': keysearch.infantNum,
});
gtmInstance.pushFlightSearchEvent();
}
}(window, gtmInstance, keysearch));
var key = "rkey=10fe7b6fd1f7fa1ef0f4fa538f917811dbc7f4628a791ba69962f2ed305fb72d061b67737afd843aaaeeee946f1442bb";
var staticRoot = 'http://sta.nusatrip.net';
$(function() {
$("#currencySelector").nusaCurrencyOptions({
selected: getCookie("curCode"),
});
});
</script>
</head>
<body>foo</body>
</html>
END;
$dom = new DOMDocument();
$dom->loadHTML($html);
$xpath = new DOMXPath($dom);
$result = $xpath->query('//script');
foreach($result as $currScriptTag)
{
$currScriptContent = $currScriptTag->nodeValue;
$matchFound = preg_match('/var key = "(.*)"/', $currScriptContent, $matches);
if($matchFound)
{
/*
* $matches[0] will contain the whole line like var key = "..."
* $matches[1] just contains the value of the var
*/
$key = $matches[1];
echo $key.PHP_EOL;
}
}
Related
I hope I am asking this the correct way and thanks in advance for any advice! I have been trying to utilize this tutorial for a part on my own site:
https://developers.google.com/maps/documentation/javascript/mysql-to-maps
After trying many versions of my own code unsuccessfully, I decided to go ahead and step by step walk through the tutorial - even creating a new MYSQL DB exactly like in the tutorial...
In the tutorial example, they use an actual .xml file to read the data from:
// Change this depending on the name of your PHP or XML file
downloadUrl('https://storage.googleapis.com/mapsdevsite/json/mapmarkers2.xml', function(data) {
However, just like the commented line says above the code "PHP File" - meaning you could use a PHP file there instead of an .xml file which would then dynamically generate the XML code based on the DB query.
They show 3 different ways to get the XML code from the DB and I have tried all 3 ways with the same exact results.
When I run the index.html page I get just the map showing up with no markers at all
If I run just the php file that generates the XML code, nothing shows up in the browser (just a blank white page) -- HOWEVER -- when I view the page source, it shows me the XML perfectly!
If I take that generated XML from my PHP file and copy/paste it into an .xml file and then call that .xml file in the downloadurl function, it all works perfectly!
So, therein lies my question.
What piece am I missing that would allow me to use the PHP file to dynamically generate the XML versus needing a separate XML file in my directory too.
The code I am using is the same exact code they have in the tutorial page.
Thanks in advance!!
EDIT - here are the 2 php pages. The convert-xml.php is for generating the info from MYSQL db. It's, getting the info from the db because when I view source it shows the xml tree like it should be. It;'s just not writing it to the browser or working in the downloadurl function to display the markers on the map.
<!DOCTYPE html >
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Using MySQL and PHP with Google Maps</title>
<style>
/* Always set the map height explicitly to define the size of the div
* element that contains the map. */
#map {
height: 100%;
}
/* Optional: Makes the sample page fill the window. */
html, body {
height: 100%;
margin: 0;
padding: 0;
}
</style>
</head>
<body>
<div id="map"></div>
<script>
var customLabel = {
restaurant: {
label: 'R'
},
bar: {
label: 'B'
}
};
function initMap() {
var map = new google.maps.Map(document.getElementById('map'), {
center: new google.maps.LatLng(-33.863276, 151.207977),
zoom: 12
});
var infoWindow = new google.maps.InfoWindow;
// Change this depending on the name of your PHP or XML file
downloadUrl('convert-xml.php', function(data) {
var xml = data.responseXML;
var markers = xml.documentElement.getElementsByTagName('marker');
Array.prototype.forEach.call(markers, function(markerElem) {
var id = markerElem.getAttribute('id');
var name = markerElem.getAttribute('name');
var address = markerElem.getAttribute('address');
var type = markerElem.getAttribute('type');
var point = new google.maps.LatLng(
parseFloat(markerElem.getAttribute('lat')),
parseFloat(markerElem.getAttribute('lng')));
var infowincontent = document.createElement('div');
var strong = document.createElement('strong');
strong.textContent = name
infowincontent.appendChild(strong);
infowincontent.appendChild(document.createElement('br'));
var text = document.createElement('text');
text.textContent = address
infowincontent.appendChild(text);
var icon = customLabel[type] || {};
var marker = new google.maps.Marker({
map: map,
position: point,
label: icon.label
});
marker.addListener('click', function() {
infoWindow.setContent(infowincontent);
infoWindow.open(map, marker);
});
});
});
}
function downloadUrl(url, callback) {
var request = window.ActiveXObject ?
new ActiveXObject('Microsoft.XMLHTTP') :
new XMLHttpRequest;
request.onreadystatechange = function() {
if (request.readyState == 4) {
request.onreadystatechange = doNothing;
callback(request, request.status);
}
};
request.open('GET', url, true);
request.send(null);
}
function doNothing() {}
</script>
<script async defer
src="https://maps.googleapis.com/maps/api/js?key=MY_KEY_IS_HERE&callback=initMap">
</script>
</body>
</html>
convert-xml.php
<?php require 'conn-info.php';?>
<?php
// Start XML file, create parent node
$dom = new DOMDocument("1.0");
$dom->preserveWhiteSpace = false
$dom->formatOutput = true;
$node = $dom->createElement("markers");
$parnode = $dom->appendChild($node);
// connect to db
$membermap_conn = mysql_connect($membermap_server, $membermap_user, $membermap_password, $membermap_database);
if ($membermap_conn->connect_errno) {
echo "Failed to connect to MySQL: (" . $membermap_conn->connect_errno . ") " . $membermap_conn->connect_error; }
// select the db
$db_selected = mysql_select_db($membermap_database, $membermap_conn);
if (!$db_selected) {
die ('Can\'t use db : ' . mysql_error());
}
// Pull the zip / user information out of the database.
$query = "SELECT * FROM markers WHERE 1";
$result = mysql_query($query);
if (!$result) {
die('Invalid query: ' . mysql_error());
}
header("Content-type: text/xml");
// Iterate through the rows, adding XML nodes for each
while ($row = #mysql_fetch_assoc($result)){
// Add to XML document node
$node = $dom->createElement("marker");
$newnode = $parnode->appendChild($node);
$newnode->setAttribute("id",$row['id']);
$newnode->setAttribute("name",$row['name']);
$newnode->setAttribute("address", $row['address']);
$newnode->setAttribute("lat", $row['lat']);
$newnode->setAttribute("lng", $row['lng']);
$newnode->setAttribute("type", $row['type']); }
echo $dom->saveXML();
?>
In jquery autocomplete i am using htmlspecialchars() at the json encoding for title string.When i remove that htmlspecialchars there is an XSS vulnerability.But htmlspecialchars is not escaping the "&" and '(Single Quote) in the title string.For that i've added decodeHTMLEntities by referring the following url.Now there is no XSS vulnerability and there is no escaped data aslo.But when i am giving image tag as input, it directly displaying image,instead of that i need to display the image tag code.Can anyone please help me on this.Here i am sending you my code
How to decode HTML entities using jQuery?
<?php
$test = htmlspecialchars( '<img src="https://google.com" ></img>',ENT_HTML401,'utf-8');
?>
<html>
<head>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
</head>
<body>
<div id="asd"></div>
<script type='text/javascript'>
var decodeEntities = (function() {
// this prevents any overhead from creating the object each time
var element = document.createElement('textarea');
function decodeHTMLEntities (str) {
if(str && typeof str === 'string') {
// strip script/html tags
str = str.replace(/<img[^>]*>([\S\s]*?)<\/img>/gmi, '');
str = str.replace(/<script[^>]*>([\S\s]*?)<\/script>/gmi, '');
str = str.replace(/<\/?\w(?:[^"'>]|"[^"]*"|'[^']*')*>/gmi, '');
element.innerHTML = str;
str = element.textContent;
element.textContent = '';
}
return str;
}
return decodeHTMLEntities;
})();
document.getElementById('asd').innerHTML = decodeEntities('<?php echo $asd;
?>');
</script>
</body>
</html>
I can't find a solid answer on this, and trial and error is getting me nowhere.
I have am generating a dynamic PHP page with variables in my URL, so my URL looks like:
http://www.mypage.com/myfile.php?l=1&d=1&c=1
(works)
I'd like to also add an anchor to this, such as:
http://www.mypage.com/myfile.php?l=1&d=1&c=1#anchor1
(Does not jump to the anchor at the end)
The anchor is targeting a div such as:
Some link
<div id = "anchor1"></div>
Is this possible?
This should work better
Some link
<div>
<a name="anchor1"></a>
</div>
Note that the right way of doing it depends on what doctype you are using. You can read more about this for html5 here and for html 4.01 here
I guess the problem is that the id is added dynamically.
Then, you can refresh the hash AFTER adding the id and appending your element to the document
var h = location.hash;
location.hash = '';
location.hash = h;
Demo: http://jsfiddle.net/wpMDj/1/show/#anchor
Code: http://jsfiddle.net/wpMDj/1/
Alternatively, you can use scrollIntoView:
document.getElementById(location.hash.substring(1)).scrollIntoView(true);
But to avoid errors you need some ifs:
var hash = location.hash.substring(1);
if(hash){
var el = document.getElementById(hash);
if(el && el.scrollIntoView){
el.scrollIntoView(true);
}
}
Demo: http://jsfiddle.net/wpMDj/3/show/#anchor
Code: http://jsfiddle.net/wpMDj/3/
Some Browsers, will not automatically target your id, based on the URL hash. You may consider using JavaScript.
var doc = document;
function E(e){
return doc.getElementById(e);
}
function offset(element){
var x = 0, y = 0, e = element;
while(e && !isNaN(e.offsetLeft) && !isNaN(e.offsetTop)){
x += e.offsetLeft - e.scrollLeft;
y += e.offsetTop - e.scrollTop;
e = e.offsetParent;
}
return {left: x, top: y};
}
function YourSolution(listId){
var parentId = E(listId), pcn = parentId.childNodes;
for(var i=0,l=pcn.length; i<l; i++){
if(pcn[i].nodeType === 1){
var ac = pcn[i].childNodes;
for(var n=0,m=ac.length; n<m; n++){
var an = ac[n];
if(an.nodeType === 1){
an.onclick = function(){
var el = offset(this);
scrollTo(el.left, el.top);
}
}
}
}
}
}
Put the above on an external JavaScript page called scroll.js. Now put the following code at the bottom of your body:
<script type='text/javascript' src='scroll.js'></script>
<script type='text/javascript'>
YourSolution('listId');
</script>
</body>
</html>
If I embed my XHR file into my HTML document directly, everything works fine. As soon as I src it via
<script type="text/javascript" src="js/ajax_gallery.js">ajax_json_gallery('gallery');</script>
Nothing works, and I get no errors. I'm assuming it's something to do with the XHR being created in a separate file to the HTML. I just don't like XHR script cluttering up my HTML, I just want to load as an external JS file.
I've moved my main 3 scripts, galleryHandle.php, XHR.js, ajax_gallery.html all to the same dir level to keep things simple. And the gallery images are in a folder called "gallery", also on the same level.
Here's my code:
HTML
<html>
<head>
<title>Test</title>
<link rel="stylesheet" type="text/css" href="css/gallery.css" />
</head>
<body>
<div id="pagetop"></div>
<div id="thumbnailbox"></div>
<div id="pictureframe"></div>
<script type="text/javascript" src="XHR.js">ajax_json_gallery('gallery');</script>
</body>
</html>
JavaScript
function ajax_json_gallery(folder) {
"use strict";
var httpRequest = new XMLHttpRequest();
document.getElementById("pagetop").innerHTML = "dynamic ajax json gallery";
var thumbnailbox = document.getElementById("thumbnailbox");
httpRequest.open("POST", "galleryHandle.php", true);
httpRequest.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
httpRequest.onreadystatechange = function() {
if (httpRequest.readyState === 4 && httpRequest.status === 200) {
var data = JSON.parse(httpRequest.responseText);
var pictureframe;
pictureframe.innerHTML = "<img src='"+data.img1.src+"'>";
thumbnailbox.innerHTML = "";
for (var obj in data) {
if (data[obj].src){
thumbnailbox.innerHTML += '<div onclick="putinframe(\''+data[obj].src+'\')"><img src="'+data[obj].src+'"></div>';
}
}
}
};
httpRequest.send("folder="+folder);
thumbnailbox.innerHTML = "Loading...";
}
function putinframe(src) {
"use strict";
var pictureframe = document.getElementById("pictureframe");
pictureframe.innerHTML = '<img src = " '+src+' " >';
}
PHP
<?php
header("Content-Type: application/json");
//bring in folder name
$folder = $_POST["folder"];
//start componding json
$jsonData = '{';
//compound directory path
$dir = $folder."/";
//open directory
$dirHandle = opendir($dir);
//init while looop
$i = 0;
while ($file = readdir($dirHandle)) {
if(!is_dir($file) && strpos($file, '.jpg')){
$i++;
$src = "$dir$file";
$jsonData .= '"img'.$i.'":{ "num":"'.$i.'","src":"'.$src.'", "name":"'.$file.'" },';
}
}
closedir($dirHandle);
$jsonData = chop($jsonData, ",");
$jsonData .= '}';
echo $jsonData;
?>
I understand there are some redundancies in my code but it's just a tutorial I'm going through to learn the basics of JSON building with POST, XHR.
Anyway, help appreciated as always.
Thanks
Explanation
FROM W3C:
<script type="text/javascript" src="myscript.js">
alert('I am pointless as I won\'t be executed');
</script>
Upon meeting this element in a page, browsers will then load the file myscript.js and execute it. Any content inside the script element itself will be skipped when you provide a src attribute. The [last] example will load the file myscript.js and execute the code in it but will not execute the alert inside the script element at all.
Solution
Try the following in your head tags:
HTML
<script type="text/javascript" src="XHR.js"></script>
<script type="text/javascript">
ajax_json_gallery('gallery');
</script>
<script type="text/javascript" src="XHR.js">
You can't have src attribute and javascript both in a single tag. Separate them out. Like this...
<script type="text/javascript" src="XHR.js"></script>
<script type="text/javascript">ajax_json_gallery('gallery');</script>
This is a wierd problem, and I can't see an easy solution.
If you attempt to use DOM to parse a document that has a </head> tag contained within a javascript function, it doesn't work correctly. It takes the </head> inside the javascript function as the closing </head> tag.
I have been wrestling with this for hours - any ideas?
<?php
$contents =
<<<EOF
<!DOCTYPE html>
<html><head>
<script>function myFunc() { var myVar = "<head></head>"; } </script>
</head>
<body><p>This is a test</p></body>
</html>
EOF;
//GET CONTENT & LOAD INTO DOM
$doc = new DOMDocument('1.0', 'UTF-8');
$doc->loadHTML($contents);
//STRIP OUT THE JAVASCRIPT
$scripts = $doc->getElementsByTagName('script');
$length = $scripts->length;
for ($i = 0; $i < $length; $i++) {
$scripts->item(0)->parentNode->removeChild($scripts->item(0));
}
echo htmlentities($doc->saveHTML());
Common Javascript issue: Use this instead:
var myVar = "<head><\/head>";
You can escape characters that you don't want interpreted. For example:
var myVar = "\x3chead\x3e\x3c/head\x3e";
console.log(myVar);
Will create "<head></head>" without actual < > characters.