个人中心
gpt4 book ai didi

javascript - 无法加载资源 : the server responded with a status of 404 (Not Found) with nodejs

转载 作者：行者123 更新时间：2023-11-28 06:18:51 24 4
gpt4 key购买 nike

我正在尝试在 nodejs 服务器上获取 html 元素数据。但是我在浏览器中不断收到很多错误。这是我的 html 页面。

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>SimplyBPM | Customer 360 CRM | Dashboard</title>
    <!-- Tell the browser to be responsive to screen width -->
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    <!-- Bootstrap 3.3.5 -->
    <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
    <!-- Font Awesome -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
    <!-- Ionicons -->
    <link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
    <!-- Theme style -->
    <link rel="stylesheet" href="assets/css/AdminLTE.min.css">
    <!-- AdminLTE Skins. Choose a skin from the css/skins
         folder instead of downloading all of them to reduce the load. -->
    <link rel="stylesheet" href="assets/css/skins/_all-skins.min.css">

    <!-- SB css -->
    <link rel="stylesheet" href="assets/css/sbCustom.css">

  </head>
  <body class="hold-transition skin-blue sidebar-mini">
    <div class="wrapper">

    <!--  Header -->
    <div class="sbIncludeHTML" title="header.html">Include HTML here</div>

    <!--  Left Nav -->
    <div class="sbIncludeHTML" title="leftNav.html">Include HTML here</div>

      <!-- Content Wrapper. Contains page content -->
      <div class="content-wrapper">

        <!-- Content Header (Page header) -->
        <section class="content-header">
          <h1>Customer 360 CRM <small>Dashboard</small></h1>

        </section>

        <!-- Main content -->
        <section class="content">

          <!-- Small boxes (Stat box) -->
          <div class="row">
            <div class="col-lg-3 col-xs-6">  <!-- Box1 -->
              <!-- small box -->
              <div class="small-box bg-aqua">
                <div class="inner"><h3>9</h3><p>Unassigned</p></div>
                <div class="icon"><i class="ion ion-email-unread"></i></div>
                <a style="cursor:pointer;" class="small-box-footer" onclick="filterList('ALL',0)">Show all <i class="fa fa-arrow-circle-right"></i></a>
              </div>
            </div><!-- ./Box1 -->

            <div class="col-lg-3 col-xs-6"> <!-- Box2 -->
              <!-- small box -->
              <div class="small-box bg-green">
                <div class="inner"><h3>3</h3><p>My Incidents</p></div>
                <div class="icon"><i class="ion ion-ios-list"></i></div>
                <a style="cursor:pointer;" class="small-box-footer" onclick="filterList('MYRECORDS',0)">Show all <i class="fa fa-arrow-circle-right"></i></a>
              </div>
            </div><!-- ./Box2-->

            <div class="col-lg-3 col-xs-6"> <!-- Box3 -->
              <!-- small box -->
              <div class="small-box bg-yellow">
                <div class="inner"><h3>2</h3><p>New Incidents</p></div>
                <div class="icon"><i class="ion ion-ios-telephone"></i></div>
                <a style="cursor:pointer;" class="small-box-footer" onclick="filterList('NEW',0)">Show all <i class="fa fa-arrow-circle-right"></i></a>
              </div>
            </div><!-- ./Box3 -->

            <div class="col-lg-3 col-xs-6"> <!-- Box4 -->
              <!-- small box -->
              <div class="small-box bg-red">
                <div class="inner"><h3>4</h3><p>Follow-up Today</p></div>
                <div class="icon"><i class="ion ion-ios-bell"></i></div>
                <a style="cursor:pointer;" class="small-box-footer" onclick="filterList('FOLLOWUPTODAY',0)">Show all <i class="fa fa-arrow-circle-right"></i></a>
             </div>
            </div><!-- ./Box4 -->
          </div><!-- /.row -->

          <!-- Main row -->
          <div class="row">
            <!-- Left col -->
            <section class="col-lg-8 connectedSortable">

              <!-- Search Options -->
              <div class="box box-primary">
                <div class="box-header"><span class="glyphicon glyphicon-search"></span><h3 class="box-title">Search</h3></div>
                <div class="box-body">

              <div class="form-inline">
              <!-- Search ID box -->
              <div class="col-lg-7 col-md-7 col-sm-12 col-xs-12">
                <div class="form-group">
                    <label for="INCIDENT_ID">Incident Search ID:</label>
                    <input type="text" class="form-control sbDataFields" id="INCIDENT_ID" placeholder="Search ID">
                </div>
              </div>

               <!-- Search Button -->
              <div class="col-lg-4 col-md-4 col-sm-12 col-xs-12">
                 <div class="form-group">
                     <button type="button" name="search" id="search-btn1" class="btn btn-primary" onclick="searchRecord();">Search</button>&nbsp;&nbsp;
                     <button type="button" onclick="window.location='incidentSearch.html'" name="search" id="search-btn2" class="btn btn-primary" >Advanced</button>
                 </div>
              </div>         
             </div>


              </div> <!-- ./Box Body -->
              </div> <!-- End of Search Box ./box-primary -->

            <!-- Table of Incidents -->
              <div class="box box-primary">
                <!-- box-header -->
                <div class="box-header"><span class="glyphicon glyphicon-th-list"></span>
                <h3 class="box-title">Incident Table</h3>

                </div><!-- /.box-header -->
                <!-- Table values -->
                <div class="box-body table-responsive">
                  <table class="table table-hover" id="incidentList">
                    <thead>
                      <tr>
                        <th>Alert</th>
                        <th>Priority</th>
                        <th>Incident ID</th>
                        <th>Description</th>
                        <th>Type</th>
                        <th>Status</th>
                        <th>Created On</th>
                        <th>Assigned To</th>
                      </tr>
                    </thead>
                    <tbody>
                    </tbody>
                  </table>
                <div class="box-tools pull-right">
                    <ul class="pagination pagination-sm inline" id="pagination"> <!-- Scroll Buttons -->
                    </ul>
                </div>
                </div><!-- /.box-body -->
              </div><!-- /.box-primary -->                        
           </section><!-- /.Left col -->

           <!-- right col (We are only adding the ID to make the widgets sortable)-->
            <section class="col-lg-4 connectedSortable">
              <!-- Chat box -->
                <div class="sbIncludeHTML" title="notes.html">Include HTML here</div>

            </section><!-- right col -->
          </div><!-- /.row (main row) -->
       </section><!-- /.content -->
       </div><!-- /.content-wrapper -->

       <input type="text" value="" id="CURRENT_FILTER_TYPE" style="display:none"/>

       <!-- Main Footer -->
      <footer class="main-footer">
        <div class="pull-right hidden-xs">
          <b>Version</b> 2.3.0
        </div>
        <strong>Copyright &copy; 2015-2016 <a href="http://www.cgsits.com/simplybpm">CGS IT Solutions</a>.</strong> All rights reserved.
      </footer>  <!-- ./Main Footer -->  

    </div><!-- ./wrapper -->

        <div class="modal fade" id="pleaseWaitDialog" tabindex="-1" role="dialog" aria-labelledby="pleaseWaitDialogLabel">
  <div class="modal-dialog" role="document">
    <div class="row">
        <div class="col-sm-12">
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title" id="pleaseWaitDialogLabel">Processing...</h4>
      </div>
      <div class="modal-body">
            <div class="progress progress-striped active">
                <div class="progress-bar" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100" style="width: 100%;">
                    <span class="sr-only">70% Complete</span>
                </div>
            </div>
      </div>
    </div>
        </div>
    </div>
  </div>
