摘要：技术细节对以上问题解决方案，我采用端对端懒加载不同平台的，分享逻辑统一由后端控制即页面里只需要引入一个脚本。总体引用方法放置获取分享信息的入参排除不需要那种分享。。。。。。
改造起点
github L6zt
项目前端与后端紧耦合,分享信息 放在jsp里,例如：
前端还要获取全局变量里的值,初始化分享
2.分享功能没有进行统一的合并，所以每个页面都需要重写分享逻辑，很low低效的很，而且不利于维护。
3.每次都需要 引入 钉钉 和 微信 分享的 sdk js 感觉浪费流量，而且 影响页面加载速度， 这个两个js都需要同时引入。
对以上问题解决方案，我采用： 端对端懒加载 不同平台的 sdk， 分享逻辑 统一由后端控制 即 页面里 只需要引入一个js脚本。
总体引用方法
// data-ajax 放置获取分享信息 ajax的入参 //data-exclud 排除 不需要 那种分享
。。。。。。部分代码
公共函数
var noop = function() {};
var hasOwnP = function(obj, prop) {
return Object.hasOwnProperty.call(obj, prop);
};
var toString = function(obj) {
return Object.prototype.toString.call(obj);
};
var isHardVar = function(obj) {
var result = toString(obj);
return result === "[object Object]" || result === "[object Array]";
}
var merge = function() {
var lg = arguments.length;
var result = {};
if (lg < 2) {
return arguments[0]
};
for (var i = 0; i < lg; i++) {
for (var key in arguments[i]) {
console.log(hasOwnP(arguments[i], key), key);
if (hasOwnP(arguments[i], key)) {
var value = arguments[i][key];
result[key] = value;
}
}
}
return result;
};
对异步处理 自己模拟的promise实现
var JcPromise = (function() {
function JcPromise(fn) {
fn = fn || noop;
var statusList = ["start", "pending", "succeed", "err"];
var cbStatus = [0, 1];
var status = statusList[0];
var data = null;
var err = null;
var that = this;
var successFn = [];
var errFn = [];
function resolve(d) {
data = d;
that._changeStatus(2);
};
function reject(e) {
err = e;
that._changeStatus(3);
};
this.getData = function() {
return data;
};
this.getErr = function() {
return err
};
this.getStatus = function() {
return status
};
this._changeStatus = function(idx) {
switch (status) {
case statusList[2]:
case statusList[3]:
{
return false
}
};
status = statusList[idx];
if (status === statusList[3]) {
setTimeout(function() {
that._triggerCatch();
}, 0)
}
if (status === statusList[2]) {
setTimeout(function() {
that._triggerThen();
}, 0)
}
};
this._pushThenCb = function(cb) {
successFn.push({
status: cbStatus[0],
cb: cb
});
if (status === statusList[2]) {
this._triggerThen();
}
};
this._pushCatchCb = function(cb) {
errFn.push({
status: cbStatus[0],
cb: cb
});
if (status === statusList[3]) {
this._triggerCatch();
}
};
this._triggerThen = function() {
successFn.map(function(item) {
if (item.status === cbStatus[0]) {
item.cb(data);
item.status = cbStatus[1];
}
})
};
this._triggerCatch = function() {
errFn.map(function(item) {
if (item.status === cbStatus[0]) {
item.cb(err);
item.status = cbStatus[1];
}
})
};
this._changeStatus(1);
this.uuid = uuid++;
try {
fn(resolve, reject);
} catch (e) {
reject(e)
}
return this
};
JcPromise.fn = JcPromise.prototype;
// 返回一个promise
JcPromise.fn.then = function(cb) {
var promiseR = null;
var promiseJ = null;
var result = null;
var that = this;
var fn = function() {
setTimeout(function() {
try {
var data = that.getData();
result = cb(data);
if (typeof result === "object" && result !== null && result.constructor === JcPromise) {
result.then(function(data) {
promiseR(data)
}).catch(function(e) {
promiseJ(e)
})
} else {
promiseR(result)
}
} catch (e) {
promiseJ(e)
}
}, 0);
};
this._pushThenCb(fn);
// 触发promise
return new JcPromise(function(r, j) {
promiseR = r;
promiseJ = j;
});
};
// 返回一个promise
JcPromise.fn.catch = function(cb) {
var promiseR = null;
var promiseJ = null;
var result = null;
var that = this;
var fn = function() {
setTimeout(function() {
try {
var data = that.getErr();
result = cb(data);
if (typeof result === "object" && result !== null && result.constructor === JcPromise) {
result.then(function(data) {
promiseR(data)
}).catch(function(e) {
promiseJ(e)
})
} else {
promiseR(result)
}
} catch (e) {
promiseJ(e)
}
}, 0)
};
this._pushCatchCb(fn);
// 触发promise
return new JcPromise(function(r, j) {
promiseR = r;
promiseJ = j;
});
};
return JcPromise
})();
懒加载加载js方法
function loadScript(src) {
return new JcPromise(function(r, j) {
var el = document.createElement("script");
el.onload = function() {
r(el);
};
el.onerror = function() {
j();
};
el.src = src;
document.body.appendChild(el);
});
};
判断 是钉
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/108880.html
摘要：深度学习理论在机器翻译和字幕生成上取得了巨大的成功。在语音识别和视频，特别是如果我们使用深度学习理论来捕捉多样的时标时，会很有用。深度学习理论可用于解决长期的依存问题，让一些状态持续任意长时间。 Yoshua Bengio，电脑科学家，毕业于麦吉尔大学，在MIT和AT&T贝尔实验室做过博士后研究员，自1993年之后就在蒙特利尔大学任教，与 Yann LeCun、 Geoffrey Hinto...
摘要：今日，在第届神经信息处理系统大会中，百度首席科学家吴恩达教授发表演讲利用深度学习开发人工智能应用的基本要点。为了方便读者学习和收藏，雷锋网特地把吴恩达教授的做为中文版。吴恩达先讲述了常见的深度学习模型，然后再着分析端到端学习的具体应用。 今日，在第 30 届神经信息处理系统大会（NIPS 2016）中，百度首席科学家吴恩达教授发表演讲：《利用深度学习开发人工智能应用的基本要点（Nuts an...
摘要：许多的研究人员都曾在这个领域仔细学习过，例如分析流量特性在缓存上的影响和开发流量缓存算法等。中学习的流量的缓存算法不久就展示了可以使用相对小的空间来实现用于业务的高字节比特率。 前言 最近几年，端对端网络在急速的上升。P2P互联通信在ISPs（Internet service Provider）上产生了重大的积极作用，因为它占用了一半以上的流量。尽管提出了许多方案去管理P2P流量，在部...
摘要：企业在选择云系统时，尤其如此。云系统中的每个因素都与公司成长模式有关。成本蠕变成本蠕变或许是最普遍也是最容易被负责人忽略的，对云系统的产生的影响也是更为负面的。如果你选择的云服务组合是正确的，云系统的扩张就应该是顺其自然的。 一、在选择过程中忽略重要的云属性企业在购买整合系统时要面对一系列的挑战性，除了要理解公司行为方式和原因以外，还需要有考虑到其他因素。如果忽略了某个流程或要求，那么在这个...
摘要：目前，阿里云和官方公司展开了产品合作，联合推出了阿里云。介绍阿里云搭载了版本的，提供安全监控告警报告图分析和机器学习六大扩展组件，无需额外安装插件，就能与无缝对接。 摘要： ELK是日志分析领域较为流行的技术选择，不少阿里云用户选择在ECS上搭建开源Elasticsearch。与自建开源Elastisearch相比，阿里云Elasticsearch做了性能优化，支持弹性扩容，并搭载了商...
阅读 2752·2023-04-26 01:52
阅读 3335·2021-09-04 16:40
阅读 3527·2021-08-31 09:41
阅读 1576·2021-08-09 13:41
阅读 308·2019-08-30 15:54
阅读 2764·2019-08-30 11:22
阅读 1430·2019-08-30 10:52
阅读 830·2019-08-29 13:24
