代码改变世界

在ASP.NET MVC5应用程序中快速接入QQ和新浪微博OAuth

2015-06-30 21:53  小白哥哥  阅读(5129)  评论(24)  编辑  收藏  举报

这篇文章演示如何在你的ASP.NET MVC5应用程序中支持用户使用腾讯QQ和新浪微博的open authentication。

起步

安装Visual studio 2013 higher或者Visual studio express 2013 for web就不再赘述了，点击这里下载。

创建应用程序

打开vs，在Template中选择C#->asp.net web application ，命名为OauthDemo,并点击OK

image

在弹出窗口中选择MVC template，并且选择“Change authentication”选择Indivdula user Accounts

image

使用NUGET更新OWIN中间件

在Project Explorer中右键点击项目，选择”Manage Nuget Packages”,左边栏中选择Updates，然后点击右边的Update all，如果你没有发现Update all,说明你现在的包都是最新的（又或者是你人在中国，说知道呢…)

image

同样，在package manager console中，你也可以通过键入Update-package命令来更新所有的包

image

此时，点击F5应该可以执行你的应用程序，因为我们还没有做任何开发工作。

启动SSL支持

在几乎所有的Oauth提供商都要求接入的应用程序支持SSL连接，所以你需要启动IIS-express中SSL的支持。

在Solution Explorer中，点击MvcAuth，在属性窗口中（如果你没有看见，需要从菜单栏的Views中打开它），选择SSL Enabled为True

image

复制ssl的url，打开项目属性页面，选择Web选项卡，将地址拷贝到Project URL中并保存。

image

 

然后再HomeController上添加RequireHttps标签

[RequireHttps]
public class HomeController : Controller
{
    public ActionResult Index()
    {
        return View();
    }

此时重新启动应用程序，可能会得到一个警告，选择Yes并安装提示的证书就好了。

申请腾讯QQ的Oauth

1. 打开网址http://connect.qq.com/，或者http://connect.qq.com/intro/login

2. 登陆你的QQ账号，并点击QQ登陆->申请加入

image

3. 打开页面中，创建页面，并根据要求填写信息

image

这里比较麻烦的是，腾讯需要验证你输入的网址是否是你自己所有的，所以你需要有一个自己的域名，这里不要尝试修改host的方法，腾讯是后台验证的，所以没有什么卵用。

 

4.在创建好以后，在管理中心页面，就可以看到你的App id和app key啦

image

申请新浪微博的Oauth

1. 打开网址http://open.weibo.com/，并登录你的微博账号。

2. 在“微链接”->”网站接入“中，点击”立即接入”

image

3.同样按照要求输入内容，新浪也要求验证你的域名所有权，所以折腾去吧。

4.创建完成后，在“我的应用”里就可以看到了，打开你创建的应用，在测试账号中输入自己的账号，因为没有认证的账号是不允许进行开发和测试的登陆的

image

5.在“借口管理”->“授权机制”中，输入回调地址“https://www.yourdomain.xx/sign-in”

image

6.最后在“网站信息”->“基本信息”中，可以查看到app id 和app secert：

image

 

快速接入

1. 在Package manager console中，键入以下两个命令添加对腾讯QQ和新浪微博的oauth provider

Install-Package Microsoft.Owin.Security.Sina

Install-Package Microsoft.Owin.Security.Tencent

结果如图所示：

image

2. 打开App_Start目录下的Startup.Auth.cs文件，在文件顶部添加以下命名空间：

using Microsoft.Owin.Security.Tencent;
using Microsoft.Owin.Security.Sina;

3. 在app.UseExternalSignInCookie(…的调用后，添加以下两行代码，从而添加应用程序对腾讯QQ和新浪微博oauth的支持：

app.UseTencentAuthentication("101224440", "***************************************");
app.UseSinaAuthentication("2522592830", "******************************************");

4. 现在不可以通过支持按下F5来测试结果，因为各个oauth提供商会验证和调用你在上一节中设置的域名是否正确，有两种方法可以做到这一点，第一就是直接将程序部署并且解析域名，这种方式明显不适合开发；第二种方法也是接下来要使用的方法，将程序部署在本地IIS并且修改host文件。

打开IIS，创建应用程序，指向当前项目的根目录

image

而后修改host文件，添加以下内容：

127.0.0.1            www.yourdomain.xx

最后，编译你的应用程序，浏览器打开https://www.yourdomain.xx,点击”Login“，就可以在右侧看到添加的两个oauth provider啦:

image

imageimage

image

资源地址&源码

https://www.nuget.org/packages/Microsoft.Owin.Security.Sina/

https://www.nuget.org/packages/Microsoft.Owin.Security.Tencent/

https://github.com/xiaoyaojian/OwinOAuthProvider