In the options page of my extension, I display the username of the person logged in, along with an option to log out. If they log out, I display instead a link asking them to log in. As well as being able to log in via the options page, they can also do so via the popup.html. The logged-in status is stored in localStorage, which I can access from the options page js.
I would like to be able to listen, in some way, for a change to this status, and update the UI accordingly. If changes are made via the options page, then I of course can change it. However, the issue is if a user logs in whilst via the popup, whilst already on the options page. In that situation, I would still like the options page UI to alter, to now reflect the updated logged-in status. I have thought of 2 different approaches:
(1) Have the background script send a message using chrome.runtime.sendMessage() to the options script every time I change the logged in status.
(2) Add a listener on the localStorage that fires when the logged-in status is changed.
I have tried both approaches, and failed. How can I automatically refresh the UI of my options page depending on the value of a localStorage variable which can be altered from different scripts within the extension?
The answer may be in (1) or (2), however my experience with chrome extensions is limited, so I might have got it programatically wrong and given up too early. Any help would be appreciated.
So I found an answer that allows me to send me message between the background and option page scripts. I had previously tried with chrome.runtime.sendMessage, etc..., however must have made a mistake in the way I implemented it.
options.js script:
chrome.extension.onMessage.addListener(function(request, sender, sendResponse) {
switch(request.type) {
case "loggedin-status-change":
alert(request.data.myProperty);
break;
}
return true;
});
and the background.js script:
chrome.extension.sendMessage({
type: "loggedin-status-change",
data: {
myProperty: "1"
}
});
Related
The primary interface to a site we're building is a jQuery UI auto-complete search box. Users enter some keywords, select the result and are redirected using location.href to their selected page.
All the searches are being tracked properly (_gaq.push(['_trackPageview','/?s=' + current_term']) before the redirect but the destination page is never logged. All the destination pages are set to / in GA.
I've looked but can't find a way to explicitly set the destination before the redirect. Do you have any ideas?
Thanks in advance.
It could be due to the fact that
_gaq.push(...)
is asynchronous. And then you're calling a redirect with window.location stopping code execution.
A solution could be to attach a callback function when calling _gaq.push:
_gaq.push(['_trackPageview','/?s=' + current_term], function() {
// redirect user here...
// window.location = ...
})
Do you have internal search configured in GA?
It's possible that your searches are being logged but the parameter being stripped out from the url on the top pages report.
In that case you should be able to see the data on the internal search keyword reports.
If that's the case and If you still want the parameter to show up in the top page report than you need to uncheck the checkbox on the profile configuration that defines if the search parameter is stripped out from the url.
I have a members site. Every web page's header bar will have the following 2 options depending the user is logged in or not:
Option 1) if the user is logged in, it will have the following 2 links:
"user12345"
"logout"
Option 2) if the user is log out, above 2 links will become:
"login"
"register"
The page has some Javascript code which will check a user cookie. If the user cookie exists, if will display option 1), otherwise option 2). There is no problem with the Javascript. It shows above options correctly.
Here's the problem. I use a server side script (perl) to do the "logout" function. The script will delete the cookie and re-direct back to the original page. I am hoping the page will show option 2), but it doesn't. It still shows option 1). The page needs to be refreshed to show option 2). This is confusing because users have clicked the logout link, yet when they return to the page, they still see their usernames there. They need to refresh the web browser in order to see that they have logged out.
Option 2) should show on the page upon clicking the "logout" link. But I simply have no idea how to get this done successfully.
Please provide your expertise to fix this problem.
First, I would suggest breaking the problem down so that you can test the logout functionality separate from the page redirect.
Modify your Perl script so logout doesn't redirect.
Login and then click logout.
Use a Chrome or Firefox extension that lets you view cookies. Verify that the cookie has been deleted.
If everything checks out here, I would suggest that you then reconnect the redirect and repeat the above steps:
When your page redirects and you don't see the login | register buttons, check to see if the cookie was deleted, if the cookie appears, then there may be something being cached in the code after the redirect.
As an alternative, you could use the document.referrer to capture your logout URL in your JavaScript code and also use this to determine if you should show the login | register buttons. For instance:
if(document.referrer = "/logout" || /* existing check of cookie goes here */) {
// show login | register
} else {
// show username, etc.
}
If possible, the best solution usability-wise would be to turn your logout url into an AJAX call so you don't need to reload the page. This would be better than the above solution because you could check the response object to determine if the logout operation was a success. If so, you could then dynamically replace the header bar with the correct text.
An AJAX example, using jQuery.ajax, is as follows:
$.ajax({
url: '/logout',
success: function(data) {
if(data.logout == true) {
// user is logged out
}
},
error: function(jqXHR, textStatus, errorThrown) {
/* problem with logout */
}
});
Your perl logout script will need to return a JSON object as a String, if successful:
{"logout":true}
There are other ways of making AJAX calls and transferring data to/from the server, and you can find those examples doing a search on Stackoverflow for "AJAX".
BlockquoteFirst, I would suggest breaking the problem down so that you can test the logout functionality separate from the page redirect...
I've fixed the problem without the use of AJAX call.
I have just tried to use the Facebook registration plugin inside an iframe page tab.
In case anyone is wondering why I would want to do this, I want to use the Facebook registration plugin to create a newsletter signup form on my FB page.
I tried with this code:
<iframe src="https://www.facebook.com/plugins/registration.php?
client_id=113869198637480&
redirect_uri=&
fields=name,birthday,gender,location,email"
scrolling="auto"
frameborder="no"
style="border:none"
allowTransparency="true"
width="100%"
height="330">
</iframe>
and this code:
<div id="fb-root"></div>
<script src="https://connect.facebook.net/en_US/all.js#appId={YOUR_APP_ID}&xfbml=1"></script>
<fb:registration
fields="name,birthday,gender,location,email"
redirect-uri=""
width="530">
</fb:registration>
In both cases I used the APP_ID of the page tab application, and the canvas url for that page tab, but I filled out the website field with the website being used.
WHen I take out the pre-filled FB info and fill out the form, a var_dump on the receiving page gives out the right info, but when I submit it with the pre-filled FB info, it does a popup saying, you are registering with APP_NAME_HERE, if you want to do this click continue, or undo if you don't (something like that) and when I click continue nothing happens.
I have used Firebug to inspect the page, and I think that the data is being sent to another iframe, but I don't know how to access it. I have tried changing target to _top, _self and _parent but this didn't work either. I also tried creating a new app specifically using the website attribute, and that failed in the same way too. ANy help gratefully received.
As far as I can tell, the target attribute is broken when using pre-filled info. Perhaps it has something to do with the way the flow must happen when the confirmation popup appears, but AFAIK it's not documented that the two cannot be used together. In any case, the pre-filled data seems to have the effect of forcing target=_top no matter what you specify in the attributes.
That being the case, you will have to specify an external page address as the redirect_uri and process the data there and then redirect back to the Facebook page address. If necessary you can pass some data back using the app_data parameter in the query string.
Most than likely you are already flagged as registered and are receiving back the cookie/header for FB connect to work. If this is the case you will need to un-register your application on facebook in the application management page. Once you do that the button will work again.
Lastly, if the user is logged into Facebook and already connected to
your application, the button will say Login and won't do anything when
clicked (but your application should detect this state using the
getLoginStatus method and not show the button).
https://developers.facebook.com/docs/plugins/registration/
You can debug your registration status using
FB.Event.subscribe('auth.statusChange', function(response) {
if(!response.authResponse) return;
console.log(response)
});
Hope this helps.
Looks to me that you are missing something:
< fb:register >
Here you can see that tha attribute onvalidate, which contains the name of the js function called after the Register button is pressed, to whom is passed the whole object containing the user info.
Greetings ;)
Luca
In the second code redirect-uri="" needs a value. It needs to be prefixed by your site url.
There are a few questions about this but none met my needs. I have created an extension and I am trying to communicate between a content script and my options.html. I have been trying to use the chrome.extension.onRequest.addListener and the chrome.extension.sendRequest and neither work at all. No commands are executed or anything. Here is my code:
content script:
chrome.extension.sendRequest({command:value}, function(response) {});
options.html
chrome.extension.onRequest.addListener(
function(request, sender, sendResponse) {
alert("in onRequest request.command = " + request.command);
decide_command(trim(request.value));
sendResponse({});
});
none of the alerts are executed and none of the functions are executed. I even tried using the example in the messaging API page and it didn't trigger any alerts or anything. I have tried a bunch of different combinations like putting the extension ID in the sendRequest to make sure its going to the right place, I have excluded the sendResponse to make sure it wasn't ending too quick. I have debug alerts all over and none get triggered except for the ones before and after the send request command in my content script. So I would assume it either gets executed and fails or something like that. Any help would be greatly appreciated I have been working on this for days.
I believe Chris noted an issue already: an extension's option page isn't running all the time, and is therefore not available to receive or generate messages. Background pages are better for this sort of communication, as they're always running, always available, and therefore always capable of responding to messages.
I'd suggest reworking your extension's architecture a bit such that the content script gathers relevant information and sends it to the background page. When the options page is opened, it can request the state from the background page. The background page is then responsible for maintaining state in a reasonable way, and for pushing information back and forth between the other pieces of your extension.
Does that make sense?
I need to do the following:
I have a textbox, which appears in every page of the site, that allows to subscribe to a newsletter. This I've done already and the user is redirected to previous view after subscription.
I'd like to add a javascript alert to the page the user is returned to, something like "Thanks for subscribing". How can this be done?
Thanks in advance.
EDIT: Propably it's not clear from the post tags. I'm using ASP.NET MVC 2 Preview 1
If you are doing a HTTP redirect, then the page you will render needs to be passed some information so that it knows to include the javascript to open the alert box (adding an optional element to the page might be a nicer way to do this).
That information needs to be stored either in a browser cookie, or in a session store (which is keyed from a browser cookie). You can remove this once you've rendered your message, so that it is only shown the first time you visit that page after the redirect.