How to secure and validate _fbp cookie - facebook

I am running a Netsparker scan on my site and it has raised an issue regarding the _fbp (Facebook) cookie - not being Secure and not marked as HttpOnly.
The code that Facebook has supplied which needs to go in the HEAD is:
<script>
!function (f, b, e, v, n, t, s) {
if (f.fbq) return; n = f.fbq = function () {
n.callMethod ?
n.callMethod.apply(n, arguments) : n.queue.push(arguments)
}; if (!f._fbq) f._fbq = n;
n.push = n; n.loaded = !0; n.version = '2.0'; n.queue = []; t = b.createElement(e); t.async = !0;
t.src = v; s = b.getElementsByTagName(e)[0]; s.parentNode.insertBefore(t, s)
}(window,
document, 'script', 'https://connect.facebook.net/en_US/fbevents.js');
fbq('init', 'XXXXXXXXXXXXX'); // Insert your pixel ID here.
fbq('track', 'PageView');
</script>
<noscript>
<img style="width: 1px; height: 1px; display: none"
src="https://www.facebook.com/tr?id=XXXXXXXXXX&ev=PageView&noscript=1" />
</noscript>
I would like this to be Secure and marked as HttpOnly if possible.
Plus, TotalValidator which is validating the site for WCAG2 AA is flagging an issue with the Image in the NoScript tag as Invalid.
Do we have to live with both these issues or is there a way to fix these issues?

Related

INSERT INTO using Postgres on PYTHON DB-API

