For some strange reason my Facebook connect does not work in my app in building, after it connect a blank screen it and it dies.
My script works in browser, BlackBerry 10 webworks app, browser on my BlackBerry Z10, Galaxy Tab, Playbook, even on the computer it works fine, but not in the app it self.
I know on BlackBerry 10 you need to disable the app in browser, i tried but did not work.
<feature name="InAppBrowser">
<param name="android-package" value="org.apache.cordova.InAppBrowser"/>
</feature>
function fboauthstart() {
var url = 'https://graph.facebook.com/oauth/access_token?client_id=' + facebookOptions.clientId + '&redirect_uri=' + facebookOptions.redirectUri + '&client_secret=' + facebookOptions.clientSecret + '&code=' + authCode;
$.ajax({
type: 'GET',
url: url,
success: function(data) {
var response = data;
var response = response.split('&');
var theAccessToken = response[0].split('=');
window.accessToken = theAccessToken[1];
fbfirstlinkcheck();
}
});
}
function startOAuth() {
var url = 'https://www.facebook.com/dialog/oauth?client_id=' + facebookOptions.clientId + '&redirect_uri=' + facebookOptions.redirectUri + '&scope=email,read_friendlists,user_online_presence,publish_stream,user_birthday,user_location';
childWindow = window.open(url, '_blank');
window.int = self.setInterval(function() {
var currentURL = childWindow.window.location.href;
var callbackURL = facebookOptions.redirectUri;
var inCallback = currentURL.indexOf(callbackURL);
if (inCallback == 0) {
window.clearInterval(int)
var code = childWindow.window.location.search;
code = code.split('code=');
code = code[1];
window.authCode = code;
childWindow.close();
setTimeout(function() {
fboauthstart();
}, 1000);
}
}, 1000);
}
I try to replace the href with assign, replace but also not worked and then on the computer it didn't work anymore.
I tried to change window.open to window.location.assign but also that did not work.
Anyone have experience with this?
You need to use this
window.location.replace("link.html");
InAppBrowser plugin "transforms" the javascript window.open function. It will not return a Window object any more but a InAppWindow.
You can still poll the children window, but by executing remote script:
var win = window.open( "http://...." );
win.addEventListener( "loadstop", function() {
var loop = setInterval(function() {
win.executeScript(
{
code: "window.myData"
},
function( values ) {
alert(values[0]);
}
);
});
});
Related
I have a PWA that uses the Google Maps API and places an avatar on the map in accordance with javascript navigator.geolocation.getCurrentPosition() method.
It all works well when I open the PWA on ANY browser in ANY laptop and Android/iPhone mobile phones, but as soon as I published it in the Play and App Stores, it stopped working on iPhone (but still working on Android). The geolocation doesn’t work at all and doesn’t even ask permission to allow the app to use geolocation. I saw in forums everywhere and there’s a large tendency that says geolocation on installed web apps on iPhone doesn’t work.
First, in a previous PHP page I use the jQuery ajax() method:
echo '
<script>
var idcidade = '.$_POST['hitfcidadeid'].';
$.ajax({
url:"geolocalizacao.php",
method:"POST",
data:{hitfcidadeid: idcidade}, success:function(data)
{}
});
</script>
';
In geolocalizacao.php I save the coordinates to two cookies:
if (isset($_POST['hitfcidadeid']))
{
echo '
<script>
function showLocation(position) {
document.cookie = "geolocationlat = " + position.coords.latitude;
document.cookie = "geolocationlong = " + position.coords.longitude;
}
function errorHandler(err) {
document.cookie = "geolocationlat = '.$linha['CIlat'].'";
document.cookie = "geolocationlong = '.$linha['CIlong'].'";
}
if(navigator.geolocation) {
var options = {timeout:60000};
navigator.geolocation.getCurrentPosition(showLocation, errorHandler, options);
} else {
document.cookie = "geolocationlat = '.$linha['CIlat'].'";
document.cookie = "geolocationlong = '.$linha['CIlong'].'";
}
</script>
';
}
Later on, on my map page:
function getCookie(name)
{
var re = new RegExp(name + "=([^;]+)");
var value = re.exec(document.cookie);
return (value != null) ? unescape(value[1]) : null;
}
if (getCookie("geolocationlat")==null || getCookie("geolocationlong")==null)
{
var lattemp = <?=$cidadelat2?>;
var longtemp = <?=$cidadelong2?>;
}
else
{
var lattemp = parseFloat(getCookie("geolocationlat"));
var longtemp = parseFloat(getCookie("geolocationlong"));
}
Result:
Laptop browser (chrome) – ok;
Android browser (chrome) – ok;
iPhone browser (safari) – ok;
Android web app – ok;
iPhone web app – not ok - returns null
thanks in advance,
i am developing an application and loading an hosted application using the inapp browser plugin cordova-plugin-inappbrowser
I have gotten most of the functionalities to work but i am unable to get the part of loading an error message when he url does not load, it dosent just work and shows me an error message of the url where i have hosted my application instead.
Which could be embarrassing.
please i need help on this
This is what am working with below thanks for ur potential responses
// my child browser code, the main source of my app content
function fire(){
var ref = cordova.InAppBrowser.open('http://####################', '_blank', 'location=no,zoom=no,hardwareback=yes,clearsessioncache=yes,clearcache=no');
var myCallback = function(event) { alert(event.url); }
ref.addEventListener('loadstart', inAppBrowserbLoadStart);
ref.addEventListener('loadstop', inAppBrowserbLoadStop);
ref.addEventListener('loaderror', loadErrorCallBack);
ref.addEventListener('exit', inAppBrowserbClose);
}
function loadErrorCallBack(params) {
$('#status-message').text("");
var scriptErrorMesssage =
"alert('Sorry we cannot open that page. Message from the server is : "
+ params.message + "');"
inAppBrowserRef.executeScript({ code: scriptErrorMesssage }, executeScriptCallBack);
inAppBrowserRef.close();
inAppBrowserRef = undefined;
}
function executeScriptCallBack(params) {
if (params[0] == null) {
$('#status-message').text(
"Sorry we couldn't open that page. Message from the server is : '"
+ params.message + "'");
}
}
Your code is generally fine, but you have no control over the title of the alert() function. You can use some other techniques to display the error message. For example, you can use a div:
function loadErrorCallBack(params) {
$('#status-message').text("");
var scriptErrorMesssage = createMsg('Sorry we cannot open that page. Message from the server is: '
+ params.message);
inAppBrowserRef.executeScript({
code: scriptErrorMesssage
}, executeScriptCallBack);
inAppBrowserRef.close();
inAppBrowserRef = undefined;
}
function createMsg(msg) {
return 'var div = document.createElement("div");'
+ 'div.style.position = "absolute";'
+ 'div.style.top = "50%";'
+ 'div.style.left = "50%";'
+ 'div.style.width = "100px";'
+ 'div.style.height = "100px";'
+ 'div.style.color = "#f00";'
+ 'div.innerHTML = "' + msg + '";'
+ 'document.appendChild(div);'
}
Hello everyone I've tried everything I can think of to make this work. I know it does return stream = null or active through use in the browser, but It will not apply my buttons to my page. Not so good with javascript can anyone point me in the right direction.
<script type="text/javascript">
(function() {
var user_name, api_key;
user_name = "Undead_Atomsk";
api_key = "************************";
twitch_widget.attr("href","https://twitch.tv/" + user_name);
$.getJSON('https://api.twitch.tv/kraken/streams/' + user_name + '?client_id=' + api_key + '&callback=?', function(data) {
if (data.stream) {
document.write(Live!);
} else {
document.write(Offline!);
}
});
})();
</script
Took your advice and used browser tools "Completely forgot about those".
I added this line to my html.
I then made a .js file and used the following code everything works now the twitch API is just slow!
(function() {
var user_name, api_key, twitch_widget;
user_name = "Undead_Atomsk";
api_key = "********************";
twitch_widget = $("#twitch-widget");
twitch_widget.attr("href","https://twitch.tv/" + user_name);
$.getJSON('https://api.twitch.tv/kraken/streams/' + user_name +'?client_id=' + api_key + '&callback=?', function(data) {
if (data.stream) {
document.getElementById("twitch-btn").innerHTML = 'Live!';
} else {
document.getElementById("twitch-btn").innerHTML = 'Offline!';
}
});
})();
I have to develop an app using phonegap (HTML5, css, javascript, json, jquery,...).
This app should have to open an external website (using inAppBrowser) to login and then go back to the app providing a token.
Now I can open the external website but I don't know how to go back to the app.
Can someone help me?
Thanks
Omar
I just wrote some code roughly to retrieve data from external website. Hope this helps:
var yourApp = {
getData : function(q) {
var search_url = "http://xyz.com/xyz/customfeed?filterby=custom&urlfilter=1&" + q;
$("#loading").show();
$.ajax({
type: 'GET',
url: search_url,
dataType: 'xml',
success: function(xml) {
$('entry', xml).each(function() {
var hi = new xyzDataItem();
hi.title = $(this).find('title:eq(0)').text();
hi.link = $(this).find('link:eq(0)').attr('href');
hi.desc = $(this).find('summary:eq(0)').text();
hi.date = $(this).find('updated:eq(0)').text();
hi.id = $(this).find('id:eq(0)').text();
$("#loading").hide();
$("#search_results").append('<div class="abc">' +
'<h2>' + hi.title + '</h2>' +
'<P>' + hi.desc + '</p>' +
'<P>xyzData</p>' +
'</div>');
});
}
});
}
}
If you are using InAppBrowser then do the following:
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
var ref = window.open('http://apache.org', '_blank', 'location=yes');
ref.addEventListener('loadstop', function(event) {
if (event.url,indexOf("http://apache.org") > -1){
//do something
}
});
}
Ideally the token should be part of the URL so that it is easier to retrieve. Else use $.getJSON method and do not use InAppBrowser. But if using InAppBrowser then the token should be a query string parameter.
E.g. http://yoursite.com/loginsuccess?token=adsfsadfdsfasdf
I'm trying to get my facebook graph oauth setup using javascript's window location methods.
Here is my code so far:
function fbLog() {
var clientID = '11502353444318540727';
var redirecturi = 'http://google.com';
var clientSecret = '6987d02323442423231f8b9da767b060e9';
var codeURI;
$('#fbLogin').click(function() {
window.location = 'https://graph.facebook.com/oauth/authorize?client_id=' + clientID + '&display=touch&redirect_uri='+ redirecturi + '&type=user_agent';
codeURI = window.location.href;
codeURI.split('=');
console.log(codeURI);
codeURI = codeURI.split('=');
codeURI = codeURI[1];
console.log(codeURI);
codeURI = codeURI.split('#');
codeURI = codeURI[0];
console.log('mega fun');
window.open = 'https://graph.facebook.com/oauth/access_token?client_id=' + clientID + '&redirect_uri=' + redirecturi + '&client_secret=' + clientSecret + '&code=' + codeURI
});
}
when I set codeURI to window.location.href, is that original call back page dead?
I'm super confused. Have I switched to a different window when I try to get the codeURI?
You have to assume that as soon as you set window.location, the browser will load a new page and all code on the current page will stop running. Don't try to do anything afterwards.
As far as I can tell, all you need here is to do things in a different order.