javascript - Client-side website reachability test -


i building facebook application runs through apps.facebook.com system. question not facebook apps (so don't stop reading if not familiar these) you'll see why important shortly.

whenever user wishes use app, go firstly standard website (with more memorable address, let's use example xyz.com) automatically redirect facebook application. however, there 2 possible redirection destinations:

  1. to standard facebook application page (e.g. apps.facebook.com/xyz). should occur if client can reach page. importantly, reason client may not able reach page if on network running content filter (e.g. schools, universities, workplaces) blocks facebook.

  2. if client cannot reach facebook application page should redirected page on main website (e.g. xyz.com/nofacebook_login.html).

as can see, redirection decision needs based upon whether client can reach facebook application page, or not. therefore, testing need occur on client-side (presumably) using javascript, jquery, or similar. however, unsure how go this.

any suggestions appreciated.

the obvious solution (just send ajax request remote domain , see response) doesn't work due same-origin policy.

you ask facebook implement cross-origin resource sharing protocol. if agree, rest easier. if not, however, $.ajax - or native xmlhttprequest - won't do.

however, while xhrs subject same-origin policy, other ways send http request not: can create image src of image on apps.facebook.com, , see if loads. problem here facebook serves of content akamaihd.net, unlikely co-blocked apps.facebook.com. did, however, find one image served apps.facebook.com: http://apps.facebook.com/images/spacer.gif (http://facebook.com/images/spacer.gif exists). @robw pointed me favicon (http://apps.facebook.com/favicon.ico)

to test if image can loaded:

  1. create new img element
  2. add load listener , error listener it, perform redirect
  3. set img src
  4. adding image document should not neccessary, haven't tested everywhere.
var img = document.createelement("img"); img.onload = function(){location.href = "http://apps.facebook.com/xyz"}; img.onerror = function(){location.href = "http://xyz.com/nofacebook_login.html"}; img.src = "//apps.facebook.com/favicon.ico"; //thanks @robw document.body.appendchild(img);

note: facebook guarantee either image exist. while there seems decent chance stay, may disappear eventually. if happens, appear blocked (you may want check error code, don't know blockers return). if happens, please notify me or update answer new working image.


Comments

Post a Comment

Popular posts from this blog

monitor web browser programmatically in Android? -

i've got tricky question here. need users make payment bank (namely barclaycard) in uk. so, have https url , add parameters (such amount pay, order reference, etc) url, start http connection intent.actionview, redirect user browser can enter credit card details on bank's webpage , make payment our account successfully. far ? the code use below (i changed values privacy reasons) problem is, need app when user has completed/failed/cancelled payment. barclaycardautomatically redirects particular url when payment has succeeded, 1 if failed. there no way of knowing when barclaycard payment has succeeded go android app somehow ? button cardbutton = (button) findviewbyid(r.id.card_button); cardbutton.setonclicklistener(new view.onclicklistener() { @override public void onclick(view arg0) { string prehashstring = new string(); string prohashstring = new string(); string shapassphrase = new string(); shapassphrase = "gsvth£h70zkh...
Read more

Shrink a YouTube video to responsive width -

i have youtube video embedded on our website , when shrink screen tablet or phone sizes stops shrinking @ around 560px in width. standard youtube videos or there can add code make go smaller? you can make youtube videos responsive css. wrap iframe in div class of "videowrapper" , apply following styles: .videowrapper { float: none; clear: both; width: 100%; position: relative; padding-bottom: 56.25%; padding-top: 25px; height: 0; } .videowrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } the .videowrapper div should inside responsive element. padding on .videowrapper necessary keep video collapsing. may have tweak numbers depending upon layout.
Read more

wpf - PdfWriter.GetInstance throws System.NullReferenceException -

i'm trying create pdf document using itextsharp 5.3.4 using following document document = new document(); filestream stm = new filestream(filename, filemode.create); pdfwriter writer = pdfwriter.getinstance(document, stm); i'm getting system.nullreferenceexception following stack trace: system.nullreferenceexception occurred hresult=-2147467261 message=la référence d'objet n'est pas définie à une instance d'un objet. source=itextsharp stacktrace: à itextsharp.text.version.getinstance() innerexception: i've verified neither document nor stm null, , if select "continue" in vs12 document created - exception thrown. updated itextsharp 5.4.0 , it's still occurring. can't find information on anywhere - got ideas? make sure not catching exceptions. nullreferenceexception can 1 caught , handled inside itextsharp, don't care it. fact can continue supports theory. change following setting verify: debug -> exceptions ...
Read more