"Error: $http is not defined

<!DOCTYPE html>
<html ng-app="MyApp">

  <head>
    <link href="style.css" rel="stylesheet" />
  </head>

  <body>
    <h1>Try angular js</h1>
    <div ng-controller="ctrl">
      {{message}}
      <br>
      {{url}}
    </div>
    <script data-require="angular.js@*" data-semver="1.3.7" 
      src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.7/angular.js">
    </script>
    <script src="app.js"></script>
    <script src="facade.js"></script>
    <script src="ctrl.js"></script>
    <script src="enter.js"></script>
  </body>

</html>

/* Styles go here */

'use strict';
var app = angular.module('MyApp',[]);

app.provider('facade', function() {
  var _mainUrl = 'unset';
  var _getItem = function() {
    var _d = null;
    $http.get(_mainUrl)
    .success(function(data) {
      _d = data;
    })
    .error(function(status) {
      _d = status;
    });
    return _d;
  };
  
  this.setMainUrl = function (url) {
    _mainUrl = url;
  };
  
  this.$get = function($http) {
    return {
      mainUrl : _mainUrl,
      getItem : _getItem
    };
  };
});

app.controller('ctrl',
  ['$scope','facade',function($scope,facade) {
    $scope.message = 'controller';
    $scope.message = facade.mainUrl;
    // facade.getItem();
  }])

app.config(function(facadeProvider) {
  facadeProvider.setMainUrl('isset');
});

app.run(function(facade) {
  // these two line also not work
  // facade.$inject = '$http';
  // facade['$inject'] = '$http';
})