weixin_33704234 2015-06-11 09:37 采纳率: 0%
浏览 12

Node.js Ajax请求

I am running a node server that has no data on it. I want to push data up to the server and then take it down again on a button click.I've tried following other examples but I'm quite new to ajax requests and I want to understand the code that I'm writing this is what I have so far:

***script.js(Client file)***
$(document).ready(function() {
$.ajax({
    url: 'http://localhost:8080',
    dataType: "jsonp",
    data: '{"data": "TEST"}',
    type: 'POST',
    jsonpCallback: 'callback', 
    success: function (data) {
        var ret = jQuery.parseJSON(data);
        console.log(data)
        console.log('Success: ')
    },
    error: function (xhr, status, error) {
        console.log('Error: ' + error.message);

    },
});




$('#button').click(function(){

$.ajax({
    url: 'http://localhost:8080',
    dataType: "jsonp",

    type: 'GET',
    jsonpCallback: "callback", 
    success: function (data) {
        var ret = jQuery.parseJSON(data);
        console.log(data)
        console.log('Success: Kick Ass!')
    },
    error: function (xhr, status, error) {
        console.log('SOMETHING HAS GONE WRONG :(');

    },
});
});
});




    ***Index.js(Server File)***
var http = require('http');
var util = require('util')
http.createServer(function (req, res) {

    console.log('Request received: ');
    util.log(util.inspect(req)) // this line helps you inspect the request so you can see whether the data is in the url (GET) or the req body (POST)
    util.log('Request recieved: 
method: ' + req.method + '
url: ' + req.url) // this line logs just the method and url

    res.writeHead(200, { 'Content-Type': 'text/plain' });
    req.on('data', function (chunk) {
        console.log('GOT DATA!');
    });
    res.end('callback(\'{\"msg\": \"OK\"}\')');

}).listen(8080);
console.log('Server running on port 8080');

Please help. Thanks so much!

  • 写回答

1条回答 默认 最新

  • bug^君 2015-06-11 13:55
    关注

    I implemented a server in a way to serve your requests of showing the index html, saving the user on server memory, and sending the user (stored on the memory server) to the client.

    My index.js file looks like this:

    var http = require('http');
var url = require('url');
var querystring = require('querystring');
var fs = require('fs');

var server = http.createServer();

var userStoredInMemory = {};

// listening requests from clients
server.on('request', function (request, response) {
  var currentRoute = url.format(request.url);
  var currentMethod = request.method;
  var requestBody = '';

  switch (currentRoute) {
    // serving the html index to client
    case '/':
      fs.readFile(__dirname + '/index.html', function (err, data) {
        var headers = {
          'Content-Type': 'text/html'
        };

        response.writeHead(200, headers);
        response.end(data);
      });

    break;

    // handling requests from client with route /api/user
    case '/api/user':
      // if request is a POST, then the user is sending a user
      if (currentMethod === 'POST') {
        // reading the body of the request
        request.on('data', function (chunk) {
          requestBody += chunk.toString();
        });

        // once the body of the request was loaded
        request.on('end', function () {

          // saving the user sent on the request body
          userStoredInMemory = querystring.parse(requestBody);

          // responding to the user
          var headers = {
            'Content-Type': 'text/plain'
          };
          response.writeHead(200, headers);
          response.end('User was already stored.');
        });
      } 

      // if request is a GET, then the client is requesting
      // to see the user stored.
      else if (currentMethod === 'GET') {
        var headers = {
          'Content-Type': 'application/json'
        };

        response.writeHead(200, headers);
        response.end(JSON.stringify(userStoredInMemory));
      }
    break;
  }
});

server.listen(8080, function () {
  console.log('server up and running at 8080 port');
});

    And the index html file looks like this:

    <!DOCTYPE html>
<html>
<head>
  <title></title>
</head>
<body>
<h1>Hello World!</h1>

  <div>
    <h1>Sending User</h1>
    <form id="userForm">
      <label for="name">Name</label>
      <input id="name" name="name"/>
      <br/>

      <label for="age">Age</label>
      <input id="age" name="age"/>
      <br/>

      <input type="submit" value="Send"/>
    </form>
  </div>

  <br/>
  <br/>

  <div>
    <h2>Click the button below for getting User from server and showing it</h2>
    <button id="getUserButton">Get User</button>
  </div>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.js"></script>
  <script>
    $(document).ready(function () {

      $('#userForm').submit(function (e) {
        var user = {
          name: $('input[name=name]').val(),
          age: $('input[name=age]').val()
        };

        $.ajax({
          type: 'POST',
          url: 'http://localhost:8080/api/user',
          data: user
        })
        .done(function (data) {
          // clear form
          $('input[name=name]').val('');
          $('input[name=age]').val('')


          alert(data);
        });

        e.preventDefault();
      });

      $('#getUserButton').click(function (e) {
        $.ajax({
          type: 'GET',
          url: 'http://localhost:8080/api/user'
        })
        .done(function (data) {
          alert(JSON.stringify(data));
        });
      });
    });
  </script>
</body>
</html>

    But look how the code and complexity reduces when you use a framework when you are creating your HTTP Server, in this case Express.JS, first install express and body parser:

    so my index.js looked like:

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

var bodyParser = require('body-parser');

var userStoredInMemory = {};

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

app.get('/', function (req, res) {
  res.sendFile(__dirname + '/index.html');
});

app.get('/api/user', function (req, res) {
  res.json(userStoredInMemory);
});

app.post('/api/user', function (req, res) {
  userStoredInMemory = req.body;
  res.send('User was already stored from express.');
});

app.listen(8080, function () {
  console.log('server up and running at 8080 port');
});
    评论

报告相同问题？

悬赏问题

  • ¥15 素材场景中光线烘焙后灯光失效
  • ¥15 请教一下各位，为什么我这个没有实现模拟点击
  • ¥15 执行 virtuoso 命令后，界面没有，cadence 启动不起来
  • ¥50 comfyui下连接animatediff节点生成视频质量非常差的原因
  • ¥20 有关区间dp的问题求解
  • ¥15 多电路系统共用电源的串扰问题
  • ¥15 slam rangenet++配置
  • ¥15 有没有研究水声通信方面的帮我改俩matlab代码
  • ¥15 ubuntu子系统密码忘记
  • ¥15 保护模式-系统加载-段寄存器