javascript - 用 HTML 输入值替换部分 JSON 对象
问题描述
我最近测试了很多不同的语法来发送 ajax 发布请求,唯一真正有效的是我从 Postman 测试中得到的那个。我现在唯一的问题是 Postman 代码片段是“硬编码”的,并且具有我以前从未见过的奇怪的字符串语法。我想用来自 HTML 输入的值替换那个奇怪的字符串的一部分。有什么想法可以实现这一目标吗?
我有两个简单的 HTML 输入:
<input type="text" id="username" name="username" placeholder="Username" autofocus />
<input type="password" id="password" name="password" placeholder="Password" />
这是我从 Postman (JavaScript) 那里得到的部分:
var settings = {
"async": true,
"crossDomain": true,
"url": "...",
"method": "POST",
"headers": {
"Content-Type": "application/json",
"cache-control": "no-cache"
},
"processData": false,
"data": "{ \r\n\"Username\":\"username123\",\r\n\"Password\":\"password123\"\r\n}"
}
$.ajax(settings).done(function(response) {
console.log(response);
});
具体来说,我要问的部分是“数据”行。我希望能够从两个 HTML 输入中获取值,并分别用它们替换“username123”和“password123”。我尝试过使用数据字符串,例如删除 \r\n 和一些 " 和 \ ,但后来我从我试图调用的 API 中得到一个错误。我真的需要所有这些吗?要清楚,我想知道如何使用有效的语法将我的变量放入字符串中,而不是如何获取值,例如:
var usname = document.getElementById("username").val();
或者
var usname = $('#username').val();
这些 JSON 语法经过测试并收到错误:
"data": {"Username": "username123","Password": "password123"}
"data": "{"Username": "username123", "Password": "password123"}"
"data": {"Username": usname, "Password": pword}
"data": {"Username": $('username').val(), "Password": $('password').val()}
我觉得至少第一个应该可以工作,但它只是返回错误 500。作为参考,这是 Postman(工作)中的正文(数据)的样子:
{
"Username":"username123",
"Password":"password123"
}
可能是空格或其他问题吗?遗憾的是,我无法访问我正在调用的 API 的源代码。
解决方案
我建议使用FormData来包装您要发送的数据:
var formData = new FormData();
formData.append('Username', $("#username").val());
formData.append('Password', $("#password").val());
后来,你ajax post
这样称呼:
var settings = {
"async": true,
"crossDomain": true,
"url": "...",
"method": "POST",
"contentType": 'application/x-www-form-urlencoded',
"processData": false,
"data": formData
};
$.ajax(settings).done(function(response)
{
console.log(response);
});
如果您需要发送数据,JSON
那么您可以尝试下一个代码:
var data = {};
data.Username = $("#username").val();
data.Password = $("#password").val();
var settings = {
"async": true,
"crossDomain": true,
"url": "...",
"method": "POST",
"headers": {
"Content-Type": "application/json",
"cache-control": "no-cache"
},
"processData": false,
"data": JSON.stringify(data)
};
$.ajax(settings).done(function(response)
{
console.log(response);
});
推荐阅读
- sql - Postgres触发器:将旧记录写入新表
- jquery - 使用 jQuery 将输入类型文本替换为图像
- angular - 在 AppInitializer Angular 8 中需要 2 个承诺
- python - 如何在 Matplotlib 中使用两组颜色图?
- python - 特征选择中如何选择卡方阈值
- woocommerce - WooCommerce 包裹费率(循环 2 次)会产生成倍的费率成本
- node.js - node-imap 模块在收件箱中接收旧电子邮件
- javascript - 我想返回在 Javascript 中包含对象数组的对象的一部分
- gitlab - Gitlab CI, DIND
- spring-boot - 我的 Expo-App 与 React Native 一起使用什么 IP/端口?