如何在html和节点之间一起通信？

Question

Now the title may seem vague, but being a noob towards node, it's hard to even describe my problem properly. 现在标题似乎模糊不清，但由于是节点的菜鸟，很难正确地描述我的问题。

But I'll describe my question as best as i can. 但是我会尽我所能描述我的问题。

So i have four files: index.html , script1.js , script2.js . 所以我有四个文件： index.html ， script1.js ， script2.js 。

index.html: index.html的：

<!-- index.html -->
<html>
    <head>
    </head>
    <body>
        <script src="script1.js"> </script>
    </body>
</html>

script2.js is not included within the html, instead it's compiled with the node command node script2.js . html中不包含script2.js，而是使用节点命令node script2.js 。

Now lets say i compiled the index.html along with the script2.js (node script2.js in my terminal). 现在说我编译了index.html和script2.js （终端中的node script2.js ）。 From here, i want script2.js to send data to script1.js for it to display the data passed to the HTML. 从这里开始，我希望script2.js将数据发送到script1.js以使其显示传递到HTML的数据。

I think i have to use a server, but i want to try to avoid using it (if that makes sense). 我认为我必须使用服务器，但我想尝试避免使用它（如果这有意义）。 How can i do this "locally"? 我该如何“本地”执行此操作？

Thanks and I hope my explanation wasn't too confusing. 谢谢，我希望我的解释不要太混乱。 I'm looking foward to any of your answers! 我很期待您的回答！

Answer 1

I assume you have some function in script2.js that can be used by script1.js to populate the DOM? 我假设您在script2.js中有一些函数可以被script1.js用来填充DOM？

I think what you're looking for is to import script2.js into script1.js 我认为您正在寻找的是将script2.js导入script1.js

eg 例如

script1.js - script1.js

import * as script2 from 'script2.js' 
// or const script2 = require('script2.js')
// or import { getData } from 'script2.js'

const divtext = script2.getData(); 

var div = document.getElementById('divID');

div.innerHTML += 'Data from script2:' + divtext;

script2.js - script2.js

const getData = () => {
  return "This is some info for div"
};

export getData;

Answer 2

It is impossible to achieve what you described without a server. 没有服务器就无法实现您描述的内容。 You can run a server by running node script2.js if it contains code similar to this: 您可以通过运行node script2.js来运行服务器（如果该服务器包含类似于以下内容的代码）：

const express = require('express');
const app = express();
const server = require('http').createServer(app);
const path = require('path');


app.use(express.static(path.join(__dirname, 'public')));

server.listen(3000, () => {
  console.log('Server listening at port %d', 3000);  
});

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

app.get('/get-data', function(req, res) {
  // send data from server to script1.js
});

And then when you want to get data from script1.js you would do something like this (in script1.js ): 然后，当您想从script1.js获取数据时，可以执行以下操作（在script1.js ）：

fetch('http://localhost:3000/get-data')
  .then(res => { /* do something with data */ })
  .catch(err => { /* handle errors */ });

There are ways to achieve this without using express but this one seems easy enough. 有一些方法可以不使用express来实现，但是这似乎很容易。

如何在html和节点之间一起通信？

问题描述

2 个解决方案

解决方案1
0 2018-09-23 05:11:31

解决方案2
0 2018-09-23 05:27:12

如何在html和节点之间一起通信？

问题描述

2 个解决方案

解决方案1 0 2018-09-23 05:11:31

解决方案2 0 2018-09-23 05:27:12

解决方案1
0 2018-09-23 05:11:31

解决方案2
0 2018-09-23 05:27:12