zoukankan      html  css  js  c++  java
  • angular中service封装$http做权限时拦截403等状态及获取验证码倒计时、跨域问题解决

    封装$http、做权限时拦截403等状态及获取验证码倒计时:

    1. 拦截接口返回状态
      var app = angular.module('app');
      
      app.factory('UserInterceptor', ["$q","$rootScope", "$location", function ($q, $rootScope, $location,$localStorage) {
        return {
          request:function(config){
              config.headers["Authorization"] = 'Bearer ' + localStorage['token'];
            var urlArray = config.url.split("/")
            if(urlArray.indexOf("api") > -1 && config.method == "GET"){
              if(config.url.indexOf("?") > -1){
                config.url = config.url+"&time="+new Date().getTime();
              }else{
                config.url = config.url+"?time="+new Date().getTime();
              }
            }
              return config;
          },
          responseError: function (response) {
            switch(response.status)
            {
              case 401:
                localStorage.clear();
                $location.path("/login");
                break;
              case 403:
                $location.path("/login");
                break;
            }
          }
        };
      }]);
      response.status为返回状态码
    2. 封装$http
      app.factory('ResourceGet',function($http,$q){
          var service = {}
          service.callBack = function(action,params){
              var url = ' http://10.0.10.201:8080/';
              var deferred = $q.defer();
              $http({
                  method: 'GET',
                  url: url+action,
                  params: params
              }).success(function(data){
                  deferred.resolve(data);
              })
              return deferred.promise;
          }
          return service
      });
      
      app.factory('ResourcePut', function ($http, $q) {
        var service = {}
        service.callBack = function ( action, params ) {
          var url = 'http://10.0.10.201:8080/'
            var deferred = $q.defer()
            $http({
              method: 'PUT',
              url: url + action,
              data: params,
              headers : {'Content-Type': 'application/json; charset=utf-8'}
            }).success(function (data) {
              deferred.resolve(data)
            })
          return deferred.promise
        }
        return service
      })
      
      app.factory('ResourcePost', function ($http, $q) {
        var service = {}
        service.callBack = function ( action, params ) {
          var url = 'http://10.0.10.201:8080/'
          var deferred = $q.defer()
          $http({
            method: 'POST',
            url: url + action,
            data: params,
            headers : {'Content-Type': 'application/json; charset=utf-8'}
          }).success(function (data) {
            deferred.resolve(data)
          })
          return deferred.promise
        }
        return service
      })
      
      app.factory('ResourceDelete', function ($http, $q) {
        var service = {}
        service.callBack = function (action, params) {
           var url = 'http://10.0.10.201:8080/'
           var deferred = $q.defer()
           $http({
               method: 'DELETE',
            //  headers : {'Content-Type': 'application/x-www-form-urlencoded'},
               url: url + action
           }).success(function (data) {
               deferred.resolve(data)
           })
           return deferred.promise
        }
       return service
      })
    3. 修改跨域问题
      app.config(['$httpProvider', function($httpProvider) {  
         $httpProvider.defaults.withCredentials = true;  
      }]);  
    4. 获取验证码倒计时
      app.service('WaitSecond',function(){
        var wait = 60;
        var t = this;
        this.waitTime = function(code){
          if(wait == 0){
            $("#"+code).html('获取验证码');
            $("#"+code).removeAttr("disabled");
            wait = 60
          }else{
            console.log(code);
            $("#"+code).html(function(){
              return wait + '秒'
            }).attr('disabled','true');
            wait--;
            setTimeout(function () {
              t.waitTime(code);
            }, 1000); 
          }
        }
      })

      html:

      <button id="code" ng-click="register.getCode('code')" class="ng-binding">获取验证码</button>

      controller:

       WaitSecond.waitTime(id);

       5.统一接口定义全局变量

    app.constant('apiImg','http://10.0.10.200:8080/SeeMeInterface/img/uploadImg')
  • 相关阅读:
    MySQL IO线程及相关参数调优
    mysql InnoDB index 主键采用聚簇索引,二级索引不采用聚簇索引
    Mysql怎么判断繁忙 checkpoint机制 innodb的主要参数
    遇见 TiDB
    TiDB 深度实践之旅--真实“踩坑”经历
    tidb使用坑记录
    MySQL mysql server与存储引擎
    DBProxy 读写分离使用说明
    DBProxy 项目全解
    Mysql 数据库意向锁意义
  • 原文地址:https://www.cnblogs.com/leiyangs/p/6923794.html
Copyright © 2011-2022 走看看