如何在沒有跨站點請求錯誤的情況下將html加載到頁面中

Question

我正在嘗試在機器上創建一個Web應用程序。 以下是相關部分：

index.html：

<!DOCTYPE html>
<html lang="en">
  <body>

    <!--- empty placeholders for external HTML-->
    <div id="welcome"></div>
    <div id="dinnerOverview"></div>
    <div id="sidebar"></div>

    <!-- The application JavaScript code -->
    <script src="js/model/dinnerModel.js"></script>
    <script src="js/app.js"></script>
    <script src="js/view/sidebarView.js"></script>
    <script src="js/controllers/sidebarController.js"></script>
    <script src="js/controllers/generalController.js"></script>
  </body>
</html>

js / app.js：

$(function() {
    //We instantiate our model
    var model = new DinnerModel();

    // We instantiate the general controller
    var generalController = new GeneralController();
    // And create the instance of the view
    var sidebar = $("#sidebar");
    var sidebarView = new SideBarView(sidebar, model); 
    //add sidebarView to general controller
    generalController.addView(sidebarView);
    //instantiate sidebar controller
    var sidebarController = new SideController(sidebar, model);

});

js / views / sidebarView.js：

var SideBarView = function(container, model){
    var container = container;
    var model = model;

    container.load("sidebar.html");
}

最后一行出現錯誤：

jquery.js:9631 Failed to load file:///Users/sahandzarrinkoub/Documents/Programming/DH2642/dinnerplanner-html/sidebar.html: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.

怎么辦呢？ 我什至看不到這是跨源請求嗎？

Answer 1

我設法通過使用文件托管服務器來解決該錯誤。

在項目目錄中創建package.json並將其粘貼到其中：
{ "name": "Demo", "version": "1.0.0", "description": "demo project.", "scripts": { "lite": "lite-server --port 10001", "start": "npm run lite" }, "author": "", "license": "ISC", "devDependencies": { "lite-server": "^1.3.1" } }
使用終端進入文件夾的內部，然后運行npm install 。
運行npm start 。

現在可以在localhost:10001訪問該項目

如何在沒有跨站點請求錯誤的情況下將html加載到頁面中

問題描述

1 個解決方案

解決方案1
0 已采納 2018-03-06 14:34:16

如何在沒有跨站點請求錯誤的情況下將html加載到頁面中

問題描述

1 個解決方案

解決方案1 0 已采納 2018-03-06 14:34:16

解決方案1
0 已采納 2018-03-06 14:34:16