window.location.href 跳转页面,隐藏携带的参数
前言
问题:
在使用 ajax返回结果后,我们有一种需求:根据返回结果跳转到相应的页面,并且跳转过程中会携带一个或多个参数,传递至某个页面或者后台的某个方法,这个时候跳转页面后携带的参数就会直接暴露给用户,带来极大的安全隐患。
举例说明
如下一段方法,在执行完 /order/getOrder 该操作后,如果操作成功,跳转到/pay/checkout 后台封装的controller中,controller重新转发至指定的某个页面,此时跳转成功后,页面路径中直接将 orderId 、totalPrice直接暴露出来了,因为此时为get跳转。
function queryOrder(){
$.ajax({
type : "post",
url : '/order/getOrder',
data : {
orderId: orderId,
},
dataType : "json",
success : function(data) {
if (data.data == 1) {
window.location.href = "/pay/checkout?orderId="
+ orderId + '&payPrice=' + totalPrice;
} else {
return false;
}
}
});
}
那该如何成功跳转又能将参数隐藏呢,当然是想办法将方法以post方式提交,下面就是把路径和参数重新封装到一个form 表单里,文章来源:https://www.toymoban.com/news/detail-442958.html
function queryOrder(){
$.ajax({
type : "post",
url : '/order/getOrder',
data : {
orderId: orderId,
},
dataType : "json",
success : function(data) {
/**if (data.data == 1) {
window.location.href = "/pay/checkout?orderId="
+ orderId + '&payPrice=' + totalPrice;**/
//封装form表单
var form = $("<form>");
form.attr("style","display:none");
form.attr("target","");
form.attr("method","post");
//请求地址
form.attr("action","/pay/checkout");
//第一个参数 orderId
var input1 = $("<input>");
input1.attr("type","hidden");
input1.attr("name","orderId");
input1.attr("value",orderId);
//第二个参数 totalPrice
var input2 = $("<input>");
input2.attr("type","hidden");
input2.attr("name","payPrice");
input2.attr("value",totalPrice);
//...多个参数以此类推
$("body").append(form);
form.append(input1);
form.append(input2);
form.submit();
form.remove();
} else {
return false;
}
}
});
}
致此,参数完美的隐藏了,但是项目运行过程中,我们的写的js还是会暴露出去,通过分析js还是可以查看分析我们的路径和参数,因为js设计的时候就是明文执行。所以对于重要的js还是要通过特殊手段加密。
例如:
1、将重要的逻辑处理在后端进行,这个过程就比较繁琐
2、通过软件将js直接加密处理,比较常用的是 jshaman ,整个将js代码复制过去,加密后复制回来直接可以使用。
3、自己写个小脚本禁止 F12等按键查看源码等 页面禁用F12或禁用右键查看源码,其他方式还是有挺多的,可以根据实际情况使用,就不多做介绍了文章来源地址https://www.toymoban.com/news/detail-442958.html
到了这里,关于window.location.href 跳转页面,隐藏携带的参数的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!