从 AngularJs App 访问 Django 服务器：简单的身份验证解决方案？

Posted 2023-03-08

【中文标题】从 AngularJs App 访问 Django 服务器：简单的身份验证解决方案？

【英文标题】：Accessing Django server from AngularJs App: Easy authentication solution?

【发布时间】：2017-04-06 19:53:30

【问题描述】：

我到处寻找，但似乎找不到有用的答案。

我编写了一个 Angular 应用程序，它试图从我公司编写的 django RESTful 后端提取数据。我有用户名和密码，但我不确定如何编写获取请求以向后端提供身份验证凭据。我也对我应该在标题中提供的确切内容感到困惑。

最终，我们将使用 nginx 进行通信。

我想要什么

我正在寻找在 Angular 应用程序本身中编写的修复程序。我正在尝试将 Angular 应用程序尽可能与 django 后端分开编写。我已经开启了跨域资源共享。

这将是一个创可贴修复，仅用于显示来自后端的数据。它不需要以任何方式永久存在。

到目前为止我已经尝试过：

app.factory('mySamples', ['$http', function($http) 
    return $http.get('website/api/foo', 
    headers: 'username':"foo", 'password': 'bar'
  ).success(function(data) 
    return data;
  ).error(function(err) 
    return err;
  ); 
;

app.factory('mySamples', ['$http', function($http) 
    return $http(method: 'GET', url: 'website/api/samples/', headers: 
        'user': 'foo', 'auth':'bar'
    );
;

我写的第二个工厂在返回的标题下的网络检查器中返回 METHOD: OPTIONS。有没有人可以快速修复从我的 api 获取数据？

编辑：我的 django 后端不支持基本身份验证，只支持基于会话的身份验证。如何编辑我的获取请求？

【参考方案1】：

您首先需要知道在服务器端实现了哪种Authentication 和Authorization，即服务器在哪些标头中查找身份验证/授权凭据以及服务器期望的格式，然后将凭据发送到那个标题键。例如，如果服务器以username::password 格式检查Authorization 标头中的身份验证凭据，那么您需要添加类似的标头

headers: 'Authorization': 'johndoe::password'

【讨论】：

有没有办法检查服务器要求什么？

【参考方案2】：

(1) 如果您使用的是基本认证，您可以像这样添加基本认证：

app.factory('mySamples', ['$http', function($http) 
    var credentials = btoa(username + ':' + authtoken);
    var authorization = 
        'Authorization': 'Basic ' + credentials
    ;        
    return $http(method: 'GET', url: 'website/api/samples/', headers: authorization );
;

如果您的所有 $http 调用都使用相同的身份验证，您可以使用 $http.defaults.headers.common.Authorization

(2) 我很确定 nginx 不提供会话处理——你必须在 django 中这样做。

(3) 我通常不使用 REST 会话，因为 REST 通常是无状态的。

---

OP 询问如何启用 CORS。启用 CORS 通常在服务器端完成。你可以在 nginx 中添加：

 add_header 'Access-Control-Allow-Origin' '*';
 add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';

到相应的location 块。您也可以在 django 端使用中间件包来执行此操作，例如 django-cors-middleware (https://pypi.python.org/pypi/django-cors-middleware) 或 django-cors-headers (https://pypi.python.org/pypi/django-cors-headers)。

【讨论】：

我已经在上面尝试过，但现在我收到与跨源引用相关的错误。我得到：XMLHttpRequest cannot load https://www.thiswebsideexample/api/thing. Response for preflight has invalid HTTP status code 403 目前我正在使用 chrome exention CORS 来启用 CORS。我需要把它放在应用程序的配置中吗？我需要改变什么？

编辑了我关于如何解决 CORS 问题的回复。

我发现我们的网站不包括基本身份验证，只有基于会话的身份验证。您是否知道仅从 Angular 应用程序使用基于会话的身份验证来访问 api 的方法？目前我无法更改 django 后端设置，因此无法添加基本身份验证选项。