Angular получает Html вместо JSON с Django Ответ сервера

Question

Сценарий: Запуск моего кода angular8, который включает http.get с использованием ng serve Запуск django Служба отдыха, которая

return Response({"product":["mac","alienware"]})

(или)

return JsonResponse({"product":["mac","alienware"]})

Работает нормально в внешний интерфейс.

Но при работе на моей виртуальной машине, используя Nginx, где root указывает на файлы stati c, созданные ng build, а / api / ссылается на proxy_pass в веб-сокете of Gunicorn binded

Возвращает файл html (индексный файл) в качестве ответа при печати и выдает ошибку, Json не может проанализировать из-за "<" в позиции 0. </p>

заголовок запроса имеет «Content-Type»: «application / json;», Accept: «application / json»,

Какое решение может быть применено? [Редактировать: Добавляет nginx conf]

 upstream app_server {

    server unix:/data/portal/run/gunicorn.sock fail_timeout=0;
}
server {
    listen 443 ssl;
    client_max_body_size 4G;
    server_name abc.com;
    ssl_certificate /etc/pki/tls/certs/ca.crt;
    ssl_certificate_key /etc/pki/tls/private/ca.key;
    ssl_protocols TLSv1.2 TLSv1.3;
    ssl_ciphers ECDHE-RSA-AES256-GCM-SHA512:DHE-RSA-AES256-GCM-SHA512:ECDHE-RSA-AES256-GCM-SHA384:DHE-RSA-AES256-GCM-SHA384:ECDHE-RSA-AES256-SHA384;
    keepalive_timeout 5;
    add_header Strict-Transport-Security "max-age=31536000;" always;
    add_header X-Content-Type-Options nosniff;
    add_header Cache-Control 'no-store, no-cache, must-revalidate, proxy-revalidate, max-age=0';
    add_header X-XSS-Protection "1; mode=block";

    root /data/portal/static/angular/dist/portal;
    location /static/ {
         alias /data/portal/static/angular/dist/portal/;
    }
    location / {
     root /data/portal/static/angular/dist/portal;
     index  index.html index.htm;
     try_files $uri $uri/ /index.html;


     location /api/ {
       proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
       proxy_set_header Host $http_host;
       proxy_redirect off;
       proxy_pass http://app_server/;
     }
   }
  } 

Когда я вызываю то же самое из одного компонента в angular, это работает, но вызывает то же самое из другого компонента, это не удается

Answer 1

Проблема была в вызове службы из angular, при использовании ng serve, а также при запуске python конечные косые черты при вызове с использованием httpclient не имели значения. Он дал 301 постоянный ход, а затем назвал тот, у которого была sh, что в конечном итоге дало такой смутный ответ.

Answer 2

Попробуйте удалить завершающий сл sh из server url в location /api/ блоке

. При текущей настройке запрос будет перенаправлен следующим образом:

1. http://app_server / api / products -> http://app_server / products
2. Не существует пути products, поэтому, как правило location /, вы получите index.html

Как то так

location /api/ {
  ...
  proxy_pass http://app_server;
}