1

Edit Dulicate of AngularJS Error: Cross origin requests are only supported for protocol schemes: http, data, chrome-extension, https.

Is there a way to make separate HTML-files (with angular templates inside) accessible via Chrome file protocol?

For example, if you copy the code from this question and run it just on your desktop, it will work fine in Firefox, but will not work in Chrome.

It seems that Chrome restricts it due to a security reasons, but maybe there is some more-or-less conventional way to pass it.

index.html

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.min.js"></script>
<script src="templates.js"></script>

<body ng-app="myApp">
  <wrapper>
      <p>foo</p>
  </wrapper>
</body>

templates.js

(function(angular) {
    'use strict';

angular.module('myApp', [])

.directive('wrapper', function() {
    return {
        restrict: 'E',
        transclude: true,
        templateUrl:
        './tpl-wrapper.html'
    };
});

})(window.angular);

tpl-wrapper.html

<div style="background-color: #ccc">
    <div ng-transclude></div>
</div>

Firefox

enter image description here

Chrome

enter image description here

Community
  • 1
  • 1
john c. j.
  • 725
  • 5
  • 28
  • 81

1 Answers1

1

I mean if you really want that you can download the google chrome extension:

Allow-Control-Allow-Origin

Then im preety sure its autmatically enabled, so you can use it..

NOTE:

This is only for development use, not in production... Because the user cant automatically know you are serving file://

amanuel2
  • 4,508
  • 4
  • 36
  • 67