Javascript 隐藏 URL 参数并读取它们
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/44666648/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Hide URL parameters and read them
提问by Timppa
Is there any method to hide URL parameters and then read the hidden parameters with code? For example I have this in my page: "example.com/transaction.html?price=10".
有没有什么方法可以隐藏URL参数，然后用代码读取隐藏的参数？例如，我的页面中有这个：“example.com/transaction.html?price=10”。
I have tried to encode with Base64, but it doesn't work as expected (encoding works, decoding not), so I want to hide either the price=10 or transaction.html?price=10.
我试图用 Base64 编码，但它没有按预期工作（编码有效，解码无效），所以我想隐藏 price=10 或 transaction.html?price=10。
I heard that AngularJS could hide parameters, but can it read "hidden" parameters or how does it work?
我听说 AngularJS 可以隐藏参数，但它可以读取“隐藏”参数或者它是如何工作的？
Thanks in advance!
提前致谢！
function getUrlVar() {
var result = {};
var location = window.location.href.split('#');
var parts = location[0].replace(/[?&]+([^=&]+)=([^&]*)/gi,function(m,key,value) {
result [key] = value;
});
return result;
}
回答by warl0ck
If you don't want to show the query parameters to the users in the address bar, you can easily achieve it using Javascript or jquery also need to switch to angular just for this.
如果您不想在地址栏中向用户显示查询参数，您可以使用 Javascript 或 jquery 轻松实现它，也需要为此切换到 angular。
What you can do is instead of using <a href = ....> </a>to fetch the data for that query which will redirect the user to the link say www.something.com?price=10instead of this what you can do is use a button as
您可以做的是，而不是使用<a href = ....> </a>来获取该查询的数据，这会将用户重定向到链接，www.something.com?price=10而不是说 您可以做的是使用按钮作为
<button type="button" onclick="fetch()">Fetch Data</button>
<button type="button" onclick="fetch()">Fetch Data</button>
and in your Javascript file you can make a GET or POSTrequest in this way these parameters you want to hide won't be shown, it's just these will be send to the server in background without changing your address.
并且在您的 Javascript 文件中，您可以通过GET or POST这种方式发出请求，这些您想要隐藏的参数不会显示，只是这些将在后台发送到服务器而不更改您的地址。
To make this GET Requestyou can do something like assuming you are sending the data from a text field :
为此，GET Request您可以假设您正在从文本字段发送数据：
$("#button").click(function() {
$.ajax({
type: "POST",
url: "www.something.com/",
data: {
price: $("#price")
},
success: function(data) {
// do something with the data you received}
});
})<input type=text id="price" />
<button id="button">Send</button>Now you got the data in background without showing the parameters to the user in their address bar.
现在您在后台获取数据，而无需在地址栏中向用户显示参数。
回答by JV Lobo
I've created a snippet for you, I think something like that is what you are asking for.
我为您创建了一个片段，我认为这就是您所要求的。
I made it quick, so it'd need lot of improvement, but at least you got something to begin with:
我做得很快，所以它需要很多改进，但至少你有一些东西可以开始：
let paramsRaw = "price=10";
let urlEncoded = "example.com/transaction.html?" + btoa(paramsRaw);
function getUrlVar() {
var location = urlEncoded; //window.location.href.split('#');
var paramsEncoded = urlEncoded.split('?')[1];
var paramsDecoded = atob(paramsEncoded);
var paramsDecodedValue = paramsDecoded.split('=')[1];
return parseInt(paramsDecodedValue);
}
let price = getUrlVar();
document.getElementById('result').innerHTML = price * 50;<span id="result"></span>Take a look to that and let me know.
看看那个，让我知道。
Cheers!
干杯!
回答by WhiteDragon
AngularJS passes the params by using $urlRouterProvider, AngularJS $urlRouterProvider
AngularJS 通过使用 $urlRouterProvider, AngularJS $urlRouterProvider传递参数
Your parameters is included like this:
您的参数包含如下：
$stateProvider.state('toState', {
url: /your-url
templateUrl:'wokka.html',
controller:'stateController',
params: {
'referer': 'some default',
'param2': 'some default',
'etc': 'some default'
}
});
and your parameter isn't included in link, you could run $state.go function with your parameters in the controller.
并且您的参数未包含在链接中，您可以使用控制器中的参数运行 $state.go 函数。
But i also think that AngularJS using Ajax mechanism so actually, it doesn't mean the page is reloaded, just url and js, html is loaded
但我也认为 AngularJS 使用 Ajax 机制，所以实际上，这并不意味着页面被重新加载，只是 url 和 js，html 被加载
It is just the angularJs way and maynot your need. I found the link can be useful: Code-project how to hide parameters in url
这只是 angularJs 的方式，可能不是您的需要。我发现这个链接很有用： Code-project how to hide parameters in url
回答by PR7
You can use input type hidden to transfer value from one page to another. For example
您可以使用隐藏的输入类型将值从一个页面转移到另一个页面。例如
<input type="hidden" name="price" value="10">