I'm trying to learn to add backend to a simple web app using postgreSQL and Python DB-API.
When running the app, why do I get an error if the function get_posts() in forumdb. python uses c. execute ("SELECT * FROM posts ORDER BY time;) instead of SELECT content, time FROM posts ORDER BY time;)?
Secondly, can anyone explain why c.execute("INSERT INTO posts VALUES (content)") doesn't work and we have to use the ('%s') % content thing in the function add_post(content) in forumdb.py?
Below is forum.py
from flask import Flask, request, redirect, url_for
# Using a module called forumdb
from forumdb import get_posts, add_post
app = Flask(__name__)
# HTML template for the forum page
HTML_WRAP = '''\
<!DOCTYPE html>
<html>
<head>
<title>DB Forum</title>
<style>
h1, form { text-align: center; }
textarea { width: 400px; height: 100px; }
div.post { border: 1px solid #999;
padding: 10px 10px;
margin: 10px 20%%; }
hr.postbound { width: 50%%; }
em.date { color: #999 }
</style>
</head>
<body>
<h1>DB Forum</h1>
<form method=post>
<div><textarea id="content" name="content"></textarea></div>
<div><button id="go" type="submit">Post message</button></div>
</form>
<!-- post content will go here -->
%s
</body>
</html>
'''
# HTML template for an individual comment
POST = '''\
<div class=post><em class=date>%s</em><br>%s</div>
'''
#app.route('/', methods=['GET'])
def main():
'''Main page of the forum.'''
posts = "".join(POST % (date, text) for text, date in get_posts())
html = HTML_WRAP % posts
return html
#app.route('/', methods=['POST'])
def post():
'''New post submission.'''
message = request.form['content']
add_post(message)
return redirect(url_for('main'))
if __name__ == '__main__':
app.run(host='0.0.0.0', port=8000)
Below is forumdb.py
# "Database code" for the DB Forum.
import psycopg2
import datetime
def get_posts():
con = psycopg2.connect(dbname="forum")
c = con.cursor()
"""Return all posts from the 'database', most recent first."""
c.execute("SELECT content, time FROM posts ORDER BY time;")
return c.fetchall()
con.close()
def add_post(content):
con = psycopg2.connect(dbname="forum")
c = con.cursor()
"""Add a post to the 'database' with the current timestamp."""
c.execute("INSERT INTO posts VALUES ('%s')" % content)
con.commit()
con.close()
Thank you!
Because you are using  parameterized query is a query in which placeholders are used for parameters and the parameter values are supplied at execution time.
When we want to use a variable inside a SQL query you need to use a placeholder for it.
Example
query = """Update table set column_a = %s where column_b = %s"""

Facebook Custom Audience pixel on SinglePageApplication SPA

I have a SinglePageApplication built with AngularJs. I want too add Facebook Custom Audience tracking pixel globally and update it manually every time user changes page (url).
Is it possible and if so, how?
Reference: https://developers.facebook.com/docs/reference/ads-api/custom-audience-website-faq/
I managed to resolve this by loading _fbq object:
<script>
(function() {
var _fbq = window._fbq || (window._fbq = []);
if (!_fbq.loaded) {
var fbds = document.createElement('script');
fbds.async = true;
fbds.src = '//connect.facebook.net/en_US/fbds.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(fbds, s);
_fbq.loaded = true;
}
_fbq.push(['addPixelId', 'XXXXXXXXXXXXXXXXX']);
})();
//Notice removed 'PixelInitialized' call.
</script>
and then calling 'PixelInitialized' event every time page changes.
$window._fbq.push(['track', 'PixelInitialized', {}]);
Since then facebook correctly tracks my audiences.
Here's what I'm doing that seems to be working so far:
In my index.html file I removed the PageView function and commented out the pixel itself, as shown below.
<head>
<!-- Facebook Pixel Code -->
<script>
!function(f,b,e,v,n,t,s){if(f.fbq)return;n=f.fbq=function(){n.callMethod?
n.callMethod.apply(n,arguments):n.queue.push(arguments)};if(!f._fbq)f._fbq=n;
n.push=n;n.loaded=!0;n.version='2.0';n.queue=[];t=b.createElement(e);t.async=!0;
t.src=v;s=b.getElementsByTagName(e)[0];s.parentNode.insertBefore(t,s)}(window,
document,'script','//connect.facebook.net/en_US/fbevents.js');
fbq('init', 'XXXXXXXXXX');
//fbq('track', "PageView");
</script>
<!--<noscript><img height="1" width="1" style="display:none"-->
<!--src="https://www.facebook.com/tr?id=XXXXXXXXXX&ev=PageView&noscript=1"-->
</noscript>-->
<!-- End Facebook Pixel Code -->
</head>
Then, I configure my app as follows...
.config(['$stateProvider', '$urlRouterProvider', '$windowProvider', function($stateProvider, $urlRouterProvider, $windowProvider) {
var $window = $windowProvider.$get();
Now, for each state change, I use the onEnter and onExit to fire off the "events" I want to capture:
.state('foo.bar', {
url:'/bar',
templateUrl: 'template.html',
controller: 'templateCtrl',
onEnter: function(){
$window.fbq('track', "Page1Enter");
},
onExit: function(){
$window.fbq('track', "Page1Exit");
}
})
I'm guessing that, if I wanted to, I could simply move any fbq('track', "PageView"); code into a controller. For my use case, though, tracking from state changes works perfectly for monitoring flow from within my app.
Hope this helps someone else.
!function(f,b,e,v,n,t,s)
{if(f.fbq)return;n=f.fbq=function(){n.callMethod?
n.callMethod.apply(n,arguments):n.queue.push(arguments)};
if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
n.queue=[];t=b.createElement(e);t.async=!0;
t.src=v;s=b.getElementsByTagName(e)[0];
s.parentNode.insertBefore(t,s)}(window,document,'script',
'https://connect.facebook.net/en_US/fbevents.js');
// initialize facebook pixel code
fbq('init', {SET-YOUR-ID}); // <-- replace {SET-YOUR-ID} with your facebook pixel convesion id
// disabled automatic push state for single web application
fbq.disablePushState = true;
// then call manually track PageView event
fbq('track', 'PageView');
Into Single Page Application(SPA) you must disabled automatic listen on push State, pop State and windows history as Facebook pixel library by default hook into windows.history and push/pop state.
according to #lari answer about another related question to your question and Josh's Post blog

Show local HTML file with JavaScript in SWT Browser widget in RAP

For my RAP-project I need to show some charts. Because I haven't found any widget for this purpose, my plan was to use the browser widget, so I can use JavaScript-Plugins like Highcharts or Chartsjs. But I can't get it working. If I set an HTML-File in browser.setUrl, the browser widget don't show anything, not even simple HTML. The JavaScript-Console in Chrome says
Not allowed to load local resource
If I enter the HTML-Code with the setText method it shows the HTML, but JavaScript is not working, it don't load external JS-File like the jQuery-library.
Can't this be done this way? Or where is my failure? (Sorry for my bad englisch, I'm not native speaker.)
Here's the Java-Code I tried:
browser = new Browser(composite, SWT.NONE);
browser.setTouchEnabled(true);
browser.setBounds(10, 10, 358, 200);
browser.setUrl("D:\\STATS\\statistiken.html");
Or this:
File file = new File("D:\\STATS\\statistiken.html");
browser = new Browser(composite, SWT.NONE);
browser.setTouchEnabled(true);
browser.setBounds(10, 10, 358, 200);
browser.setUrl(file.toURI().toString());
I tried also some other things, there were not working to.
With HTML in setText-method (I tried external libraries and local libraries in same folder):
browser = new Browser(composite, SWT.NONE);
browser.setBounds(10, 10, 358, 200);
browser.setText(
"<html>" +
"<head>" +
"<script src=\"https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js\"></script>" +
"<script src=\"http://code.highcharts.com/highcharts.js\"></script>" +
"<script src=\"http://code.highcharts.com/modules/exporting.js\"></script>" +
"</head>" +
"<body>" +
"<p>Test</p>" +
"<div id=\"container\" style=\"min-width: 400px; height: 400px; margin: 0 auto\"></div>" +
"</body>" +
"</htm>");
Hope someone can help me with this problem.
Local links will not be resolved and external links will not be loaded(Cross Domain problem) in your case.
I could suggest you 2 Solutions.
Solution 1:
This is useful when you have very few resources(html, javascript, css) to render on Browser and no Hyperlinks(which when cliked will load a different page).
You can use Velocity. Read this to start using Velocity.
You can have all the static content in Velocity Template and inject Dynamic content into it at Runtime.
Here is the excerpt from one of my Projects.
init.vm
<html dir="ltr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style type="text/css">
.transcript {
background-color: #d2d2d2;
}
.messageBlock {
margin-left: 4px;
margin-bottom: -15px;
}
.message {
margin-left: 115px;
word-wrap: break-word;
white-space: -moz-pre-wrap;
_white-space: pre;
white-space: pre-wrap;
}
</style>
</head>
<script type="text/javascript">
function resizeChatWindow() { var divT = document.getElementById("divTranscript"); divT.style.height = (document.body.clientHeight - getTopAreaHeight()) + "px"; divT.style.width = (document.body.clientWidth) + "px"; divT.style.overflow = "auto"; divT.style.position = "absolute"; divT.style.left = "0px"; divT.style.top = getTopAreaHeight() + "px";}
function getTopAreaHeight() { var chatAlert = document.getElementById("chatAlert"); if (chatAlert) { return chatAlert.clientHeight; } return document.getElementById("divBody").clientHeight;}
isChat=false; window.onresize=resizeChatWindow;
</script>
<script type="text/javascript">
$scriptText
</script>
<script type="text/javascript">
function addChat(chatText){
$("#divTranscript").append(chatText);
$("#divTranscript").animate({ scrollTop: $("#divTranscript")[0].scrollHeight }, "slow");
}
</script>
<body onload="resizeChatWindow();">
<div id="divBody"></div>
<div id="divTranscript">$history</div>
</body>
</html>
VelocityUtils
private void init() throws Exception {
ve = new VelocityEngine();
Properties velocityProperties = new Properties();
velocityProperties.put("resource.loader", "class");
velocityProperties.put("class.resource.loader.description", "Velocity Classpath Resource Loader");
velocityProperties.put("class.resource.loader.class", "org.apache.velocity.runtime.resource.loader.ClasspathResourceLoader");
ve.init(velocityProperties);
//ve.init();
}
public String getInitHtml(String history) throws ResourceNotFoundException, ParseErrorException, Exception {
/* now render the template into a StringWriter */
StringWriter writer = null;
/* next, get the Template */
Template t = ve.getTemplate("templates/init.vm","UTF-8");
/* create a context and add data */
VelocityContext context = new VelocityContext();
String script = IOUtils.toString(VelocityUtils.class.getResourceAsStream("script/jquery.min.js"), "UTF-8");
context.put("scriptText", script); //You can even have all the script content in init.vm rather than injecting it at runtime.
context.put("history", StringUtils.defaultIfBlank(history, StringPool.BLANK));
writer = new StringWriter();
t.merge(context, writer);
/* show the World */
String returnMe = writer.toString();
return returnMe;
}
set the returned String in Browser.setText()
Solution 2:
I explained it here.

Is it possible to create a 'view all' page in Tumblr?

I've tried creating pages using the 'standard layout' and 'custom layout' but neither allows the use of the {block:Posts} variable(s). I need to re-create essentially the archive page but with some custom css. Is there any way to accomplish this?
If I try $("#someDiv").load("/archive", "#content"); the whole page formatting gets screwed up. Is there a way to load just the <a> tags into a div on my custom page?
Or would it be possible to use the API entirely client side to accomplish this?
Any ideas on this would be appreciated.
I came up with two possible solutions if anyone else finds themselves stuck on this. I abandoned this first one before finalizing it, so it's a bit rough but a good start. It uses the API to load photos (that was all I needed) as you scroll down the page.
<script>
function getPhotos(offset){
$.ajax({
url: "http://api.tumblr.com/v2/blog/[tumblr].tumblr.com/posts?api_key=[key]&offset="+offset,
dataType: 'jsonp',
success: function(results){
loaded += 20;
total = results.response.blog.posts;
if(total > loaded){
results.response.posts.forEach(function(post){
post.photos.forEach(function(photo){
$("#photos ul").append("<li class='"+post.tags.join(" ")+"'><img src='"+photo.alt_sizes[0].url+"'></li>");
$("#photos").imagesLoaded(function(){
$("#photos").masonry({
itemSelector: 'li'
});
});
});
});
if($("#photos ul").height() < $(window).height()){
getPhotos(loaded);
}
}
}
});
}
loaded = 0;
getPhotos(loaded);
$(window).scroll(function() {
if($(window).scrollTop() + $(window).height() > $(document).height() - 100) {
getPhotos(loaded);
}
});
</script>
What I've ended up doing is just using an iframe with a custom stylesheet appended to the head.
html:
<head>
<script src="http://[remote location]/frame.js"></script>
</head>
<body>
<div id="photos">
<iframe name="frame1" id="frame1" src="http://[tumblr]/archive" frameBorder="0"></iframe>
</div>
</body>
frame.js:
$(function(){
function insertCSS(){
var frm = frames['frame1'].document;
var otherhead = frm.getElementsByTagName("head")[0];
if(otherhead.length != 0){
var link = frm.createElement("link");
link.setAttribute("rel", "stylesheet");
link.setAttribute("type", "text/css");
link.setAttribute("href", "http://[remote location]/frame.css");
otherhead.appendChild(link);
setTimeout(function(){$("#frame1").show();}, 200);
clearInterval(cssInsertion);
}
}
cssInsertion = setInterval(insertCSS, 500);
//setTimeout(insertCSS, 1000);
$(window).scroll(function() {
if($(window).scrollTop() + $(window).height() > $(document).height() - 100 && $("#frame1").height() < 50000) {
$("#frame1").css("height", "+=1000px");
}
});
});
frame.css (stylesheet appended into iframe)
body{
overflow: hidden;
}
#nav_archive{
display: none;
}
.heading{
display: block !important;
}
.old_archive #content{
margin: 0 auto 0;
}
style.css (stylesheet on page where iframe is located)
#frame1{
border: none;
width: 100%;
height: 3000px;
overflow: hidden;
display: none;
}

