What is a good openid selector control? - asp.net-mvc

Now that idselector has been upgraded to RPXNow and you can't "just use" the selector code, what is a good replacement?
I want to implement OpenId on a new website that I am using, but the users are going to be just dumb when it comes to logging in unless I provide an easy way for them to.
As a reference, I will be using .Net Open Id for the background in an ASP.Net MVC web application.
EDIT
After some cheap thought, what about using the rpxlib?

Jarrett Vance made a "version" of open-selector that is much more developer/designer friendly.
This selector is different because it does not hide the markup details in javascript. Therefore, you can easily add new providers or rearrange the existing ones without digging into the javascript. The login form will still work for normal OpenID logins if javascript is disabled
The best of all, is that it comes with documentation, demo, and lots of images both cropped and as raw .pdn files (paint.net)
Jarrett Vance's openid-selector can be found here
(source: jvance.com)
PS: I would suggest reading this article before implementing RPX.

Another one to consider is http://code.google.com/p/openid-realselector/ (which is a rewrite/update of http://code.google.com/p/openid-selector/)

I have done an implementation with RPXLib and RPXNow, and it is really pretty straight forward.
I wanted to minimize the amount of work done in the OpenId format, and the RxpLib definately helped with that one.
RpxNow also has a nice feature of telling me new users, number of logins per day, etc...

I've made Open-selector, which you just add to your site and switches the regular OpenID box into a provider list and a username text input.
The code is pretty simple (in case you need extra customization) and there is an inline mode so it doesn't alter your original layout.

I was using that one, but then I found a few people using a different one which made me investigate, and I found this OpenID selector. There aren't any instructions per se other than the demo.html, but it shouldn't be too hard to figure out. Just include the css and js, then call the javascript function with the right parameter.
Edit about rpx: I chose to stay away from rpx because I didn't want to have a 'central point of failure,' and a site that isn't my own that users would authenticate to/through. It seems kind of counter-intuitive being that I'm using openid, but if you consider that the openid provider that the user is using as part of the user, then it kind of makes sense.

Related

Reverse engineering website : cannot find the form inputs in the post request

I need to interact with an external website I don't own. This external website requires credentials that I have. My goal is to add a user but the external website does not offer an external API. It looks like they are using Vaadin.
So to add a new user I need to manually fill in a form. Yet I have been searching for the route the "form" takes to post the input I give but could not find any.
Here is my issue : when I look at the HTML source code in browser I cannot see any form tag. The buttons have all the same id "button". When I fill in the form and look at the network tab in the developer tools, in the "parameters" section I cannot see the inputs I just gave although the POST request does appear. The cookies tab does not show the inputs either.
Consequently my questions are : why can't I find the inputs in the POST request and where can they be ?
Please note : this external website is a medical site so I prefer not share the url and they don't offer a mobile app, so there is no mobile API I could reverse engineer.
Any help appreciated :-)
Not stating the Vaadin version makes that a tad harder give an exact
answer, but at the core both the Vaadin 8 and 10+ behave the same way.
And the short answer to your question is: without another entry-point,
like an API, this can not simply be done using just some POST-Request.
Vaadin is not simply a html-form/request/response-html based framework;
it holds the scenegraph on the serverside in a session. All
communication is done via a single endpoint to the server and state
changes only are communicated back to the client.
For what you are after, your best bet is to use test automation
frameworks like selenium, geb, cypress, ...

URL structure for multilingual websites

I'm developing a SPA web app and it will support various languages. It is build with AngularJS and I am using angular-translate to provide i18n.
But I am struggling a little bit with how the URL structure should be. I do no plan on using either gTLDs nor ccTLDs, so that leaves me with three options.
Use query params: ?locale=en-us
Use url paths: /en-us/page
Store the chosen locale in localStorage or a cookie
The first option is a no-go according to Google's guidelines for web apps SEO. So that leaves me with the last two options.
I have a hard time deciding which is more beneficial, though I am inclined to believe that using url paths would probably be more crawler friendly.
P.S: Not sure if this is the best place to ask such a question either.
The second option is your safest bet as according to https://webmasters.stackexchange.com/questions/59652/what-happens-if-i-try-to-set-a-cookie-on-a-bot cookies are ignored. You can test this yourself by going to the Google Console and fetching your website.
As of now most crawlers ignore cookies and DO NOT execute JavaScript. This means that they usually just download the html and make their judgements from there.
Some developers get around the no javascript problem by pre-rendering parts of their content. I haven't done it personally but you might want to check out https://prerender.io/
Edit
As rolandjitsu mentioned google crawls and executes javascript content.
You should go with second option: provide the language tag (and, optionally, region subtags) in the URL path as first segment.
For the simple reason that it allows you, visitors, and bots to link to specific translations.

How do Google opening links in a new window without target attribute?

