I am getting cross-site Scripting: DOM critical issue. Please can anyone help with the alternateway of using document.write
<script>
document.write('<base href=“' + document.location + '” />');
</script>
You can use following to prevent DOM XSS:
<body>
<script>
document.body.innerHTML='<base href="' + encodeURI(document.location) + '" />';
</script>
</body>
Related
I am trying to introduce Angular in my Django app. I doubt, that my problem is directly correlated with interpolateProvider which is needed because of django templates... but who knows.
I also have a problem with simplified version of that: http://jsfiddle.net/33417xsm/
This is my current version:
<html ng-app="MyApp">
<head>
<script type="text/javascript" src="/static/js/libs/angular/angular.js"></script>
<script type="text/javascript" src="/static/js/app/app.js"></script>
</head>
<body>
<div ng-controller="MyAppController">
[[ 2 + 4 ]]
<p>[[ MyAppController.product.title ]]</p>
</div>
</body>
</html>
file: app.js
(function(){
var app = angular.module('MyApp', []);
app.config(function ($interpolateProvider) {
$interpolateProvider.startSymbol('[[');
$interpolateProvider.endSymbol(']]');
}
);
app.controller('MyAppController', function (){
this.product = gem;
});
var gem = {
'title': 'Inferno'
};
})();
My result:
As you can guess, I want to also display Inferno. What I am doing wrong?
Your app config is ok. But i see, you didn't understand clearly angular concept.
You must use $scope to binding data. Also you never need "myController.product" like this notation.
I updated your code http://jsfiddle.net/33417xsm/4/
<div ng-app="MyApp" ng-controller="MyAppController">
{{ 2 + 4 }}
<p>{{product.title}}</p>
</div>
var app = angular.module('MyApp', []);
app.controller('MyAppController', function ($scope){
$scope.product = {"title":"product title"};
});
I am new to javascript and geocoding and I'm trying to learn how to use the two together.
I have created a form to take the users input post code and I then have the code to convert it to long and lat. I have included and alert to show the postcode so as I know how much has worked (more to help me teach myself)
It returns the alert box with the input post code but nothing else!?
I would like it show the long and lat in alert box's. Once I know I have the long and lat I will be looking into adding them into a MySQL table, but I will worry about that once I know I have retreived the values
Here is the code:
<html>
<head>
<script type="text/javascript">
function getPostCode() {
var postcode = document.getElementById("pcode").value;
alert("Your Post Code is: " + postcode);
var gc = new google.maps.Geocoder();
gc.geocode({'address' : postcode}, function(results, status){
if (status == google.maps.GeocoderStatus.OK) {
alert( "latitude : " + results[0].geometry.location.lat() );
alert( "longitude : " + results[0].geometry.location.lng() );
} else {
alert("Geocode was not successful for the following reason: " + status);
}
});
}
</script>
</head>
<body>
<form name="search" METHOD="GET" onsubmit="return getPostCode()">
Post Code: <input type="text" name="pcode" />
<input type="submit" value="Search"/>
</form>
</body>
</html>
Any help would be much appreciated
----------------Update-------------------
Matt thanks for you help so far, I have now edited the code to output the value to paragraph tags and removed the alert box, but it still wont display the lat and long, is my geocode code correct? It pulls through the post code but not the lat and long or error.
<html>
<head>
<script type="text/javascript">
function getPostCode() {
var postcode = document.getElementById("pcode").value;
var postcode = "Your Post Code is: " + postcode;
document.getElementById("p1").innerHTML=postcode;
var mygc = new google.maps.Geocoder();
mygc.geocode({'address' : postcode}, function(results, status){
if (status == google.maps.GeocoderStatus.OK) {
var lat = results[0].geometry.location.lat();
document.getElementById("lat").innerHTML=lat;
var lat = results[0].geometry.location.lng();
document.getElementById("long").innerHTML=long;
} else {
var err = "Geocode was not successful for the following reason: " + status;
document.getElementById("error").innerHTML=err;
}
});
}
</script>
</head>
<body>
<form name="search">
Post Code: <input type="text" name="pcode" />
<input type="button" value="Search" onclick="getPostCode()" />
</form>
<p id="p1"></p>
<p id="long"></p>
<p id="lat"></p>
<p id="error"></p>
</body>
</html>
I'm not 100% sure what you're doing since you say you're using v3 of the API but you don't need to construct google.maps.geocoder for v3 -- that's a version 2 thing. Besides that, you aren't even including Google's Javascript onto your page with a <script> tag. Look at your Javascript console. It's probably throwing an error.
To geocode with v3, just make requests to this URL, for example:
http://maps.googleapis.com/maps/api/geocode/json?address=1600+Amphitheatre+Parkway,+Mountain+View,+CA&sensor=false
The response is ready-to-parse JSON. No need for classes, instantiation, etc.
Is that what you are trying to do?
<script type="text/javascript">
document.getElementById("IDOFELEMENT");
</script>
What is the correct way to turn this into a link?
Can I write
<script type="text/javascript">
document.getElementById("IDOFELEMENT").href("http://www.address.com");
</script>
Many thanks.
javascript:
// this changes the href value<br>
document.getElementById("IDOFELEMENT").href = "http://www.address.com";
and the html:
<a href="www.toBeChanged.com" id="IDOFELEMENT">To Website< /a>
You should specify what kind of element is IDOFELEMENT. But you can't convert it to a link by just adding a href attribute, it only works if IDOFELEMENT
is an hyperlink like <a id="IDOFELEMENT">stuff</a>
Simplest way is to add an onclick event to the element that changes the url to desired address:
<script type="text/javascript">
var element = document.getElementById("IDOFELEMENT");
element.setAttribute('onclick', 'window.location.href=\'http://address.com\'');
</script>
Or if you wanna wrap it with a hyperlink:
<script type="text/javascript">
var element = document.getElementById("IDOFELEMENT");
var parent = element.parentNode;
var link = document.createElement('a');
link.href = 'http://www.address.com';
link.appendChild(element.cloneNode(true));
parent.replaceChild(link, element);
</script>
I hope this helps you.
I came accross the issue - Javascript error: Cannot read property 'parentNode' of null.
I discovered this was due to executing this code while the DOM is not ready.
window.onload solved the issue for me.
<script>
window.onload = function() {
var element = document.getElementById("IDOFELEMENT");
var parent = element.parentNode;
var link = document.createElement('a');
link.href = 'http://www.google.com';
link.appendChild(element.cloneNode(true));
parent.replaceChild(link, element);
};
</script>
You just need to wrap your element in an anchor tag as follows...
<a href="http://www.address.com">
<div id="IDOFELEMENT">
... content ...
</div>
</a>
I am getting a error
error_log: Could not set cookie. Headers already sent.
Fatal error: Uncaught OAuthException: (#100) link URL is not properly formatted thrown in /home/admin/facebook.php on line 453
The script worked a months ago so just uploaded it again and got a error. This is a custom built script so donno whats wrong so thought id ask here. Here is my code
require_once 'facebook.php';
require_once 'database.class.php';
require_once 'config.php';
/**
* FB Session
*/
$facebook = new Facebook(array(
'appId' => FB_APP_ID,
'secret' => FB_SECRET,
'cookie' => true,
));
$session = $facebook->getSession();
$params = array(
'canvas' => 1,
'fbconnect' => 0,
'next' => URL_CANVAS,
'req_perms' => 'publish_stream, offline_access'
);
$loginUrl = $facebook->getLoginUrl($params);
/**
* User authenticated?
*/
if ($session) {
try {
$fb_uid = $facebook->getUser();
$me = $facebook->api('/me');
$access_token = $session['access_token'];
$pg = 'main';
} catch (FacebookApiException $e) {
echo '<script type="text/javascript">top.location.href = "' . URL_CANVAS . '";</script>';
exit;
}
} else {
$pg = 'splash';
}
?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta http-Equiv="Cache-Control" Content="no-cache" />
<meta http-Equiv="Pragma" Content="no-cache" />
<meta http-Equiv="Expires" Content="0" />
<title>bloxorz worldst hardest game can you beat it ?</title>
<!--// using jQuery UI for this sample app //-->
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<script type="text/javascript">
$(function() {
$("#tabs").tabs();
});
</script>
</head>
<body>
<!--// Facebook Javascript SDK needed for IFrame Canvas App //-->
<div id="fb-root"></div>
<script type="text/javascript" src="http://connect.facebook.net/en_US/all.js"></script>
<script type="text/javascript">
window.fbAsyncInit = function() {
FB.init({appId: '<?php echo FB_APP_ID; ?>', status: true, cookie: true, xfbml: true});
FB.Canvas.setSize();
};
(function() {
var e = document.createElement('script');
e.type = 'text/javascript';
e.src = document.location.protocol +
'http://connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
</script>
<!--// START: page include //-->
<?php
if (!empty($pg)) {
include $pg . '.php';
} else {
echo '<b>Error:</b> Page Not Found.';
}
?>
<!--// END: page include //-->
or is the error in side the facebook.php page ?
Because the line 453 in facebook.php is
// results are returned, errors are thrown
if (is_array($result) && isset($result['error'])) {
$e = new FacebookApiException($result);
if ($e->getType() === 'OAuthException') {
$this->setSession(null);
}
throw $e;
}
return $result;
}
You have started "echoing" output before headers are being set. Facebook.php on line 453 is trying to set some response headers but it can't, because headers have already been set and body of response has started.
Make sure you don't echo, var_dump, pr or output anything to browser before line 453 is executed.
I got the Facebook login/logout functionality to work, but had to do it with this un-elegant code like this:
<script type="javascript">
function loadfb() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol + '//connect.facebook.net/es_LA/all.js';
document.getElementById('fb-root').appendChild(e);
};
</script>
<body onload="loadfb()">
I plan on putting that Facebook login button on all the pages of the site, so I really don't want to have this function called onload of every page.
Is this function necessary? I don't completely understand what it is for. What is a better way to do this so I can take it out of my onload?
Thanks!
This code is for asynchronous loading of the Facebook JavaScript SDK. What it does is create the tag
<script async scr="https://connect.facebook.net/es_LA/all.js" ></script>
inside the <div id="fb-root"></div> element. While loading the SDK asynchronously is considered better practice, you can leave out this code and manually enter the script tag yourself - eg:
<div id="fb-root"></div>
<script src="http://connect.facebook.net/es_LA/all.js"></script>
<script>
FB.init({
...
});
</script>