1. 程式人生 > >12、ABPZero系列教程之拼多多賣家工具 拼團提醒功能登錄拼多多實現

12、ABPZero系列教程之拼多多賣家工具 拼團提醒功能登錄拼多多實現

template trigge cancel except 系列教程 open() toa eat button

  上篇文章已經完成了整個拼多多拼團提醒功能,本篇繼續完成拼多多帳號登錄,拼多多帳號登錄的目的是為了獲取拼團商品的SKU和訂單號,便於商家備貨。

以下是拼多多官方的後臺登錄,要實現的功能並不是直接在這裏登錄,而是在項目通過發送數據包的方式去登錄,主要就是拿到登錄後的cookie或token。

註:做此功能需要準備拼多多賣家帳號,如果沒有,可以跳過本篇內容。

技術分享圖片

PddTool項目

添加CodeResponse.cs文件,代碼如下:

文件路徑:D:\abp version\aspnet-zero-3.4.0\aspnet-zero-3.4.0\src\PddTool\PddApi\Response\CodeResponse.cs

public class CodeResponse
    {
        /// <summary>
        /// 
        /// </summary>
        public bool result { get; set; }
        /// <summary>
        /// 
        /// </summary>
        public Data data { get; set; }
    }
    public class Data
    {
        /// <summary>
/// /// </summary> public string token { get; set; } /// <summary> /// /// </summary> public string image { get; set; } }

添加UserResponse.cs文件,代碼如下:

文件路徑:D:\abp version\aspnet-zero-3.4.0\aspnet-zero-3.4.0\src\PddTool\PddApi\Response\UserResponse.cs

/// <summary>
    /// 登錄返回
    /// </summary>
    public class UserResponse
    {
        /// <summary>
        /// 
        /// </summary>
        public bool authResult { get; set; }
        /// <summary>
        /// 
        /// </summary>
        public UserInfo userInfo { get; set; }
        /// <summary>
        /// 
        /// </summary>
        public string inMobileWhiteList { get; set; }
        /// <summary>
        /// 
        /// </summary>
        public string mobileVerification { get; set; }
    }
    public class UserInfo
    {
        /// <summary>
        /// 用戶id
        /// </summary>
        public int id { get; set; }
        /// <summary>
        /// 用戶名
        /// </summary>
        public string username { get; set; }
        /// <summary>
        /// 店鋪id
        /// </summary>
        public int mallId { get; set; }
        /// <summary>
        /// 
        /// </summary>
        public int passwordStatus { get; set; }
        /// <summary>
        /// 手機
        /// </summary>
        public string mobile { get; set; }
        /// <summary>
        /// 昵稱
        /// </summary>
        public string nickname { get; set; }
        /// <summary>
        /// 角色id列表
        /// </summary>
        public List<int> roleIdList { get; set; }
        /// <summary>
        /// 店鋪管理員
        /// </summary>
        public bool mallOwner { get; set; }
        /// <summary>
        /// 
        /// </summary>
        public List<string> roleNameList { get; set; }
        /// <summary>
        /// 
        /// </summary>
        public List<string> permissionList { get; set; }

        /// <summary>
        /// 登錄cookie
        /// </summary>
        public string Cookie { get; set; }
    }

添加RequestErrorResponse.cs文件,代碼如下:

文件路徑:D:\abp version\aspnet-zero-3.4.0\aspnet-zero-3.4.0\src\PddTool\PddApi\Response\RequestErrorResponse.cs

/// <summary>
    /// 請求錯誤返回
    /// </summary>
    public class RequestErrorResponse
    {
        /// <summary>
        /// 
        /// </summary>
        public string error_msg { get; set; }
        /// <summary>
        /// 
        /// </summary>
        public int error_code { get; set; }
    }

添加LoginRequest.cs文件,代碼如下:

文件路徑:D:\abp version\aspnet-zero-3.4.0\aspnet-zero-3.4.0\src\PddTool\PddApi\Request\LoginRequest.cs

/// <summary>
    /// 拼多多登錄
    /// </summary>
    public class LoginRequest
    {
        /// <summary>
        /// 用戶名
        /// </summary>
        public string Username { get; set; }

        /// <summary>
        /// 密碼
        /// </summary>
        public string Password { get; set; }

        /// <summary>
        /// 驗證碼
        /// </summary>
        public string Code { get; set; }

        /// <summary>
        /// 令牌
        /// </summary>
        public string Token { get; set; }
    }

修改MallTool.cs文件,末尾添加如下代碼:

文件路徑:D:\abp version\aspnet-zero-3.4.0\aspnet-zero-3.4.0\src\PddTool\MallTool.cs

/// <summary>
        /// 取驗證碼
        /// </summary>
        /// <returns></returns>
        public static CodeResponse GetCode()
        {
            string url = string.Format("http://mms.pinduoduo.com/captchaCode/getCaptchaCode?rd=" + Guid.NewGuid());
            var client = new RestClient(url);
            var request = new RestRequest(Method.GET);
            request.AddHeader("cache-control", "no-cache");
            request.AddHeader("referer", "http://mms.pinduoduo.com/Pdd.html");
            IRestResponse response = client.Execute(request);
            var code = JsonConvert.DeserializeObject<CodeResponse>(response.Content);
            return code;
        }

        /// <summary>
        /// 拼多多登錄
        /// </summary>
        /// <param name="data"></param>
        /// <returns></returns>
        public static UserResponse Login(LoginRequest data)
        {
            string url = "http://mms.pinduoduo.com/auth";
            var client = new RestClient(url);
            var request = new RestRequest(Method.POST);
            request.AddParameter("username", data.Username);
            request.AddParameter("password", data.Password);
            request.AddParameter("authCode", data.Code);
            request.AddParameter("verificationCode", "");
            request.AddParameter("token", data.Token);
            request.AddHeader("cache-control", "no-cache");
            IRestResponse response = client.Execute(request);
            if (response.Content.Contains("error_code"))
            {
                var error = JsonConvert.DeserializeObject<RequestErrorResponse>(response.Content);
                throw new UserFriendlyException(error.error_msg);
            }
            var c = response.Cookies.Single(a => a.Name.Equals("PASS_ID"));
            var cookie = c.Value;
            var user = JsonConvert.DeserializeObject<UserResponse>(response.Content);
            user.userInfo.Cookie = cookie;
            return user;
        }

到這裏就把拼多多後臺登錄封裝好了,就2個方法,一個獲取驗證碼、一個提交post數據登錄。

Application項目

修改IMallAppService.cs文件,添加2個方法,代碼如下:

文件路徑:D:\abp version\aspnet-zero-3.4.0\aspnet-zero-3.4.0\src\MyCompanyName.AbpZeroTemplate.Application\Pdd\MallApp\IMallAppService.cs

/// <summary>
        /// 取驗證碼
        /// </summary>
        /// <returns></returns>
        CodeOutput GetCode();

        /// <summary>
        /// 登錄
        /// </summary>
        /// <returns></returns>
        UserInfoOutput Login(LoginInput input);

添加CodeOutput.cs文件,代碼如下:

文件路徑:D:\abp version\aspnet-zero-3.4.0\aspnet-zero-3.4.0\src\MyCompanyName.AbpZeroTemplate.Application\Pdd\MallApp\Dto\CodeOutput.cs

public class CodeOutput
    {
        /// <summary>
        /// 圖片
        /// </summary>
        public string Image { get; set; }

        /// <summary>
        /// 令牌
        /// </summary>
        public string Token { get; set; }
    }

添加UserInfoOutput.cs文件,代碼如下:

文件路徑:D:\abp version\aspnet-zero-3.4.0\aspnet-zero-3.4.0\src\MyCompanyName.AbpZeroTemplate.Application\Pdd\MallApp\Dto\UserInfoOutput.cs

public class UserInfoOutput
    {
        /// <summary>
        /// 用戶名
        /// </summary>
        public string Username { get; set; }

        /// <summary>
        /// 店鋪id
        /// </summary>
        public int MallId { get; set; }

        /// <summary>
        /// 
        /// </summary>
        public string Cookie { get; set; }
    }

添加LoginInput.cs文件,代碼如下:

文件路徑:D:\abp version\aspnet-zero-3.4.0\aspnet-zero-3.4.0\src\MyCompanyName.AbpZeroTemplate.Application\Pdd\MallApp\Dto\LoginInput.cs

public class LoginInput
    {
        /// <summary>
        /// 用戶名
        /// </summary>
        public string Username { get; set; }

        /// <summary>
        /// 密碼
        /// </summary>
        public string Password { get; set; }

        /// <summary>
        /// 驗證碼
        /// </summary>
        public string Code { get; set; }

        /// <summary>
        /// 令牌
        /// </summary>
        public string Token { get; set; }
    }

修改MallAppService.cs文件,實現接口添加的2個方法,代碼如下:

文件路徑:D:\abp version\aspnet-zero-3.4.0\aspnet-zero-3.4.0\src\MyCompanyName.AbpZeroTemplate.Application\Pdd\MallApp\MallAppService.cs

 /// <summary>
        /// 獲取驗證碼
        /// </summary>
        /// <returns></returns>
        public CodeOutput GetCode()
        {
            var code = MallTool.GetCode();
            if (code.result == false)
            {
                throw new UserFriendlyException("驗證碼獲取失敗!");
            }
            return new CodeOutput()
            {
                Image = code.data.image,
                Token = code.data.token
            };
        }

        /// <summary>
        /// 登錄
        /// </summary>
        /// <returns></returns>
        public UserInfoOutput Login(LoginInput input)
        {
            var data = Mapper.Map<LoginRequest>(input);
            try
            {
                var key = string.Format("{0}_{1}_Mall", AbpSession.UserId, input.Username);
                var cache = _cacheManager.GetCache<string, UserResponse>(key);
                if (cache != null)
                {
                    cache.Clear();
                }
                var user = _cacheManager.GetCache<string, UserResponse>(key).Get("Login." + input.Username, () => MallTool.Login(data));
                //登錄成功清除對應店鋪開團商品的緩存
                key = string.Format("{0}_{1}_KaiTuan", AbpSession.UserId, user.userInfo.mallId);
                _cacheManager.GetCache<string, List<KaiTuan>>(key).Clear();

                return new UserInfoOutput()
                {
                    Cookie = user.userInfo.Cookie,
                    MallId = user.userInfo.mallId,
                    Username = input.Username
                };
            }
            catch (Exception ex)
            {
                throw new UserFriendlyException("登錄失敗:" + ex.Message);
            }

        }

打開CustomDtoMapper.cs文件,添加如下映射:

文件路徑:D:\abp version\aspnet-zero-3.4.0\aspnet-zero-3.4.0\src\MyCompanyName.AbpZeroTemplate.Application\CustomDtoMapper.cs

mapper.CreateMap<LoginInput, LoginRequest>();

生成解決方案,瀏覽器打開http://localhost:8088/swagger/ui/index,測試剛剛添加的2個api。

接下來頁面實現。

打開KaiTuanController.cs文件,添加如下代碼:

文件路徑:D:\abp version\aspnet-zero-3.4.0\aspnet-zero-3.4.0\src\MyCompanyName.AbpZeroTemplate.Web\Areas\Mpa\Controllers\Pdd\KaiTuanController.cs

public ActionResult LoginModal()
        {
            var code = _mallAppService.GetCode();
            ViewBag.code = code;
            return PartialView("_LoginModal");
        }

添加對應的視圖文件_LoginModal.cshtml,代碼如下:

文件路徑:D:\abp version\aspnet-zero-3.4.0\aspnet-zero-3.4.0\src\MyCompanyName.AbpZeroTemplate.Web\Areas\Mpa\Views\KaiTuan\_LoginModal.cshtml

@using MyCompanyName.AbpZeroTemplate.Pdd.MallApp.Dto
@using MyCompanyName.AbpZeroTemplate.Web.Areas.Mpa.Models.Common.Modals
@{
    var code = ViewBag.code as CodeOutput;
}
@Html.Partial("~/Areas/Mpa/Views/Common/Modals/_ModalHeader.cshtml", new ModalHeaderViewModel("登錄拼多多"))
<div class="modal-body">
    <form name="LoginForm" class="form-horizontal margin-bottom-40" role="form">
        <input id="token" type="hidden" name="token" value="@code.Token" />
        <div class="form-group form-md-line-input">
            <div class="col-md-6">
                <div class="input-icon">
                    <input type="text" class="form-control" name="username" placeholder="帳號名/手機號">
                    <div class="form-control-focus">
                    </div>
                    <i class="fa fa-user"></i>
                </div>
            </div>
        </div>
        <div class="form-group form-md-line-input">
            <div class="col-md-6">
                <div class="input-icon right">
                    <input type="password" class="form-control" name="password" placeholder="密碼">
                    <div class="form-control-focus">
                    </div>
                    <i class="fa fa-key"></i>
                </div>
                <div class="help-block">
                    with right aligned icon
                </div>
            </div>
        </div>
        <div class="form-group form-md-line-input">
            <div class="col-md-6">
                <div class="input-group">
                    <input type="text" class="form-control" name="code" placeholder="">
                    <div class="form-control-focus">
                    </div>
                    <div class="input-group-addon">
                        <img id="img" src="@code.Image" style="width: 113px; height: 30px;" />
                    </div>
                </div>
            </div>
        </div>
        <div class="form-group">
            <div class="col-md-offset-4 col-md-10">
                <button type="button" class="btn green save-button">登錄</button>
            </div>
        </div>
    </form>
</div>
@Html.Partial("~/Areas/Mpa/Views/Common/Modals/_ModalFooterWithCancel.cshtml")

添加視圖對應的JS文件,代碼如下:

文件路徑:D:\abp version\aspnet-zero-3.4.0\aspnet-zero-3.4.0\src\MyCompanyName.AbpZeroTemplate.Web\Areas\Mpa\Views\KaiTuan\_LoginModal.js

var _mallService = abp.services.app.mall;
(function ($) {
    app.modals.LoginModal = function () {

        var _$loginForm = null;

        var _modalManager;
        this.init = function (modalManager) {
            _modalManager = modalManager;
            //取出Form表單
            _$loginForm = _modalManager.getModal().find(‘form[name=LoginForm]‘);
        };

        this.save = function () {
            //驗證不通過返回
            if (!_$loginForm.valid()) {
                return;
            }
            //序列化參數
            var login = _$loginForm.serializeFormToObject();
            _modalManager.setBusy(true);
            _mallService.login(
                login
            ).done(function (data) {
                _modalManager.close();
                abp.event.trigger(‘app.loginModalSaved‘, { username: data.username });
            }).always(function () {
                _modalManager.setBusy(false);
            });
        };
    };
    function getCode() {
        _mallService.getCode().done(function (data) {
            $("#img").attr("src", data.image);
            $("#token").val(data.token);
        });
    }

    //getCode();

    $("#img").click(function () {
        getCode();
    });
})(jQuery);

打開文件Index.js,添加如下代碼:

文件路徑:D:\abp version\aspnet-zero-3.4.0\aspnet-zero-3.4.0\src\MyCompanyName.AbpZeroTemplate.Web\Areas\Mpa\Views\KaiTuan\Index.js

6行位置添加一個變量:

var username;//記錄登錄拼多多用戶名

26行位置添加如下代碼:

/**
         登錄模態框
         */
        var _loginModal = new app.ModalManager({
            viewUrl: abp.appPath + ‘Mpa/KaiTuan/LoginModal‘,
            scriptUrl: abp.appPath + ‘Areas/Mpa/Views/KaiTuan/_LoginModal.js‘,
            modalClass: ‘LoginModal‘
        });

178行位置添加如下代碼:

//登錄拼多多
        $("#LoginPddButton").click(function () {
            _loginModal.open();
        });

        abp.event.on(‘app.loginModalSaved‘, function (data) {
            console.info("成功", data);
            username = data.username;
            toastr["success"]("登錄拼多多成功", "提示");
        });

生成解決方案,瀏覽器登錄後臺測試。

技術分享圖片

技術分享圖片

返回總目錄

12、ABPZero系列教程之拼多多賣家工具 拼團提醒功能登錄拼多多實現