【问题标题】:Get URL value in static page in Express.js在 Express.js 的静态页面中获取 URL 值
【发布时间】:2018-03-07 06:01:20
【问题描述】:

我是节点和表达的初学者。在我当前的应用程序中,页面使用此代码显示:

var app = express();
app.use(serveStatic('static', {'index': ['index.html']}));

在静态文件夹中,有文件:

css、索引和js文件

监听3000端口工作正常。

但是如果我想访问这样的 URL 怎么办:

localhost:3000/name=someName

我想在静态文件夹中的 js 文件中使用此名称参数。
或建议任何其他路由方法来做到这一点?

【问题讨论】:

    标签: node.js express url-routing ejs


    【解决方案1】:

    如果您想在 .js 文件中获取查询参数,可以这样做。所以代码看起来像这样:

    服务器 (index.js)

    "use strict";
    
    var express = require("express");
    var serveStatic = require('serve-static');
    
    var app = express();
    app.use(serveStatic('static', {'index': ['index.html']}));
    
    app.listen(3000);
    
    console.log("Static express server started");
    

    HTML (/static/index.html)

    <!DOCTYPE html>
    <html>
    <head>
    <script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.js"></script>
    <script type="text/javascript" src="test.js"></script>
    </head>
        <body onLoad="readParameters()">
            <div>
                <h3 id="1" >Loading..</h3>
            </div>
         </body>
    </html>
    

    客户端 JavaScript (/static/test.js)

    var readParameters = function()
    {
        console.log('Getting parameters..');
        let params = (new URL(location)).searchParams;
        console.log('Query parameters: ', params.toString());
    
        var html = 'Query parameters: ';
        for (let p of params) {
          html += "<br/>" + p.toString();
        }
    
        $("#1").html(html);
    }
    

    然后你可以输入:

    http://localhost:3000/?test=value
    

    进入您的浏览器。

    你应该看到:

    Query parameters: test=value
    

    在索引页上。

    代码树应如下所示:

    root
    ¦   index.js
    ¦
    +---static
            index.html
            test.js
    

    3 个文件:

    /index.js (Node server side code)
    /static/index.html (HTML)
    /static/test.js (Test JavaScript file)
    

    【讨论】:

    • 哇!!很好的答案,有完整的解释。有效。但我得到输出 test=value 但我只想要值。然后我尝试localhost:3000/?value,我得到了 value=(一个额外的 = 符号)
    • 这应该很简单,params 对象是一个完全可查询的对象,你可以这样做:params.get('test') 来获取你的参数。您也可以通过 for (let p of params) { .. } 进行枚举。我会更新我的答案!
    • 以及为什么在 index.html 中定义 express 代码。我不明白这个
    • 对不起...我的错误,我不小心在 HTML 中放了一些服务器代码..我会更新答案!!
    • 是的,好的。 node 和 express 很棒,这就是我学习这些的原因。我的灵感来自像您这样随时准备提供帮助的程序员。干杯!!
    【解决方案2】:

    您可以像下面这样定义路线,

    router.get('/name=:id', function(req, res, next) {res.render('index', { title: req.params.id});});
    

    路由参数是命名的 URL 段,用于捕获在 URL 中的位置指定的值。我们可以使用“req.params”对象访问这些捕获的值。供参考https://expressjs.com/en/guide/routing.html

    【讨论】:

    • 在我的情况下如何使用它。我的索引文件位于静态文件夹中。我完全是初学者。
    • 在您的情况下,您需要将路由 url 定义为 '/name=:id'。然后您可以使用“req.params.id”访问您提供的任何参数。尝试访问这个 url 'localhost:3000/name=someName' 然后你会得到 'req.params.id' 的值为 'someName'
    猜你喜欢
    • 2011-07-09
    • 1970-01-01
    • 2012-11-05
    • 1970-01-01
    • 2020-08-03
    • 1970-01-01
    • 1970-01-01
    • 2014-01-19
    • 1970-01-01
    相关资源
    最近更新 更多