</div>


    <!-- jQuery 2.1.4 -->
    <script src="assets/js/jQuery-2.1.4.min.js"></script>

    <!-- Bootstrap 3.3.5 -->
    <script src="bootstrap/js/bootstrap.min.js"></script>

    <!-- AdminLTE App -->
    <script src="assets/js/app.min.js"></script>

    <script src="files/common.js"></script>

    <script src="files/itsm.js"></script>

    <script src="files/sbIncludeHTML.js"></script>


<script>
        var totalRows = 0;
        var rowCount = 10;
        $(document).ready(function(){
            getAllRecords(0);
            getAllNotes();
            $(document).ajaxComplete(function(){
                    readOnlyNotes();
            });
        });

        function getAllRecords(rowOffset)
        {
            var dataString = "action=list&rowOffset=" + rowOffset  + "&rowCount=" + rowCount;
            $("#pleaseWaitDialog").modal("show");
            $.ajax({
                type:"GET",
                url:"/api/itsm/incident",
                data:dataString,
                success:function(response)
                {
                    $("#pleaseWaitDialog").modal("hide");
                    var returnMessage = checkResponse(response);
                    if(returnMessage == true)
                    {
                        generateTableHTML(response);
                        pagination(true,'LIST');
                    }
                    else if(returnMessage != false)
                    {
                        alert(returnMessage);
                    }
                }
            });
        }

        function generateTableHTML(response)
        {
            var responseJSON = JSON.parse(response);
            var responseJSONList;
            if(responseJSON.TOTAL_ROWS && responseJSON.TOTAL_ROWS != null && responseJSON.TOTAL_ROWS != undefined)
            {
                totalRows = responseJSON.TOTAL_ROWS;
            }
            responseJSONList = responseJSON.RESULTS_SET;
            var incidentTable = document.getElementById("incidentList");
            var html = "";
            for(var i=0;i<responseJSONList.length;i++)
            {
                html += "<tr>";
                if(i%2 == 0)
                {
                    html += "<td class='glyphicon glyphicon-bell text-red'></td>";
                }
                else
                {
                    html += "<td></td>";
                }
                html += "<td>" + responseJSONList[i].PRIORITY; + "</td>";
                html += "<td><a href='incidentDetails.html?IID=" + responseJSONList[i].INCIDENT_ID + "'>" + responseJSONList[i].INCIDENT_ID + "</a></td>";
                html += "<td>" + responseJSONList[i].SHORT_DESC + "</td>";
                html += "<td>" + responseJSONList[i].INCIDENT_TYPE + "</td>";
                html += "<td>" + responseJSONList[i].STATUS + "</td>";
                html += "<td>" + responseJSONList[i].CREATED_DATE + "</td>";
                html += "<td>" + responseJSONList[i].ASSIGNED_TO + "</td>";
                html += "</tr>";
            }
            incidentTable.getElementsByTagName("tbody")[0].innerHTML = html;
        }

        function filterList(type,rowOffset)
        {
            $("#pleaseWaitDialog").modal("show");
            var searchObject = new Object();
            var tempDate = new Date();
            if(type == "NEW")
            {
                searchObject["CREATED_DATE"] = yyyymmdd(tempDate);
            }
            else if(type == "FOLLOWUPTODAY")
            {
                searchObject["FOLLOW_UP_DATE"] = yyyymmdd(tempDate);
            }
            else if(type == "MYRECORDS")
            {
                searchObject["ASSIGNED_TO"] = "Troy";
            }
            else if(type == "ALL")
            {
                searchObject["1"] = "1";
            }
            var searchObjectString = JSON.stringify(searchObject);
            var dataString = "searchRequest=" + searchObjectString  + "&action=search&rowOffset="+ rowOffset +"&rowCount=" + rowCount;
            $.ajax({
                type:"GET",
                url:"/api/itsm/incident",
                data:dataString,
                success:function(response)
                {
                    $("#pleaseWaitDialog").modal("hide");
                    var returnMessage = checkResponse(response);
                    if(returnMessage == true)
                    {
                        document.getElementById("CURRENT_FILTER_TYPE").value = type;
                        generateTableHTML(response);
                        pagination(true,'FILTER');
                    }
                    else if(returnMessage != false)
                    {
                        alert(returnMessage);
                    }
                }
            });
        }

        function searchRecord()
        {
            $("#pleaseWaitDialog").modal("show");
            var searchObject = new Object();
            $(".sbDataFields").each(function(){
                searchObject[$(this).attr("id")] = encodeURIComponent($(this).val());
            });
            var searchObjectString = JSON.stringify(searchObject);
            var dataString = "searchRequest=" + searchObjectString  + "&action=search&rowOffset=0&rowCount=1";
            $.ajax({
                type:"GET",
                url:"/api/itsm/incident",
                data:dataString,
                success:function(response)
                {
                    $("#pleaseWaitDialog").modal("hide");
                    var returnMessage = checkResponse(response);
                    if(returnMessage == true)
                    {
                        generateTableHTML(response);
                        pagination(false,'SEARCH');
                    }
                    else if(returnMessage != false)
                    {
                        alert(returnMessage);
                    }
                }
            });
        }
    </script>
  </body>
