Angular Chrome扩展中出现请求失败错误

我正在尝试使用AngularJS开发一个chrome扩展。我试图使$http.get()请求在正常的HTML页面中工作良好，但未能在我的扩展中这样做，说500(请求失败)错误。这是我的清单

{
    "name": "The Extension",
    "manifest_version": 2,
    "description": "A extension for chrome browsers",
    "version": "1.0.0",
    "background": {
        "persistent": false,
        "scripts": [
            "background.js"
        ]
    },
    "permissions": [
        "tabs", "<all_urls>"
    ]
}

我的app.js(从background.js加载):

//This is adding base directive in app
var app = '<div class="my-extension"><div base></div></div>';
var wrapper = '<div ng-non-bindable>' + app + '</div>';
$('body').append(wrapper);
var myExtension = angular.module('my-extension', ['baseModule']);
window.name = '';
angular.bootstrap($('.my-extension')[0], ['my-extension']);

基数为:

var baseModule = angular.module('baseModule', []);
baseModule.directive('base', ['$http', function($http) {
    return {
        replace: true,
        template: '<div>Hello World</div>',
        link: function(scope, elem, attrs) {
            $http({
                method: 'GET',
                url: 'http://api.example.com/api/yy/zz' //Sample API, Data is being got surely
            }).then(function successCallback(response) {
                console.log('success', response);
            }, function errorCallback(response) {
                console.log('error', response);
            });
        }
    }
}]);

如果这个问题很愚蠢，请原谅我，我在扩展开发方面相对来说是新手。