将 JSON 对象从客户端 JavaScript 传递到 Node JS

2023-12-09

我有一个网页,它根据用户输入创建 JSON 对象。然后我想以某种方式允许用户将此 JSON 对象提交到 NodeJS 脚本以进行处理/插入到 MySQL 数据库中。然而,我真的不知道如何做这样的事情——我能想到的最好的办法就是某种形式的 POST,但我不知道从哪里开始。

因为我不知道这样的方法会被描述为什么,所以我在网上找到任何教程或其他资源都没有取得多大成功。

有人可以建议一些与此类内容相关的文章或文档吗?或者,至少告诉我要搜索什么?谢谢。

编辑:这是我目前正在尝试工作的代码。我只是想将 POST 数据类型从字符串转换为 JSON。

服务器端:

var express = require('express');
var fs = require('fs');
var app = express();

app.use(express.bodyParser());

app.get('/', function(req, res){
    console.log('GET /')
    //var html = '<html><body><form method="post" action="http://localhost:3000">Name: <input type="text" name="name" /><input type="submit" value="Submit" /></form></body>';
    var html = fs.readFileSync('index.html');
    res.writeHead(200, {'Content-Type': 'text/html'});
    res.end(html);
});

app.post('/', function(req, res){
    console.log('POST /');
    console.dir(req.body);
    res.writeHead(200, {'Content-Type': 'text/html'});
    res.end('thanks');
});

port = 8080;
app.listen(port);
console.log('Listening at http://localhost:' + port)

客户端:

<html>
<body>
    <form method="post" action="http://localhost:8080">
        Name: <input type="text" name="name" />
        <input type="submit" value="Submit" />
    </form>

    <script type="text/JavaScript">
        console.log('begin');
        var http = new XMLHttpRequest();
        var params = "text=stuff";
        http.open("POST", "http://localhost:8080", true);

        http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        //http.setRequestHeader("Content-length", params.length);
        //http.setRequestHeader("Connection", "close");

        http.onreadystatechange = function() {
            console.log('onreadystatechange');
            if (http.readyState == 4 && http.status == 200) {
                alert(http.responseText);
            }
            else {
                console.log('readyState=' + http.readyState + ', status: ' + http.status);
            }
        }

        console.log('sending...')
        http.send(params);
        console.log('end');

    </script>

</body>
</html>

这是一个非常基本的示例,使用 jQuery 执行 post 请求和一个 Express 应用程序。我认为这应该是一个不错的起点。

// client side, passing data to the server
$.post("/foo/", { data : { foo : "bar" } }, function(temp) {
    // temp === "I am done";    
});

// serverside app.js

var express = require("express");

var app = express();

// will parse incoming JSON data and convert it into an object literal for you
app.use(express.json());
app.use(express.urlencoded());

app.post("/foo/", function(req, res) {
    // each key in req.body will match the keys in the data object that you passed in
    var myObject = req.body.data;
    // myObject.foo === "bar"
    res.send("I am done");
});

EDIT:JSON.stringify() 和 JSON.parse() 将序列化/反序列化 JSON。 (jQuery 使这变得更容易,但如果你想使用纯 JavaScript)

改成var params = "text=" + JSON.stringify({ foo : "bar" });

and

console.dir(JSON.parse(req.body.text));

它在我本地对我有用。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