</html>

这是我的 nodejs 服务器程序。 

var express = require('express');
var bodyParser = require('body-parser');
var urlencodedParser = bodyParser.urlencoded({ extended: false });
var mysql      = require('mysql');
var $ = require('jquery');
var settings = {
        host: 'cgs-devdb.czspzuv6lcaw.us',
        database: 'Customer 360',
        user: 'cgsadmin',
        password: 'cypre55gs'
    };
// Express
var app = express();
app.use(express.static(__dirname + '/public'));
app.use(bodyParser.urlencoded({ extended: false}));
app.use(bodyParser.json());

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

// Get information submitted
app.get('/api/itsm/incident', function(req, res){
    var obj = {};
    var jsonString = JSON.stringify(req.body);
    console.log('body: ' + JSON.stringify(req.body));
    console.log(req.body);
    var qb = require('node-querybuilder').QueryBuilder(settings, 'mysql', 'single');
    // Generating Query
    qb.select('*')
    .where(req.body)
    .get('SM_INCIDENT', function(err,response) {
        if (err) return console.error("Uh oh! Couldn't get results: " + err.msg);

        console.log("Query Ran: " + qb.last_query());

        console.log(response);
        res.send(response); // sending back the response to ajax
    });
});
// Start server
app.listen(8000);
console.log("API is running on port");

These are the errors I am getting.

Here is the folder structure of my Node JS project

我发现很难获得准确的 html 页面，因为没有包含脚本。帮我找出错误。谢谢!!

最佳答案

看起来你想改变:

app.use(express.static(__dirname + '/public'));

到:

app.use(express.static(__dirname + '/Web-Content'));

或者将 Web-Content 文件夹重命名为 public。

关于javascript - 无法加载资源 : the server responded with a status of 404 (Not Found) with nodejs，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35732420/

24 4 0
文章推荐： swift - 合并/追加 [AnyHashable : Any]() on Swift 3
文章推荐： java - 什么构成了 Java API
文章推荐： c++ - QML 矩形按钮高亮延迟
文章推荐： c++ - 将多个文件添加到输出以用于额外的编译器 Qt
行者123
个人简介

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

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