I have come across Evernote's bookmarklet and was wondering how this worked.
You can just drag it to your bookmark and go to any webpage, click that bookmarklet and it will first ask you to login in. All this I have done already and know how it works.
The bit that I don't understand is that when you log in they authenticate you and allow you to submit stuff (in this case, a site url etc). When you are done the bookmarklet which placed a small overlay on the page you are viewing disappears.
When you go to a new tab and use the
bookmarklet again you are still logged
in! How?
I can see they are using an iFrame when their bookmarklet loads the overlay onto the page - but do they set cookies or something? If so, is this secure? Anyone can change the values? Or are they using some sort of private/public key system
Btw, I would like to replicate this Bookmarklet using PHP/Javascript(JQuery maybe). I would appreciate if anyone can help me understand how they do this or point me to relevant tutorials.
Thanks all for any help.
For starters, here's the code the bookmarklet executes:
(function(){
EN_CLIP_HOST = 'http://www.evernote.com';
try{
var x = document.createElement('SCRIPT');
x.type='text/javascript';
x.src = EN_CLIP_HOST + '/public/bookmarkClipper.js?' + (new Date().getTime()/100000);
document.getElementsByTagName('head')[0].appendChild(x);
} catch(e) {
location.href = EN_CLIP_HOST + '/clip.action?url=' + encodeURIComponent(location.href) + '&title=' + encodeURIComponent(document.title);
}
})();
What it does is relatively simple. It tries to grab a script from the Evernote site and adds a timestamp to the request so that it always pulls a fresh copy. If that succeeds, a bunch of JavaScript is added to the page which builds an iframe from which all of the Evernote functionality is exposed and the iframe can then used standard cookies, etc. to make sure you're logged in and then process your request.
The catch block is just in case the dynamic script loading fails, in which cause you're redirected to the Evernote site so (I'm guessing) that it can clip the content from there.
To answer the specific question of how you are still logged in, you're still logged in because your browser now has the session cookies for the Evernote site (www.evernote.com), so when the iframe opens up on the second site, those cookies go with it and Evernote recognizes that you're logged in. Using cookies is pretty much the standard for sessions on the web, so they're not doing anything special here and I'm sure you can search SO for the security issues surrounding cookie based sessions.
The main point is the iframe is essentially like having a separate window open, except that it allows some limited data to be passed by the base page to the iframe so it know what website you're on.
Hope that helps.
They are probably using cookies. They most likely open up an iframe, with JavaScript, to a php page on their site, then the site looks for a login cookie, if it is there, the site pulls the user info, and does its thing.
Just be careful, you need a way to verify that the cookie wasn't created by the user to trick the site. I would store a random string in a cookie, and also in the database (in the user table). Create the random string whenever the user logs in. When the user tries to use the bookmarklet, compare the two strings, and only allow access if they are equal, if they aren't, delete the cookies, and ask the user to login.. This makes sure an attacker can't just make a cookie with the user's ID and take over their account (the attacker would need the random string, generated each login, which would be hard to obtain)..
Also, set the cookies to delete when the browser session is ended..
Hoped that helped,
Max
Related
I have a question but I just give an example to make it clear
I want to load any URL page, like the facebook login page, and fill the textboxes (user name and password) with data.
I want to do that from PHP or Javascript.
That mean - every time my php / javascript page will be loaded, the facebook login page will show and the textboxes automatically filled with data
can i do that? i know the browser (CHROME or EXPLORER) do that
but maybe it's possible only with browser and not with PHP / JS ?
Javascript is out of the question as you cannot load your Javascript when the Facebook page loads. And if you're thinking iframe the browser will prevent the Javascript in one frame from working in another frame, if it is not from the same domain.
If it is for Facebook, you should really look into their API. Many sites (like this one) now allow users to login using their Facebook login, so the API may be the easiest route. Also for major sites, like Facebook, there maybe some third party libraries that could help.
Now if Facebook is just an example and you need it for some other sites, it might be possible with PHP using cURL or maybe SOAP, but it could be very tricky. You need to realize that hackers will use similar techniques for brute force attacks, to find usernames and passwords. So sites like Facebook have done several things to limit the possibility of auto filling a login form (or any form). Also, for major sites like Facebook, using these techniques might be a violation of the terms of service, so you should check into that first.
If this is for yourself, you can write javascript:code in your bookmart and execute it everytime you open Facebook (or other page) for example
After having completed an online registration process, I want to check if the user is using an iPhone, and in that case give the option of opening App Store to download the app. Here's what I've coded so far:
In PHP, check $_SERVER['HTTP_USER_AGENT'] for the presence of the substring "iPhone".
If so, output JavaScript code that, before redirecting to the welcome page, offers the possibility of going to App Store using a confirm box.
Redirect to itms-apps://itunes.apple.com/url-to-my-app using window.location = ... in JavaScript.
This works. However, when the user once again opens Safari, the page which I redirected from is still open. This doesn't make any sense in my case. I want to redirect to the welcome page regardless of whether the user chooses to open the App Store. If I try to write another window.location line below the first one to perform a second redirect, Safari simply skips the link to the App Store.
I've considered redirecting from a hidden iframe, placing some kind of timer on the second redirect, experimenting with different combinations of JavaScript and HTTP header redirects and so on. None of the solutions I've thought of so far seems really solid, though. How do I do this if I want it to work gracefully across browsers and versions?
The only way to do this is to use the welcome page itself to do the iTunes redirect.
I need to load the login page of another website (different domain), wait for the user to fill it in and submit it, then read the URL/Location/Querystring for a token parameter to my site and close the login page.
Don't want the username or password, only interested in the returned token (http://www.othersite.com/?token=blahblahblah), which will then be passed as a querystring to a page on my domain (http://www.mydomani.com/loadtoken.php?token=blahblahblah).
Currently, a user has to do this in a separate page, copy and paste the token into my page, since these tokens only have a short life, it's somewhat irritating practice, and if it can be done behind the scenes by the site instead it would make it simpler for everyone.
Reading around on iframes, divs and ajax suggest this is not possible due to security policies, cross site scripting, etc.
Is it possible? What should I be looking for or concentrating on, or can you give some examples.
Thanks for your help.
Edit: Should have said, I understand that it's possible to take the username and password and do a POST behind the scenes, but I really want to avoid making the users give my site their login details to another site, for obvious reasons.
The simplest method is to present the login form on your own site. The form posts to your server, and the handling script then does a CURL request to do its own request to the other server. This sends the login response (which presumably contains that token) to your server.
However, if this token takes the form of a cookie, and the cookie's required for the user to do further operations on their own on this other site, then this won't work. There is absolutely no way for your server to accept the cookie on the user's behalf, then send the cookie to the user in such a way that it appears to have been set by the other server.
The easiest way would be for you to post that form's information to the remote host and have that site send the token to a callback script on your own host.
I need to load the login page of another website (different domain), wait for the user to fill it in and submit it, then read the URL/Location/Querystring for a token parameter to my site and close the login page.
You can't do that
What should I be looking for
OAuth / XAuth (which will require the co-operation of the site you are trying to log in to)
I’m working on a bookmarklet solution with similar functionality as Instapaper (bookmarklet functionality that is, not site functionality).
For my first bookmarklet version I sent the user to mysite.com/add.php?url=[url], which then did what I wanted to do (added url to the database, etc) in the backend as long as the user was logged on to my site since before (session kept alive using cookies). The user then had to press a back button to return to the original site. This worked as intended.
Now I want to let the user remain on the original site (as the instapaper bookmarklet does) while I do the backend stuff in the background, therefore:
- The bookmarklet now appends a javascript function to the original site
- The javascript uses a form and submits the URL to mysite.com/add.php with url as a variable (add.php is unchanged)
- I output status from add.php into an iframe that appears on the orignal site
This works so far that the url is sent to add.php, while the user remains on the original site, and the status is printed in the iframe I temporarily display on the original site.
However, from the scripts point of view the user no longer appears to be logged on, even if he/she is when mysite.com is accessed directly. I’m using this login system (http://www.evolt.org/node/60384).
Can you point me in the right direction? Let me know if you need more info.
Thanks
Since I get this to work in IE, but not in Firefox or Chrome, I'm leaning at the conclusion that it's due to the browsers security precautions, and that I won't get it to work by only using php session.
I've therefore come up with an alternative solution to what I want to achieve, that I want to run by you.
Please comment:
1) When a user register at my site, I create a random unique static identifier (RUSI) for that user (i.e. not the username or hashed pwd)
2) I append this RUSI to the bookmarklet code (meaning the bookmarklet can only be added while the user is logged in to my site)
3) When the user press the bookmarklet, my script checks what username the RUSI corresponds to, and checks if that username is in my active_user table (that consists of all logged in uers)
4) If the username exists in the active_user table, then the bookmarklet does what it supposed to do, otherwise i print "please login" or similar.
As said, please comment on this solution, as I have a hard time figuring out if this is a good or really bad approach. The obvious down side is of course that a user who finds out another users RUSI can execute the script on his/her behalf as long as he/she is logged in.
Thanks.
I'm currently building a website which fetches youtube videos and flickr images and lets users comment on them on the website. While having it's own commenting system, the website also has an option to login with youtube/flickr to comment on youtube or flickr with their usernames.
I'm doing this by opening a popup window (real popup, not a jquery kind of popup), closing the popup after they login and storing their tokens in a PHP $_SESSION. Question is, I have quite a lot of stuff going on with jQuery and I'd like to let them switch between commenting as a visitor to the site to commenting on Flickr/YouTube after they login without refresh.
Basically, I'd need a way to detect when the pop-up closes so I could then make a request to a PHP file which would tell me if the user has a token saved in the $_SESSION or not and hide the name and email boxes from the comment form as they would only need the input box.
Another way would be to trigger a setInterval() when they open the popup and check for the $_SESSION every 2/3 seconds for example, but I don't think that's the best way to go. Ideally I'd want something that works as soon as the user closes the popup.
More details:
I'm using http://swip.codylindley.com/popupWindowDemo.html to display the pop-ups
The callback script for both functions does a self.close() after storing the token in a $_SESSION
Users can be logged in with both Flickr and Youtube (but I don't think this matters anymore).
Difference between commenting as a visitor and Flickr/Youtube user is that you have three fields (name, email, message) as a visitor and just one otherwise (message)
I do a check when page loads, so if the user refreshes the page at this point, everything is ok, but I would like it if he didn't have to do that, or if at least it would refresh automatically.
Lastly, I'm good to go with other options, as long as the user doesn't have to leave the page, refresh himself to swap between visitor and logged in user. Using jQuery in the page so if it's a jQuery based solution, even better.
Sorry for the long post, couldn't find a way to make it shorter.
Thank you for the help guys!
EDIT
setInterval() with a function that calls a PHP script to check for the $_SESSION variable worked like a charm, not at all as bad on performance or user experience as I expected. Still, if anyone can think of a better solution I'm ready to accept it.
Thanks!
You could place in the pop-window HTML code:
<body onunload="window.opener.location.href = 'http://check.session.com/path/to/file.php'">