将 JSON 对象从客户端 JavaScript 传递到 Node JS 的相关文章

  • Plesk Windows 部署 Node.js

    我创建了一个以 Node js 作为后端的 Angular 项目 这是服务器文件结构 Home directory httpdocs node hm dist browser folder server folder server js p
  • jquery 验证错误位置

    这看起来很简单 但我无法弄清楚 我正在使用 jquery 验证插件 我验证所有文件 但我想要的是在输入文本行中显示验证消息警报 例如在电子邮件输入中 请填写电子邮件地址 但现在它出现在所有字段下 在我的html中
  • Jquery从下拉列表中获取所选值的id

    我有一个下拉列表 可以从数据库获取值 如下所示 get getJobs function jobs seljobs jobs var i 0 jobs forEach function n alert job id n id 32 67 4
  • 使用 moment.js 检查输入日期是否为星期一

    好吧 我想检查日期是否是星期一 例如 var myDate new Date moment myDate DD MM YYYY dayIs monday 在我的国家 一周的第一天是星期一 所以 我真的想检查输入日期是否是一周的开始 我尝试使
  • 如何使用canvas.toDataURL()将画布保存为图像?

    我目前正在构建一个 HTML5 Web 应用程序 Phonegap 本机应用程序 我似乎不知道如何将画布保存为图像canvas toDataURL 有人可以帮我吗 这是代码 有什么问题吗 我的画布被命名为 canvasSignature J
  • jq中如何分组?

    这是 json 文档 name bucket1 clusterName cluster1 name bucket2 clusterName cluster1 name bucket3 clusterName cluster2 name bu
  • 在闪亮的数据表中为每个单元格显示工具提示或弹出窗口?

    有没有什么方法可以为 r闪亮数据表中的每个单元格获取工具提示 有很多方法可以获取悬停行或列 但我找不到一种方法来获取行和列索引并为每个单元格显示不同的悬停工具提示 任何人都可以修改以下代码吗 library shiny library DT
  • 如何检查请求是否通过 Express 中的 https 发送

    我想强制某些路线始终在我的 Express 应用程序中使用安全连接 我如何检查以确保它使用 https 我在 heroku 上使用搭载 ssl 进行部署 我也在 Heroku 上部署 当他们使用 nginx 进行反向代理时 他们添加了一堆标
  • 通过 node-http-proxy 保留基于 cookie 的会话

    我有一个简单的基于 Express 的 Node js Web 服务器 用于开发 JavaScript 应用程序 我将服务器设置为使用 node http proxy 来代理应用程序向在不同域和端口上运行的 Jetty 服务器发出的 API
  • 如果链接包含特定文本,jQuery 将类添加到 href

    我的网站上的列表中有一些动态填充的链接 这些链接链接到文件 是否可以使用 jQuery 查看文件名是否以 pdf 结尾 并在 href 或类似的链接文本以 mp3 结尾时添加一个类 例如 我的列表中有以下链接 文件1 pdf 歌曲1 mp3
  • Cloudfoundry:如何组合两个运行时

    cloundfoundry 有没有办法结合两个运行时环境 我正在将 NodeJS 应用程序部署到 IBM Bluemix 现在 我还希望能够执行独立的 jar 文件 但应用程序失败 APP 0 bin sh 1 java not found
  • 使用 JS 合并具有相同值的相邻 HTML 表格单元格

    我已经为此苦苦挣扎了一段时间 我有一个根据一些 JSON 数据自动生成的表 该数据可能会有所不同 我想合并第一列中具有相同值的相邻单元格 例如此表中的 鱼 和 鸟 table tr td fish td td salmon td tr tr
  • Twitter 嵌入时间轴小部件

    我继续下载http platform twitter com widgets js http platform twitter com widgets js And the http platform twitter com embed t
  • Chartjs刻度标签位置

    尝试让 Y 轴刻度标签看起来像image https i stack imgur com XgoxX png 位于秤顶部且不旋转 缩放选项当前如下所示 scales yAxes id temp scaleLabel display true
  • Select2 下拉列表动态添加、删除和刷新项目

    这让我发疯 为什么 Select2 不能在其页面上实现清晰的方法或示例如何在 Select2 上进行简单的 CRUD 操作 我有一个 select2 从 ajax 调用获取数据
  • 如何将函数内的捕获错误传递给父级

    我有这几行代码示例 想知道下面的逻辑到底如何 try var response child console log why here catch err console log should show this err function c
  • 如何在 Google 地图 V3 中创建编号地图标记?

    我正在制作一张上面有多个标记的地图 这些标记使用自定义图标 但我还想在顶部添加数字 我已经了解了如何使用旧版本的 API 来实现这一点 我怎样才能在V3中做到这一点 注意 当您将鼠标悬停在标记上时 标题 属性会创建一个工具提示 但我希望即使
  • 如何在 javascript 正则表达式中匹配平衡分隔符?

    我原以为这个问题是不可能的 据我所知 Javascript 的正则表达式既没有递归插值 也没有漂亮的 NET 平衡组功能 但问题就在那里 如问题 12 所示正则表达式 alf nu http regex alf nu 匹配平衡对 lt an
  • 从 Twitter API 2.0 获取 user.fields 时出现问题

    我想从 Twitter API 2 0 端点加载推文 并尝试获取标准字段 作者 文本 和一些扩展字段 尤其是 用户 字段 端点和参数的定义工作没有错误 在生成的 json 中 我只找到标准字段 但没有找到所需的 user fields 用户
  • 在 GWT 中,在任何主机页标记上添加事件处理程序

    我想为任何标签添加 MouseOver 事件处理程序 举个例子 我想为旧版 HTML 页面中的每个锚点页面添加事件处理程序 继GWT指南 http code google com webtoolkit doc 1 6 DevGuideUse

