带有Backbone的ajaxPrefilter

时间:2014-12-29 02:25:09

标签: javascript backbone.js requirejs underscore.js

我使用backbone,underscore,require .js和REST API开发项目。

我收到错误Cross-Origin Request Blocked The Same Origin Policy disallows reading the remote resource at...

注意:我已经在服务器端配置了Access-Control-Allow。不过,错误仍然存​​在。

我找到了一个解决方案,使用ajaxPrefilter,然后我在我的项目中尝试过:

router.js:

start: function() {
        Backbone.history.start({pushState: true});
},
initialize: function() {
   $.ajaxPrefilter( function( options, originalOptions, jqXHR ) {
            options.url = options.url;
        });
   }

这是我的主干观点:

var _wl = new MyModel();
_wl.save(_item,{
         success: function(res) {
             console.log(res);
         }
});

我仍然有“跨源请求被阻止:同源策略禁止在http://example.com/api/MyWebs读取远程资源。这可以通过将资源移动到同一域或启用CORS来解决。

有谁能告诉我这里错了什么?

任何帮助和想法都将受到赞赏。

1 个答案:

答案 0 :(得分:1)

您能否检查来自http://example.com/api/MyWebs的响应是否带有正确配置的CORS标头,例如" Access-Control-Allow-Origin" ""接入控制允许集管和#34;""接入控制允许的方法"等等。这可以通过在chrome / firefox中打开开发工具并检查响应头来完成。

如果CORS配置正确,可以采取以下措施:

响应标题:

  1. 检查您是否正确配置了Access-Control-Allow-Origin标头。最初,您可以将其值设置为" *"用于测试目的,然后再指定特定主机。
  2. 如果您使用的是自定义标题,请确保已使用" Access-Control-Allow-Headers"将它们添加到允许的列表中。自定义标头名称指定为逗号分隔列表。
  3. 如果您想支持某些媒体类型的PUT,DELETE和POST请求,请确保添加" Access-Control-Allow-Methods"。
  4. 服务器端:

    1. 检查您是否添加了代码来处理OPTIONS方法附带的飞行前请求。
    2. EG:

      if(containerRequestContext.getRequest().getMethod().equalsIgnoreCase("OPTIONS")) {
          // code to check if the request is made from a allowed origin and if everything is fine abort with success / forbidden.
      }
      
      1. 检查从服务器发送的每个响应是否都是在正确设置上述响应标头的情况下完成的。
      2. EG: 语言/框架:泽西框架,Java

        每个响应都将通过以下过滤器,并将添加以下响应标头。

        @PreMatching
        @Provider
        public class SecurityResponseFilter implements ContainerResponseFilter {
        
            private static final Logger LOGGER = Logger.getLogger(SecurityResponseFilter.class);
        
            @Override
            public void filter(ContainerRequestContext containerRequestContext,ContainerResponseContext containerResponseContext) throws IOException {
                try {
                    containerResponseContext.getHeaders().add("Access-Control-Allow-Origin", "*");
                    containerResponseContext.getHeaders().add("Access-Control-Allow-Methods", "GET,POST,PUT,DELETE"); 
                    containerResponseContext.getHeaders().add( "Access-Control-Allow-Headers",  "tk_a,tk_r" );
                } catch (Exception e) {
                    LOGGER.error("Error occured while processing request.",e);
                    throw e;
                }
            }
        }
        
        1. 在客户端,如果您需要发送自定义标头,可以按以下方式执行:
        2. 
          
          $.ajaxPrefilter(function(options,originalOptions,jqXHR) {
          	jqXHR.setRequestHeader("tk_a",$.cookie("tk_a"));
          	jqXHR.setRequestHeader("tk_r",$.cookie("tk_r"));
          });