i wonder how google manages to open external links in a new window/tab without defining target="_blank".
For example in google plus, all external links open in a new window.
I think its some Javascript voodoo but the .js code is obfuscated so i cant really look into.
edit: oh and followup question: why?
Using a framework makes this easy. Just have JavaScript look for links marked rel="external", or another identifier that shows them to be an external link, and dynamically add target="blank". Here's an example using Prototype:
$$('a[rel="external"]').each(function(a) {
a.setAttribute('target', '_blank');
};
It's not beyond reasoning for them to add the target attribute by javascript before allowing the anchor link event to return true.
It's Javascript. You can say:
window.open('http://example.org', '_blank').focus();
But please, don't. Opening links in new windows is almost always the wrong thing to do. Seriously, good uses of this are vanishingly few. If users want a link opened in a new window, they are quite capable of doing that themselves.
Jakob Nielsen was telling people this twelve years ago. Others have taken up the cudgels. The W3C removed the target attribute from HTML 4 because it was such a bad idea. I honestly don't understand how this usage persists. Don't you find it incredibly annoying when a website does this to you? Why would you want to write a website which does this to someone else?
Which brings me to your followup question. Why did Google decide to do this? I have no answer to that, and i am completely and utterly baffled how one of the very biggest, brightest, web companies could make such an elementary mistake. But then, a lot of the Google Plus interface has very poor usability (as in, mostly worse than Facebook poor); i suspect there is an interesting story behind it. Was the project under-resourced, and thus built cheaply on top of a rapid development framework such as GWT? Was it built as a spare time project by a lone wolf with a blind spot for web architecture? Was it driven by strategy wonks who didn't care about getting the technology right? Mystery.

Display twitter feeds

For an event in a couple of weeks I'd like to make an web page/app which display tweets from a specific user, a specific hashtag and all #reply's at the first user in 3 boxes on the screen.
However I've never tried this. I want to use either .NET (C#) or HTML/CSS/JS since I'm proficient in those. Are there any libraries/API's I can use? Or is there an readily available freeware/open-source app I can use?
Have you seen TweetSharp?
Use Twitter's profile and search widgets. Profile for the first box, a search of the hash tag for the second box, and a search of to:username for the third box.
I actually just posted this as an answer to another question:
I just updated a plugin to work with the Twitter 1.1 API. Unfortunately, per Twitter's urging, you will have to perform the actual request from server-side code. However, you can pass the response to the plugin and it will take care of the rest. I don't know what framework you are running, but I have already added sample code for making the request in C#, and will be adding sample code for PHP, shortly.
The plugin makes a call to statuses/user_timeline, but you will likely want to look at statuses/filter or statuses/search, instead. All you will have to do is add your desired parameters (hashtag, replies, etc.) to the server-side code and it should work (with the addition of your security keys and tokens, of course).
Good luck! :)

Some questions about dotnetopenauth

I have a couple outstanding questions mainly reguarding twitter and facebook
In the FacebookGraph class there are properties such as Id,name,etc. I am wondering how do I add to this list? Like what happens if I want a users hometown? I tried to add a property called hometown but it always is null.
What should I store their id(1418) or the whole url(http://www.facebook.com/profile.php?id=1418) for lookup later in my db to grab their data and to see if they have an account with my site?
Is it actually good to use this id as it seems like it is common knowledge. Can't someone just find the profile id or whatever and do a fake request on my site?
how do you setup dotnetopenauth to deal with the case when a user goes to facebook and deletes access to my website. I know you can send a deauthorization code to your site and then delete their account but I don't know how to do that through dotnetopenauth
Twitter
Is it possible to do number 4 with twitter?
Ajax
Is it possible to make the openid stuff ajax? I don't see a sample anywhere in the dotnetopenauth samples.
I'm no pro at Facebook. But the FacebookGraph class is in the ApplicationBlock, which ships as source and is fully intended for you to customize or extend within your own application. Hopefully people more familiar with Facebook in particular, or the Facebook docs, can help you with those questions.
Since Facebook is not OpenID, what you store whether ID # or the whole URL, is less critical. People should not be able to just craft requests to log in as others because your site should be verifying signatures, etc. If you're using DotNetOpenAuth appropriately this is probably being done automatically for you. But without seeing your code it can't be said for sure.
Assume the id is common knowledge. It certainly isn't a long random number so anyone can guess it. The ID must be accompanied by a signature that verifies that Facebook sent the ID, just now, for you.
I suspect the deauthorization code isn't going to be relevant to DotNetOpenAuth -- that's probably just some URL that you respond to. But again, I haven't read the FB docs on this.
Here's the real answer I can give you. Yes, OpenID works with AJAX reasonably well. You can see some samples of this at nerddinner.com or a sample of a blog post comment system. The most complete AJAX demonstration for standard login may be in the web forms or MVC project templates available on the Visual Studio Gallery.

Resources