javascript - 从 HTML 调用 Node 请求

标签 javascript html node.js

我是 Node 新手,正在练习使用 request 模块发出 http 请求。在我的脚本中,当用户按下按钮时,我希望其回调函数发出请求,从网页获取 HTML 并对其进行过滤以获取数据数组。

我的服务器请求本身可以工作,但是当我尝试将其与 HTML 结合时,似乎什么也没有发生。我的 HTML 看起来像这样:

<!DOCTYPE html>

<html>
<head>
  <link type="text/css" rel="stylesheet" href="test1.css" />
  <script src = "posts.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
</head>
<body>
  <p id = "myText">Hello, this is dog</p>
  <button onclick="getPosts()">Get Posts</button>
</body>
</html>

posts.js 是这样的:

var request = require('request');

function getPosts(){
    alert('Hello');
    var matches = [];
    request('https://www.reddit.com/r/TagPro/top/?sort=top&t=all', function (error, response, body) {
        // Handle errors properly.
        if (error || response.statusCode !== 200) {
            return res.writeHead(error ? 500 : response.statusCode);
        }

        // Accumulate the matches.
        var re = /tabindex="1" >(.+?)</g;
        var match;
        while (match = re.exec(body)) {
            matches[matches.length] = match[1];
        }
        $("#myText").text(JSON.stringify(matches));
    });
}

按下按钮时,会发出“Hello”警报,但此后似乎没有任何反应。这是连接 Node 与前端的正确方法还是我以错误的方式处理这个问题?

最佳答案

如果您在浏览器中运行它,那么问题是如果没有一些额外的工具,您就无法在浏览器中使用 Node 包。

如果您检查控制台,您可能会看到有关“require”未定义的信息。

您应该阅读如何使用 Webpack(或 Browserify)等工具使您的 Node 包在浏览器中可用。

如果您想保持简单,请不要将 Node requests 库用于客户端(浏览器)代码。只需阅读如何使用 jQuery 或 native XMLHttpRequest API 发出常规 Ajax 请求即可。

您只需将 request 调用替换为类似

$.get('http://someurl.com', function (data) {//stuff });

关于javascript - 从 HTML 调用 Node 请求,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35664944/

相关文章:

javascript - webpack + babel-loader 产生包含 `eval()` 的输出

node.js - 在 npm 测试阶段使用不同的数据库

javascript - Angular 如何实现 OAuth

html - href 覆盖 Angular.js 中的 ng-click

javascript - 用于创建 HTML 卡片的 JS jQuery 循环

python - 在python中解析文本文件

javascript - 在 setTimeout 之前和之后使用异步函数调用开 Jest

javascript - 加载时的 jQuery slideDown

javascript - 使用多个键排序meteor mongodb

javascript - 清除 AngularJS 动态表单中的字段