随机推荐

  • 将多维数组转换为对象

    我有一个最多包含 32 32 个条目的二维数组 我想将它从这样的东西转换 null null null null null null null null null null null null null null null null pla
  • Groovy 正则匹配引号之间的所有内容

    我有这个正则表达式 regex 所以我正在寻找引号之间的所有文本 现在我有以下字符串 options a 2 s 10 Print Type s 8 New Book s 8 Template s 9 See Notes 不管怎样做 reg
  • 将产品自定义字段保存为 WooCommerce 管理员手动订单的自定义订单项目元数据

    Using 将自定义产品元数据传递到 Woocommerce 3 中的订单回答代码 从后端手动创建订单时 从后端手动添加产品时是否可以保存和显示自定义元数据 这是我的代码 稍作改动 Admin products Display custom
  • 在 Acumatica 中,您可以使用未绑定的 DAC 获得图表/页面吗?

    是否可以让图表和页面使用完全未绑定的 DAC 当前在 4 20 中尝试此操作时 我收到以下错误消息 Incorrect syntax near the keyword FROM Description An unhandled except
  • ListView 未取消选择

    我正在使用 ListView 开发 Xamarin Forms 项目 ListView 的 XAML 是
  • R:用先前的值填充缺失值[重复]

    这个问题在这里已经有答案了 我有一个如下所示的数据框 d lt data frame county c Abilene rep NA 5 Cook rep NA 4 Blah NA Allegheny rep NA 3 county 1 A
  • 如何修复 Visual Studio 中的“找不到类型或命名空间名称”错误?

    我得到一个 找不到类型或命名空间名称 VS2010 中的 C WPF 应用程序出现错误 这部分代码编译得很好 但突然我收到了这个错误 我尝试删除项目参考和using声明 关闭VS2010并重新启动 但我仍然有这个问题 任何想法为什么会发生这
  • 使用 AVAudioRecorder 录制 AVAudioPlayer 输出

    在我的应用程序中 用户通过按下按钮来播放声音 有多个按钮可以同时播放 声音是使用 AVAudioPlayer 实例播放的 我想使用 AVAudioRecorder 记录这些实例的输出 我已经完成所有设置并创建了一个文件并进行录制 但是当我播
  • Matplotlib:子图中的插图

    我必须做几个子图 每个子图同时有一个插图custom相对于子图的位置 原则上可以通过axes grid1如中给出的this然而 例如 位置参数loc in inset axes or zoomed inset axes对于我的目的来说不够具
  • AlertDialog 上的 AutoCompleteTextView 实现

    我在 OnClickListener 方法中实现了 AutoCompleteTextView 但是 一旦单击 AutoCompleteTextView 我就看不到下拉文本 并且键盘仍然出现 我喜欢的是出现下拉文本 而键盘应该是不可见的 可能
  • lucene 短语查询不起作用

    我正在尝试使用 Lucene 2 9 4 编写一个简单的程序 它搜索短语查询 但我得到 0 次点击 public class HelloLucene public static void main String args throws IO
  • Powershell正则表达式用于两个特殊字符之间的字符串

    文件名如下 inpFiledev abc XYZ bak 我只需要变量中的 XYZ 即可与其他文件名进行比较 我试过下面 String findev regex match inpFiledev Value Write Host finde
  • Rails gem 将一个段落分成一系列句子

    我试图将一个段落分成一系列句子 使每个句子组保持在 N 个字符以下 如果单个句子的长度超过 N 则应将其分成多个块 并以标点符号或空格作为分隔符 例如 如果 N 50 则以下字符串 Lorem ipsum consectetur elit
  • 从相机胶卷图像创建视频 - iOS sdk

    我使用以下代码从图像创建视频 当我从从网络下载的相机胶卷或屏幕截图中选择图像时 此代码工作正常 但从相机拍摄的所选图像显示在电影中放大 我不知道相机的图像有什么问题 谁能帮我解决这个问题 IBAction createV id sender
  • 如何修复以下 Django 错误:“类型:IOError”“值:[Errno 13] 权限被拒绝”

    我正在遵循 Django 教程 在该教程中 一旦图像保存在管理中 您就需要构建一些图像缩略图 我还使用 Python 的 tempfile 模块来保存临时文件名 但是我不断遇到以下错误 Type IOError Value Errno 13
  • 为什么三元运算符不支持块?

    为什么三元运算符没有块 换句话说 为什么下面的代码不起作用并报告错误 braces int main int i 1 i 1 printf Hello n printf World n return 0 EDIT 也许这个问题被误解了 问题
  • Android 矢量绘图应用程序:srcCompat 不显示图像

    我正在使用支持库在 android kitkat 上显示矢量图像 当我在模拟器上测试我的应用程序时 我没有看到任何这些图像 我为 android lollipop 及以上做了一个单独的布局 它工作得很好 我想因为我正在使用src属性而不是s
  • 当前上下文中不存在名称 gridview1

    我是 C 新手 只需遵循 YouTube 简单示例并尝试简单地连接到 SQL 数据库 但GridView1给我一个错误 这是我的 WebForm1 aspx cs using System Linq using System Web usi
  • 将 count 作为标签添加到 geom_count 中的点

    我使用 geom count 将重叠点可视化为大小组 但我还想将实际计数作为标签添加到绘制的点上 如下所示 However to achieve this I had to create a new data frame containin
  • 将 JSON 对象从客户端 JavaScript 传递到 Node JS

    我有一个网页 它根据用户输入创建 JSON 对象 然后我想以某种方式允许用户将此 JSON 对象提交到 NodeJS 脚本以进行处理 插入到 MySQL 数据库中 然而 我真的不知道如何做这样的事情 我能想到的最好的办法就是某种形式的 PO