<tfoot id='FiWdd'></tfoot>
      • <bdo id='FiWdd'></bdo><ul id='FiWdd'></ul>

    1. <i id='FiWdd'><tr id='FiWdd'><dt id='FiWdd'><q id='FiWdd'><span id='FiWdd'><b id='FiWdd'><form id='FiWdd'><ins id='FiWdd'></ins><ul id='FiWdd'></ul><sub id='FiWdd'></sub></form><legend id='FiWdd'></legend><bdo id='FiWdd'><pre id='FiWdd'><center id='FiWdd'></center></pre></bdo></b><th id='FiWdd'></th></span></q></dt></tr></i><div id='FiWdd'><tfoot id='FiWdd'></tfoot><dl id='FiWdd'><fieldset id='FiWdd'></fieldset></dl></div>

        <legend id='FiWdd'><style id='FiWdd'><dir id='FiWdd'><q id='FiWdd'></q></dir></style></legend>
      1. <small id='FiWdd'></small><noframes id='FiWdd'>

      2. AngularJS 错误:跨源请求仅支持协议方案:http、dat

        时间:2023-10-14

          <small id='g93gi'></small><noframes id='g93gi'>

          • <legend id='g93gi'><style id='g93gi'><dir id='g93gi'><q id='g93gi'></q></dir></style></legend>
            <tfoot id='g93gi'></tfoot>

              <i id='g93gi'><tr id='g93gi'><dt id='g93gi'><q id='g93gi'><span id='g93gi'><b id='g93gi'><form id='g93gi'><ins id='g93gi'></ins><ul id='g93gi'></ul><sub id='g93gi'></sub></form><legend id='g93gi'></legend><bdo id='g93gi'><pre id='g93gi'><center id='g93gi'></center></pre></bdo></b><th id='g93gi'></th></span></q></dt></tr></i><div id='g93gi'><tfoot id='g93gi'></tfoot><dl id='g93gi'><fieldset id='g93gi'></fieldset></dl></div>
                <tbody id='g93gi'></tbody>
                <bdo id='g93gi'></bdo><ul id='g93gi'></ul>
                  本文介绍了AngularJS 错误:跨源请求仅支持协议方案:http、data、chrome-extension、https的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

                  问题描述

                  我有一个非常简单的 Angular js 应用程序的三个文件

                  I have three files of a very simple angular js application

                  index.html

                  <!DOCTYPE html>
                  <html ng-app="gemStore">
                    <head>
                      <script src='https://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js'></script>
                      <script type="text/javascript" src="app.js"></script>
                    </head>
                  
                    <body ng-controller="StoreController as store">
                        <div class="list-group-item" ng-repeat="product in store.products">
                          <h3>{{product.name}} <em class="pull-right">{{product.price | currency}}</em></h3>
                        </div>
                  
                    <product-color></product-color>
                    </body>
                  </html>
                  

                  product-color.html

                  <div class="list-group-item">
                      <h3>Hello <em class="pull-right">Brother</em></h3>
                  </div>
                  

                  app.js

                  (function() {
                    var app = angular.module('gemStore', []);
                  
                    app.controller('StoreController', function($http){
                                this.products = gem;
                            }
                    );
                  
                    app.directive('productColor', function() {
                        return {
                            restrict: 'E', //Element Directive
                            templateUrl: 'product-color.html'
                        };
                     }
                    );
                  
                    var gem = [
                                {
                                    name: "Shirt",
                                    price: 23.11,
                                    color: "Blue"
                                },
                                {
                                    name: "Jeans",
                                    price: 5.09,
                                    color: "Red"
                                }
                    ];
                  
                  })();
                  

                  当我使用名为 productColor 的自定义指令输入 product-color.html 的包含时,我就开始收到此错误:

                  I started getting this error as soon as I entered an include of product-color.html using custom directive named productColor:

                  XMLHttpRequest cannot load file:///C:/product-color.html. Cross origin requests are only supported for protocol schemes: http, data, chrome-extension, https, chrome-extension-resource.
                  angular.js:11594 Error: Failed to execute 'send' on 'XMLHttpRequest': Failed to load 'file:///C:/product-color.html'.
                  

                  可能出了什么问题?是否是 product-color.html 的路径问题?

                  What may be going wrong? Is it a path issue for product-color.html?

                  我的三个文件都在同一个根文件夹C:/user/project/

                  All my three files are in the same root folder C:/user/project/

                  推荐答案

                  出现此错误是因为您只是直接从浏览器打开 html 文档.要解决此问题,您需要从网络服务器提供代码并在 localhost 上访问它.如果您有 Apache 设置,请使用它来提供文件.一些 IDE 内置了 Web 服务器,例如 JetBrains IDE、Eclipse...

                  This error is happening because you are just opening html documents directly from the browser. To fix this you will need to serve your code from a webserver and access it on localhost. If you have Apache setup, use it to serve your files. Some IDE's have built in web servers, like JetBrains IDE's, Eclipse...

                  如果您有 Node.Js 设置,那么您可以使用 http-server.只需运行 npm install http-server -g 即可在终端中使用它,例如 http-server C:location oapp.

                  If you have Node.Js setup then you can use http-server. Just run npm install http-server -g and you will be able to use it in terminal like http-server C:location oapp.

                  这篇关于AngularJS 错误:跨源请求仅支持协议方案:http、data、chrome-extension、https的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持html5模板网!

                  上一篇:如何获得 XMLHttpRequest 的响应? 下一篇:获取 JQuery ajax 请求进度的最干净的方法是什么

                  相关文章

                  最新文章

                  • <bdo id='F0biC'></bdo><ul id='F0biC'></ul>

                  <tfoot id='F0biC'></tfoot>

                  <legend id='F0biC'><style id='F0biC'><dir id='F0biC'><q id='F0biC'></q></dir></style></legend>
                1. <small id='F0biC'></small><noframes id='F0biC'>

                2. <i id='F0biC'><tr id='F0biC'><dt id='F0biC'><q id='F0biC'><span id='F0biC'><b id='F0biC'><form id='F0biC'><ins id='F0biC'></ins><ul id='F0biC'></ul><sub id='F0biC'></sub></form><legend id='F0biC'></legend><bdo id='F0biC'><pre id='F0biC'><center id='F0biC'></center></pre></bdo></b><th id='F0biC'></th></span></q></dt></tr></i><div id='F0biC'><tfoot id='F0biC'></tfoot><dl id='F0biC'><fieldset id='F0biC'></fieldset></dl></div>