个人中心
gpt4 book ai didi

javascript - 当我尝试通过连接到//localhost :3000, 来显示 html 页面时，显示错误，错误已作为片段上传

转载 作者：行者123 更新时间：2023-11-28 05:57:27 24 4
gpt4 key购买 nike

这是 mong.js 文件，其中包含连接到 mongo 服务器执行 get、put、post 操作的代码

var express = require('express');
var app = express();
var mongoose = require('mongoose');
var bodyParser = require('body-parser');
app.use(bodyParser.json());

mongoose.connect("mongodb://localhost/test");

var todoschema = new mongoose.Schema ({
 name : {type: String, required: true}
 });

var todomodel = mongoose.model('todolist',todoschema);

app.get('/',function(req,res){

    res.sendFile('C:\Users\Rohit\Desktop\New folder\todo.html');  
})

app.get('/todolist', function (req, res){
    todomodel.find(function(err,tasks){
      res.json(tasks);
     });
});

app.post('/todolist', function (req, res) {
  
  todomodel.insert(req.body, function(err, task) {
    res.json(task);
  });
});

app.delete('/todolist/:id', function (req, res) {
  
 todomodel.remove(req.params.id, function (err, task) {
    res.json(task);
  });
});

app.get('/todolist/:id', function (req, res) {
  
  todomodel.findById(req.params.id, function (err, task) {
    res.json(task);
  });
});

app.put('/todolist/:id', function (req, res) {
  
  todomodel.findAndModify({
     query: req.params.id,
     update: {$set: {name: req.body.name}},
     new: true}, function (err, task) {
      
      res.json(task);
    }
  );
});

app.listen(3000);
console.log("Server running on port 3000");

这是todo.html文件，todo列表页面看起来像这样

<!DOCTYPE html>
<html ng-app="App">
<head>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.12/angular.min.js"></script>
<script src="frontend.js"></script>

<style>
#list   
{ margin-left:320px;
  font-size: 40px;
  font-family:verdana;
}
button     
{ color:yellow;background-color:red;text-align:center;cursor:pointer;
  -webkit-transition-duration: 0.4s;
  transition-duration: 0.4s;
  font-size:40px;
  padding: 14px 32px;
}
button:hover
{ background-color:peachpuff;
  color:tomato;
}
</style>
</head>

<body style="background-color:cyan;">

<div ng-controller="Ctrl">

<h1 style="text-align:center;font-family:verdana;">To-Do LiSt</h1>

<div style="margin-left:300px">
<input type="text" ng-model="task.name" style="background-color:black;color:white;font-size:40px;width:40%">
<button ng-click="addtask()">Add</button>&nbsp;
<button ng-click="updatetask()">Update</button>&nbsp;<button ng-click="clearfield()">Clear</button>
</div>

<ul>
<li id="list" ng-repeat="task in todolist">
{{task.name}}
<button ng-click="deletetask(task._id)">Delete</button>&nbsp;&nbsp;<button ng-click="edittask(task._id)">Edit</button>
</tr>
</table>

</div>


</body>
</html>

这是 frontend.js 文件，其中包含 Angular js 部分以及我的待办事项列表页面的工作函数

var App = angular.module('App',[]);
App.controller('Ctrl',['$scope','$http',function($scope,$http) {
         
    var reset = function(){
      $http.get('/todolist').success(function(response){
        $scope.todolist=response;
        $scope.task="";
        });
     };

  reset();

$scope.addtask = function() {
  $http.post('/todolist', $scope.task).success(function(response) {
       reset();
    });
 };

$scope.deletetask = function() {
  $http.delete('/todolist/'+ id).success(function(response){
      reset();
      });
   };
 
$scope.edittask = function(id) {
   $http.get('/todolist/'+ id).success(function(response){
       $scope.task=response;
     });
   };

$scope.updatetask = function(id){
   $http.put('/todolist/'+$scope.task._id, $scope.task).success(function(response){
       reset();
    });
 };

$scope.clearfield = function(){
   $scope.task="";
}

}]);

TypeError: path must be absolute or specify root to res.sendFile
    at ServerResponse.sendFile (C:\Users\Rohit\node_modules\express\lib\response.js:403:11)
    at C:\Users\Rohit\Desktop\New folder\mong.js:17:9
    at Layer.handle [as handle_request] (C:\Users\Rohit\node_modules\express\lib\router\layer.js:95:5)
    at next (C:\Users\Rohit\node_modules\express\lib\router\route.js:131:13)
    at Route.dispatch (C:\Users\Rohit\node_modules\express\lib\router\route.js:112:3)
    at Layer.handle [as handle_request] (C:\Users\Rohit\node_modules\express\lib\router\layer.js:95:5)
    at C:\Users\Rohit\node_modules\express\lib\router\index.js:277:22
    at Function.process_params (C:\Users\Rohit\node_modules\express\lib\router\index.js:330:12)
    at next (C:\Users\Rohit\node_modules\express\lib\router\index.js:271:10)
    at jsonParser (C:\Users\Rohit\node_modules\body-parser\lib\types\json.js:100:40)
    at Layer.handle [as handle_request] (C:\Users\Rohit\node_modules\express\lib\router\layer.js:95:5)
    at trim_prefix (C:\Users\Rohit\node_modules\express\lib\router\index.js:312:13)
    at C:\Users\Rohit\node_modules\express\lib\router\index.js:280:7
    at Function.process_params (C:\Users\Rohit\node_modules\express\lib\router\index.js:330:12)
    at next (C:\Users\Rohit\node_modules\express\lib\router\index.js:271:10)
    at expressInit (C:\Users\Rohit\node_modules\express\lib\middleware\init.js:33:5)

我试图在打开 http://localhost:3000 时显示我的 html 文件，但我不能，你能指导我如何做吗，我对这一切都很陌生，一个更简单的解决方案会更有帮助，以便我能够理解它。

最佳答案

用途:

res.sendFile('./todo.html');

或者

var path = require('path');
res.sendFile(path.join(__dirname + '/todo.html'));

第二个更好。

但是您的 frontend.js 文件再次无法加载。因此，最好的方法是创建一个公共(public)文件夹并使用express.static中间件提供静态文件。

app.use(require('express').static('./public'));

更详细的解释可以引用:https://stackoverflow.com/a/36041093/2680461

关于javascript - 当我尝试通过连接到//localhost :3000, 来显示 html 页面时，显示错误，错误已作为片段上传，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37539506/

24 4 0
文章推荐： ios - 计算属性 - 如何仅在主线程上使用？
文章推荐： c++ - 显式特化 : syntax error?
文章推荐： c++ - 调用不带对象参数的非静态成员函数，C++ 节点
文章推荐： javascript - Android 在 WebView 中调用 API <= 18 的 JavaScript 函数
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com