Google Adsense Output

I want to Google Adsense script output code (HTML code)
I don't mean the javascript code (which google provides to users). The HTML output (you can grab it with Firebug or Google Developer Toolbar)
Thanks.
The I frame is :
<iframe width="120" scrolling="no" height="600" frameborder="0" vspace="0" style="left:0;position:absolute;top:0" src="http://googleads.g.doubleclick.net/pagead/ads?client=ca-pub-7051474033111975&output=html&h=600&slotname=1193041517&w=120&lmt=1339606481&flash=11.2.202&url=file%3A%2F%2F%2FC%3A%2FDocuments%2520and%2520Settings%2FLEFTERIS%2FDesktop%2Fgoogle.htm&dt=1339608015911&bpp=4&shv=r20120606&jsv=r20110914&correlator=1339608016097&frm=20&adk=1708676694&ga_vid=904765143.1337074819&ga_sid=1339608016&ga_hid=1901222006&ga_fc=1&u_tz=180&u_his=1&u_java=1&u_h=1024&u_w=1280&u_ah=934&u_aw=1280&u_cd=24&u_nplug=20&u_nmime=76&dff=serif&dfs=16&adx=8&ady=8&biw=1244&bih=293&oid=3&fu=0&ifi=1&dtd=235&xpc=dCXR5D0l2L&p=file%3A//" name="google_ads_frame1" marginwidth="0" marginheight="0" id="google_ads_frame1" hspace="0" allowtransparency="true"></iframe>
<style>a{color:#0000ff}body,table,div,ul,li{margin:0;padding:0}</style>
<script>(function(){window.ss=function(d,e){window.status=d;var c=document.getElementById(e);if(c){var a;a=c.href;var b=a.match("^(.*)([?|&]nm=)([^&]*)(.*)$");b?(b[3]=""+((Number(b[3])||0)+1),b[0]="",a=b.join("")):a+="&nm=1";c.href=a}return!0};})();function su(id) {var a = document.getElementById(id);var b = (new Date()).getTime();if (a && a.myt && b) {var t = b - a.myt;var bi = a.href.indexOf("&clkt=");if (bi > 0) {var c = a.href.substring(0, bi+6); var d = a.href.substring(bi+6, a.href.length);var ei = d.indexOf("&");var r = '';if (ei >= 0)r = d.substring(ei, d.length);a.href = c + t + r; } else {a.href += "&clkt=" + t;}}return true;}(function(){var e=function(b,a,c){var d="&"+a+"=",a=b.indexOf(d);0>a?c=b+d+c:(a+=d.length,d=b.indexOf("&",a),c=0<=d?b.substring(0,a)+c+b.substring(d):b.substring(0,a)+c);return 2E3<c.length?b:c};var f=null,g=function(b){f=b};document.addEventListener&&document.addEventListener("mousedown",g,!0);window.xy=function(b,a,c){c=c||a;if((b=b||f)&&a&&c){var d=Math.round(b.clientY-c.offsetTop);a.href=e(a.href,"nx",Math.round(b.clientX-c.offsetLeft));a.href=e(a.href,"ny",d)}};})();function cs(){window.status='';} function jcc(a) {pha=document.getElementById(a); nc=pha.href.indexOf('&jca='); if(nc>=1) return; jca=(717)+(6720)-(441); if (a=='aw0') {jca+=(-4392);} else if (a=='aw1') {jca+=(1043);} else if (a=='aw2') {jca+=(2446);} else if (a=='aw3') {jca+=(-4751);} else {jca=0;} phb=pha.href+'&jca='+jca; pha.href=phb;} function st(id) {var a = document.getElementById(id);if (a) {a.myt = (new Date()).getTime();xy(window.event, a);}return true;}function ha(a){ var pha=document.getElementById(a);var nhi=pha.href.indexOf("&nh=");if(nhi < 1) {pha.href+="&nh=1";}su(a); jcc(a); }function ca(a) { var pha=document.getElementById(a);var nci=pha.href.indexOf("&nc=");if(nci < 1) {pha.href+="&nc=1";}su(a); jcc(a); top.location.href=document.getElementById(a).href;}function ga(o,e) {if (document.getElementById) {a=o.id.substring(1);p="";r="";g=e.target;if (g) {t=g.id;f=g.parentNode;if (f) {p=f.id;h=f.parentNode;if (h)r=h.id;}} else {h=e.srcElement;f=h.parentNode;if (f)p=f.id;t=h.id;}if (t==a||p==a||r==a)return true;var pha=document.getElementById(a);var nbi=pha.href.indexOf("&nb=");if(nbi < 1) {pha.href+="&nb=1";}su(a); jcc(a); top.location.href=document.getElementById(a).href;}}</script>
<a title="www.gfi.com/fax" target="_top" onmouseover="return ss('','aw0')" onmousedown="st('aw0')" onfocus="ss('','aw0')" onclick="ha('aw0')" id="aw0" href="/aclk?sa=l&ai=BnKD-aMvYT-vyI6qU0AW52p2hB7aAuLECxuLcvRjAjbcBsOMtEAEYASDg8JsKKAQ4AFD85ObkAmCtytiDvAygAYqXwv8DugEKMTIweDYwMF9hc8gBAdoBQWZpbGU6Ly8vQzovRG9jdW1lbnRzJTIwYW5kJTIwU2V0dGluZ3MvTEVGVEVSSVMvRGVza3RvcC9nb29nbGUuaHRtgAIByALW54UYqAMByAMf6AP2COgD5QP1AwAAAMT1AwAAQBA&num=1&sig=AOD64_3Jznh97UCO3fRznTsPK1OHiH354Q&client=ca-pub-7051474033111975&adurl=http://landfax.gfi.com/fax-server-exchange-sm/%3Fadv%3D69%26loc%3D618" class="adt"><span>Send fax from computers</span></a>
<a target="_blank" href="http://www.google.com/url?ct=abg&q=https://www.google.com/adsense/support/bin/request.py%3Fcontact%3Dabg_afc%26url%3Dfile:///C:/Documents%252520and%252520Settings/LEFTERIS/Desktop/google.htm%26hl%3Den%26client%3Dca-pub-7051474033111975%26adU%3Dwww.gfi.com/fax%26adT%3DSend%2Bfax%2Bfrom%2Bcomputers%26adU%3Dwww.tradestead.com/ElectricGadgets%26adT%3DBuy%2BElectronic%2BGadgets%26adU%3Dwww.cloudsolutions.co.uk%26adT%3DGoogle%2BMigration%2BTool%26adU%3DAllwaySync.com%26adT%3DSkyDrive%2BPC%2Bsync%2Bsoftware%26gl%3DGR&usg=AFQjCNGOinsMYeIWqJU_FmQly3Uc-yRscA"><img height="16" border="0" src="http://pagead2.googlesyndication.com/pagead/abglogo/adc-en-100c-000000.png" alt="AdChoices"></a>
Probably that is what you want...