AngularJS Post请求在Firefox上无法正常工作 [英] AngularJS Post request does not work correctly on firefox

查看:243
本文介绍了AngularJS Post请求在Firefox上无法正常工作的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在写一个AngularJS的网站,与服务器上的API进行通信,并提供一些信息。
登录部分我应该发送一个http邮件请求包含电子邮件,密码等,它适用于谷歌浏览器和IE浏览器。我的意思是它发送的请求,并获得一个令牌。但在FireFox中,我在网络中检查,它发送一个OPTION请求,并得到200,但之后,它不发送任何帖子!所以我的登录不会消失,我不会得到任何令牌。

我应该怎么做这种情况?

App.config:

  $ httpProvider.defaults.withCredentials = true; 
$ httpProvider.defaults.headers.post ['Content-Type'] ='application / x-www-form-urlencoded; charset = utf-8;';
$ httpProvider.interceptors.push('httpRequestInterceptor');

发送请求的服务函数:

  this.loginEmail =函数(f_email,f_pass,deviceModel,deviceOs){
var data = $ .param({
email:f_email,
password :f_pass,
device_model:deviceModel,
device_os:deviceOs
});
$ b $ return $ http({
method:POST,
url:app.baseUrl +'login_email /'+ app.storeID +'/'+ app.device_id,
data:data
})。success(function(response){
return response.status;
});
/ return $ http.post(app.baseUrl +'login_email /'+ app.storeID +'/'+ app.device_id,data).success(function(response){
return response。状态;
})。error(function(response){
return response.status;
}); * /
};

服务器证书是真实的



罚款,因为我可以得到请求





编辑:
这是另一个可能与这个问题有关的事情:
在Chrome中,当我登录获取请求时,它发送令牌头
,但是对于Post它不是


$ b

httpRequestInterceptor:

  app.factory('httpRequestInterceptor',function($ cookieStore) {
return {
request:function(config){

config.headers ['Authorization'] = $ cookieStore.get('Auth-Key');;
config.headers ['Accept'] ='application / json; odata = verbose';
return config;
}
};
});


解决方案

问题是由Apache配置造成的。 >

之前:

 访问控制 - 允许标题:授权

after:

  Access-Control-Allow-Headers:authorization,Content-type

这是代码:

$ $ $ $ $ $ $ $ $ $ $ $ $ SERVER ['REQUEST_METHOD'] =='OPTIONS'){
header(HTTP / 1.1 200 OK);
exit();




$ b

更新2:
此选项在Django的REST框架中出现问题!对于OPTIONS来说,如果发现有问题,就会通过执行整个API来评估请求,即使您有发送请求所需的权限,也会出错。

示例:

假设有一个像api / profile这样的url,它需要一个授权头来响应配置文件的细节。您想发送跨域请求获取它。您设置正确的标题,然后单击!你会得到未经授权的错误!为什么?由于预先运行的请求(OPTIONS)没有包含任何特殊的头文件,浏览器将其发送到服务器,所以带有REST框架的服务器通过检查整个请求(使用授权头获取请求)来评估OPTIONS请求,但OPTIONS没有任何授权头所以这个请求是非法的!

开发解决方案:
这个问题可以通过客户端或后端来解决。前端开发者可以在chrome上安装以下插件:
$ b


允许控制 - 允许来源:*


后端开发人员可以安装一个在Django Framework上启用CORS的包。


I'm writing a website with AngularJS which communicates with an API on the server and provides some Info. for Log in part I should send a http post request containing Email, Password and etc. It works fine on google Chrome and IE. I mean it sends the post request and gets a token. But in FireFox as I checked in Network, It sends an OPTION request and gets 200 but after that it does not send any post! hence my login would not disappear and I wont get any token.

what should I do for this situation?

App.config :

  $httpProvider.defaults.withCredentials = true;
  $httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=utf-8;';
  $httpProvider.interceptors.push('httpRequestInterceptor');

Function in service which sends request :

    this.loginEmail = function(f_email, f_pass, deviceModel, deviceOs) {
    var data = $.param({
            email: f_email,
            password: f_pass,
            device_model: deviceModel,
            device_os: deviceOs
        });

        return $http({
            method: "POST",
            url: app.baseUrl + 'login_email/' + app.storeID + '/' + app.device_id,
            data: data
        }).success(function(response){
            return response.status;
        });
    /*return $http.post(app.baseUrl + 'login_email/' + app.storeID + '/' + app.device_id, data).success(function(response){
        return response.status;
    }).error(function(response){
        return response.status;
    });*/
};

Server Credentials are true

CORS seems fine because I can do get request

EDIT: Here's another thing that may be related to this problem: in Chrome when I get logged in for get requests it sends the Token header but for Post it doesn't

httpRequestInterceptor :

app.factory('httpRequestInterceptor', function ($cookieStore) {
     return {
        request: function (config) {

        config.headers['Authorization'] = $cookieStore.get('Auth-Key');;
        config.headers['Accept'] = 'application/json;odata=verbose';
        return config;
     }
   };
});

解决方案

The problem was caused by apache configurations.

before:

Access-Control-Allow-Headers: "authorization"

after:

Access-Control-Allow-Headers: "authorization, Content-type"

UPDATE :

On CORS requests if API requires some special headers like Auhtorization Token you must return all OPTIONS requests 200(ok!) if not the solution above would not work anyway. Here's the code:

if($_SERVER['REQUEST_METHOD'] == 'OPTIONS') {
   header( "HTTP/1.1 200 OK" );
   exit();
}

UPDATE 2 : This OPTIONS problem occurs in REST framework for Django! For OPTIONS it evaluates the request by pursing whole api if there was a problem in it, you'll get error even though you have required permissions for sending request!

Example:

Suppose that there's a url like api/profile which needs an Authorization header for responsing profile details. You want to send the Cross Domain request for getting it. You set the right headers and click! You'll get unauthorized error! Why? Because the pre flighted request(OPTIONS) does not include any special header and browser sends it to server, server with REST framework evaluates the OPTIONS request by checking the whole request(get request with authorization header) but OPTIONS doesn't have any authorization header so this request is unauthorized!

DEVELOPMENTAL SOLUTION : This problem can be solved either by Client-Side or Back-End. Front-End developer can install following plugin on chrome:

Allow-Control-Allow-Origin: *

Back-End developer can install a package which enables CORS on Django Framework.

这篇关于AngularJS Post请求在Firefox上无法正常工作的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

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