无法使用 GET 方法获取个人资料页面？

Question

我正在使用 Expressjs，我想在表单提交后在 URL 中显示用户输入，并将用户呈现到名称在 URL 中的个人资料页面，所以我使用 req.query 和 GET 方法。这是app.js

var express = require('express');
var morgan = require('morgan');
var path = require('path');
var bodyParser = require('body-parser');

var port = process.env.port || 1001;

var app = express();

app.engine('.ejs', require('ejs').__express);
app.set('view engine', 'ejs');

app.set('views', path.join(__dirname, 'views'));

app.use(bodyParser.urlencoded({ extended: true }));
app.use(bodyParser.json());

app.use(morgan('dev'));


app.get('/', (req, res) => res.render('user', { name: ''}));

app.put('/profile', function(req,res){
    var name = req.query.name;
    res.render('profile/'+ name , { name: name });
});

app.post('/', function(req, res){
    var name = req.query.name;
    res.render('profile/:name' , { name: name});    
});


app.listen(port, function(err){ if(err) throw err; console.log('Server running On Port : ' + port)});

这是表格 user.js

<form action="/profile/<%= name %>" method="GET">
    <input type="text" name="name">
    <button><a>Add</a></button>
</form>

这是个人资料页面。

<h1>Hello <%= name %></h1>
<button><a href="/">Home</a></button>

Answer 1

‍也许你可以试试下面的代码：

App.js

var express = require('express');
var morgan = require('morgan');
var path = require('path');
var bodyParser = require('body-parser');

var port = process.env.port || 3000;

var app = express();

app.engine('.ejs', require('ejs').__express);
app.set('view engine', 'ejs');

app.set('views', path.join(__dirname, 'views'));

app.use(bodyParser.urlencoded({ extended: true }));
app.use(bodyParser.json());

app.use(morgan('dev'));

app.get('/', (req, res) => res.render('user', { name: ''}));

app.post('/profile', function(req,res){
    var { name } = req.body;
    res.render('profile', { name });
});

app.listen(port, function(err){ if(err) throw err; console.log('Server running On Port : ' + port)});

‍ 现在您的 user.ejs 将类似于下面的代码：

user.ejs

<form action="/profile/<%= name %>" method="POST">
  <input type="text" name="name">
  <button><a>Add</a></button>
</form>

If you want your url looks like this: http://localhost:1001/profile?name=yourname then you only need to change method POST to GET, on your App.js and on your user.ejs form method.

更新： 如果你想让你的 url 看起来像这样：http://localhost:1001/profile/yourname，你可以用这个改变你的 /profile 路线代码如下：

app.get('/profile', function(req,res){
  const { name } = req.query;
  res.redirect('/profile/' + name.replace(/ /g, '-') );
});

app.get('/profile/:name', (req, res) => {
  const { name } = req.params;
  res.render('profile', { name : name.replace(/-/g, ' ') });
})

If you're using that route obove, make sure, in your user.ejs still using GET method.

希望对您有所帮助。

无法使用 GET 方法获取个人资料页面？

cannot get profile page using method GET?

javascript

url

node.js

query-string

express