我们如何添加url参数？（EJS + 节点 + 快递）答案

【问题标题】：how do we add url parameters? (EJS + Node + Express)我们如何添加url参数？（EJS + 节点 + 快递）
【发布时间】：2015-08-11 13:09:03
【问题描述】：

我了解我们是如何解析快速路由中的 url 参数的，如示例中所示

How to get GET (query string) variables in Express.js on Node.js?

但是url参数首先来自哪里？

编辑：

显然，我可以使用 jquery 构建这样的查询（即$.get）。我可以将params 附加到这个查询对象。这很酷，但我仍然试图了解我们如何在呈现整个页面的查询中实现这一点。

一个例子：当我选择下面的 oldest 标签时，如何将?answertab=oldest 添加到 url，使其变为：

https://stackoverflow.com/questions/30516497/how-do-we-add-url-parameters-ejs-node-express?answertab=oldest#tab-top

【问题讨论】：

你的意思是如何在浏览器中添加请求参数或如何在节点中添加它以向其他服务器请求内容？它们几乎但不完全相同。浏览器增加了您要作为查询参数传递的数据的来源的复杂性。
@slebetman 用一个例子编辑了这个问题，我认为现在更清楚了。谢谢！
对于您询问的 SO 示例，答案很简单。完整的字符串只包含"?answertab=oldest"。换句话说，选项卡在源文件中看起来像这样：<a href="http://stackoverflow.com/questions/30516497/how-do-we-add-url-parameters-ejs-node-express?answertab=oldest#tab-top">oldest</a>。它真的没有什么特别的。只是一个字符串

标签： node.js express ejs

【解决方案1】：

您正在查看的字符串是表单值的序列化，或其他一些此类输入数据的方法。要了解这一点，请查看jQuery's built in .serialize() method。

您也可以手动构造该字符串，这也很简单。格式只是 ?var1=data1&var2=data2 等。如果你有一个 JSON 对象 {"name": "Tim", "age": 22} 那么你可以编写一个非常简单的函数来序列化这个对象：

function serializeObject(obj) {
    var str = "?";
    for(var i = 0; i < Object.keys(obj).length; i++) {
        key = Object.keys(obj)[i];
        if (i === Object.keys(obj).length - 1)
            str += encodeURIComponent(key) + "=" + encodeURIComponent(obj[key]);
        else
            str += encodeURIComponent(key) + "=" +  encodeURIComponent(obj[key]) + "&";
    }
    return str;
}

运行seralizeObject({"name": "Tim", "age": 22}) 将输出'?name=Tim&age=22'。这可用于生成链接或诸如此类的东西。

【讨论】：

【解决方案2】：

页面作者是这样写的。这就是它们“首先出现”的方式。 HTML 页面的作者决定（或由网站设计者告知）当用户单击其上的特定锚元素时将其带到何处。 如果他们希望用户 GET 带有一些查询参数（他们的服务器处理）的页面，他们只需将他们选择的查询字符串添加到链接的 href 属性。

看看你点击的最旧标签的href属性：

<a
 class="youarehere"
 href="/questions/30516497/how-do-we-add-url-parameters-ejs-node-express?answertab=oldest#tab-top"
 title="Answers in the order they were provided"
>
 oldest
</a>

当您单击它时，浏览器会将您带到href 属性/questions/30516497/how-do-we-add-url-parameters-ejs-node-express?answertab=oldest#tab-top 中相对于基本URL http://stackoverflow.com 的路径。所以地址栏变了。

stackoverflow.com 可能有自己的生成动态 HTML 页面的系统。他们的管理员和页面作者已经将他们的服务器配置为处理特定的查询参数，并采用他们自己的方法来确保他们页面上的链接指向他们希望的 URL（包括查询字符串）。

您需要向模板系统提供带有您选择的查询字符串的 URI（您可以使用 url.format 和 querystring.stringify 构建它们）以进行渲染。然后让您的快速路线处理它们并根据它们的值生成页面。

【讨论】：