使用腳本從網頁檢索數據，然后使用Node JS服務器訪問數據

Question

我有一個HTML文件index.html其中有一個本地腳本script.js在localhost:8080運行，該腳本使用Node.js NodeServer.js腳本。

我希望，每當我在輸入框中輸入數據時，都應該通過本地腳本來獲取數據，然后script.js會將其導出到NodeServer.js應用程序中，這將進一步在控制台上記錄數據。

我正在使用Chrome瀏覽器65.0.3325.181

這是我的index.html ：

 <!DOCTYPE html> <html> <head> <title>Website</title> <!-- My local script --> <script src='file:///F:/RahulVerma/NodeJS/LoginPage/script.js'></script> </head> <body> <input type='text' placeholder='Enter username' id='username'/><br/> <input type='password' placeholder='Enter password' id='password'/><hr/> <!-- getData() is present in local script --> <button onclick='getData();'>Submit</button> </body> </html>

這是我的script.js ：

 let getData = () => { let username = document.getElementById('username').value; let password = document.getElementById('password').value; module.exports = { username, password }; // exporting username and password to server running through node.js }

還有我的NodeServer.js ：

 const http = require('http'); // to create server const fs = require('fs'); // to read index.html const script = require('F:/RahulVerma/NodeJS/LoginPage/script'); // to fetch data from script.js // My Server let server = (request, response) => { fs.readFile('F:/RahulVerma/NodeJS/LoginPage/index.html', 'utf8', (error, result) => { if(error) { response.writeHead(404, {'Content-Type': 'text/plain'}); response.write(`Error: ${error}`); } else { response.writeHead(200, {'Content-Type': 'text/html'}); response.write(result); } response.end(); }); } // Creating server http.createServer(server).listen(8080); console.log(script.username, script.password); // logging data onto the console

當我在Node.js 9.3.0（ia32）和npm中鍵入節點NodeServer.js時， index.html開始在localhost:8080上運行，但是由於以下錯誤， script.js無法在瀏覽器中呈現： Not allowed to load local resource: file:///F:/RahulVerma/NodeJS/LoginPage/script.js

我究竟做錯了什么？

Answer 1

cors錯誤：一種機制，該機制使用其他HTTP標頭來讓用戶代理獲得訪問另一來源服務器上的選定資源的權限

// Create our server
var server;
server = http.createServer(function(req,res){
// Set CORS headers
response.setHeader("Access-Control-Allow-Origin", "*");
response.setHeader("Access-Control-Allow-Credentials", "true");
response.setHeader("Access-Control-Allow-Methods", "GET,HEAD,OPTIONS,POST,PUT");
response.setHeader("Access-Control-Allow-Headers", "Access-Control-Allow-Headers, Origin,Accept, X-Requested-With, Content-Type, Access-Control-Request-Method, Access-Control-Request-Headers");;
if ( req.method === 'OPTIONS' ) {
    res.writeHead(200);
    res.end();
    return;
}
});

進一步說明訪問堆棧溢出cors

最佳遮陽篷鏈接

使用腳本從網頁檢索數據，然后使用Node JS服務器訪問數據

問題描述

1 個解決方案

解決方案1
0 2018-05-21 11:53:03

使用腳本從網頁檢索數據，然后使用Node JS服務器訪問數據

問題描述

1 個解決方案

解決方案1 0 2018-05-21 11:53:03

解決方案1
0 2018-05-21 11:53:03