拒绝从执行脚本“*”,因为它的MIME类型(“应用/ JSON')不是可执行文件,以及严格的MIME类型检查已启用 [英] Refused to execute script from '*' because its MIME type ('application/json') is not executable, and strict MIME type checking is enabled

查看:1159
本文介绍了拒绝从执行脚本“*”,因为它的MIME类型(“应用/ JSON')不是可执行文件,以及严格的MIME类型检查已启用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我是一个新手,AngularJS。我使用Rails应用程序揭露JSON格式的数据。该数据是由角应用使用。角回购和正回购轨道是完全不同的。之所以不同的存储库是因为我希望我的轨回购只是为了揭露使用,我可以在角应用程序中使用的API数据。

I am a newbie to AngularJS. I am using a rails application to expose data in json format. The data is to be used by angular app. The angular repo and the rails repo are completely different. The reason for different repositories is because I want my rails repo just to expose data using APIs which i can use in the angular app.

我的轨控制器是如下

class Api::V1::PhonesController < ApplicationController
  def index
    render json: Phone.all
  end

  def show
    render json: Phone.find(params[:id])
  end
  ...
end

现在,当我访问本地主机:3000 / API / V1 /手机',它返回我所有的手机JSON数据。当我访问的'localhost:3000 / API / V1 /手机/ 1',它返回与ID为1的手机,我用验证的 http://jsonlint.com/ 。一切工作正常到这里。

Now, when i visit 'localhost:3000/api/v1/phones', it returns me the json data for all the phones. When I visit 'localhost:3000/api/v1/phones/1', it returns the the json data for the phone with id 1. I validated the json data format using http://jsonlint.com/. Everything works fine till here.

我angularjs路由文件是:

My angularjs route file is as:

$routeProvider.
   when('/phones', {
     templateUrl: 'list.html',
     controller: 'PhoneListController' 
   }).
   when('/phones/:id', {
     templateUrl: 'show.html',
     controller: 'PhoneShowController'
   }).
   otherwise({
     redirectTo: '/phones'
   });
}]);

我的角度回购的index.html已经嵌入了list.html模板。

My index.html in the angular repo has the list.html template embedded in it.

<html ng-app='phoneCatApp'>
  ...
</html>
<script type="text/ng-template" id="list.html">
  This is the list template.
</script>

在code为services.js是:

the code for the services.js is as:

var appServices = angular.module('appServices', []);

phoneCatApp.factory('appServices', ['$http', '$q', function($http, $q){
  var url = "http://localhost:3000/api/v1/";

  //get all phones
  this.getPhones = function(){
    var defered = $q.defer();
    var listApi = url + "phones";

    $http.jsonp(listApi).then(function(results){
      defered.resolve(results);
    }, function(error){
      defered.reject(error);
    });
    return defered.promise;
    }
  return this;
}]);

在脚本模板中的文本,当我参观'#/手机的显示为好。问题是
1)在Chrome中,当我检查页面显示下面的错误。

The text in the script template is displayed as well when I visit '#/phones'. The problem is that 1) In chrome, following error is displayed when i inspect the page.

Refused to execute script from 'http://localhost:3000/api/v1/phones' because its MIME type ('application/json') is not executable, and strict MIME type checking is enabled.

2)在Firefox,是越来越显示以下错误。

2) in firefox, the following error is getting displayed.

SyntaxError: missing ; before statement

感谢您的帮助。

推荐答案

哎,所以我相信你的问题是,你的导轨控制器返回JSON和NOT JSONP。控制器具有明确指定的回调函数,可以由请求参数来指定。

Hey so I believe your problem is that your rails controller is returning JSON and NOT JSONP. Your controller has to explicitly specify a callback function, which can be specified by the request params.

请参阅处理JSONP在轨道3控制器用于返回JSONP的例子从Rails控制器

See Handling jsonp in rails 3 controller for an example of returning JSONP from a rails controller

所以,你的导轨code会是什么样子(哎呀我的Rails是非常非常生疏...):

So your rails code would look like (argh my rails is very very rusty...):

class Api::V1::PhonesController < ApplicationController
  def index
    if params[:callback]
      format.js { render :json => {:phones => Phone.all.to_json}, :callback => params[:callback] }
    else
      format.json { render json: {:phones => Phone.all.to_json}}
    end
end

然后对角边,这个答案应该帮助你:
<一href=\"http://stackoverflow.com/questions/12066002/parsing-jsonp-http-jsonp-response-in-angular-js\">parsing在angular.js

我想那么你的角度看起来像:

And I think your angular would then look like:

var appServices = angular.module('appServices', []);

phoneCatApp.factory('appServices', ['$http', '$q', function($http, $q){
  var url = "http://localhost:3000/api/v1/";

  //get all phones
  this.getPhones = function(){
    var defered = $q.defer();
    var listApi = url + "phones?callback=JSON_CALLBACK";

    $http.jsonp(listApi).then(function(results){
      defered.resolve(results);
    }, function(error){
      defered.reject(error);
    });
    return defered.promise;
    }
  return this;
}]);

这篇关于拒绝从执行脚本“*”,因为它的MIME类型(“应用/ JSON')不是可执行文件,以及严格的MIME类型检查已启用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