seajs兼容ie8

场景:js等静态资源存储在七牛云服务器;使用seajs加载静态资源。

存在问题:IE8对ajax跨域做了限制,在服务端不对跨域请求单独处理的情况下,在seajs中ajax无法获取到远程js文件的内容。

解决:修改seajs-wrapper-debug文件,首先去七牛请求静态资源,如果请求失败,再由应用服务器加载静态资源。采用这种方式同时能够解决,七牛服务器因为欠费等其它问题down机的问题,保证静态资源请求的稳定性。

// Helpers
function xhr(url, callback) {
  //var r = global.ActiveXObject ?
  //    new global.ActiveXObject("Microsoft.XMLHTTP") :
  //    new global.XMLHttpRequest() ;

  //modified , 解决ie10跨域加载js问题。首先使用XMLHttpRequest,ActiveXObject是ie7之前版本
  var r = global.XMLHttpRequest ? new global.XMLHttpRequest() :
      new global.ActiveXObject("Microsoft.XMLHTTP") ;

  try{
    r.open("GET", url, true) ;
  }catch (e){
    return failoverxhr(url, callback) ;
  }

  r.onreadystatechange = function() {

    if (r.readyState === 4) {
      // Support local file
      if (r.status > 399 && r.status < 600) {
        failoverxhr(url, callback) ;
      }else {
        callback(r.responseText)
      }
    }
  }

  //发送请求结果
  var result = null ;
  try{
    result = r.send(null) ;
  }catch (e){
    return failoverxhr(url, callback) ;
  }

  return result ;
}

/**
 * 静态资源请求失败的处理
 */
function failoverxhr(url, callback){

  var r = global.XMLHttpRequest ? new global.XMLHttpRequest() :
      new global.ActiveXObject("Microsoft.XMLHTTP") ;

  url = getLocalAppUrl(url) ;

  console.log("use backup "+url);

  r.open("GET", url, true) ;

  r.onreadystatechange = function() {
    if (r.readyState === 4) {
      // Support local file
      if (r.status > 399 && r.status < 600) {
        seajs.emit("failover error", {
          uri: url ,
          status: r.status
        }) ;
      }else {
        callback(r.responseText)
      }
    }
  }

  return r.send(null) ;
}

/**
 * 由本项目中获取请求的url
 */
function getLocalAppUrl(resourceURL) {
  //获取静态资源的uri
  var urlReg = /\/resources.*/ ;
  var uri = urlReg.exec(resourceURL) ;
  //如果配置了项目的url,则有url中请求静态资源
  if(uri && window.resourceConfig && window.resourceConfig.path){
    uri = window.resourceConfig.path + uri ;
  }
  return uri ;
}

猜你喜欢

转载自lpyyn.iteye.com/blog/2275247