Заголовок имеет "Access-Control-Allow-Origin: *", но угловой дает мне "Запрос перекрестного происхождения заблокирован: тот же источник ..." - PullRequest
Новая
       31

Заголовок имеет "Access-Control-Allow-Origin: *", но угловой дает мне "Запрос перекрестного происхождения заблокирован: тот же источник ..."

0 голосов
/ 13 марта 2019

Прошу прощения за просьбу о помощи, но я достаточно новичок в работе с angular и python api, чтобы застрять, и больше никуда не уйду с этой загадкой.

Сценарий: у меня есть два docker-контейнера, добавленных с помощью docker-compose в среде Ubuntu. Один из них, контейнер pythonflask, - это сервер api, а второй, угловой, - это угловое приложение.

Я осознаю тот факт, что из-за CORS мне нужно установить библиотеку flask-cors в моем файле python, поэтому я сделал это, и все выглядит нормально, потому что когда я просто "curl -I http://pythonflask:5000/loan-requests внутри угловой контейнер получаю: 

HTTP/1.0 200 OK
Content-Type: application/json
Content-Length: 41174

Access-Control-Allow-Origin: *

Server: Werkzeug/0.14.1 Python/3.7.2
Date: Wed, 13 Mar 2019 14:32:06 GMT

Мне кажется, что это хорошо, но когда я пытаюсь получить доступ к той же странице из приложения angular, я получаю сообщение «Блокировка перекрестного источника: политика одного источника запрещает чтение удаленного ресурса в», так что кажется, что angular don ' получить правильный заголовок.

Я прочитал вопрос Python Flask Cors Issue и попробую все там, так что теперь мне теперь кажется угловой проблемой, а не проблемой сервера из-за " Access-Control-Allow-Origin : * "наличие в шапке.

Для ясности, вот файл docker-compose.yml и оба файла Docker: 

version: '2'

services:

    pythonflask:
        build: ./pythonflask
        stdin_open: true
        tty: true
        image: pythonflask
        ports:
            - "5000:5000"
        expose:
            - 5000

    angular:
        build: ./angular
        stdin_open: true
        tty: true
        image: angular
        ports:
            - "8080:80"
        expose:
            - 80
        volumes:
           - ./angular/dist:/usr/share/nginx/html 

    web:
        image: httpd  # this will use httpd:latest

Dockerfile pythonflask: 


FROM python:stretch 

MAINTAINER XXXXX

RUN pip install flask \
    && pip install flask-restful \
    && pip install Flask-JWT \
    && pip install flask-cors \
    && pip install pycryptodomex \
    && pip install requests \
    && pip install python-dateutil

RUN apt-get update \
    && apt-get install -y curl \
    && apt-get install -y iputils-ping \
    && apt-get install -y nano

COPY src /src/

WORKDIR /src

EXPOSE 5000

ENTRYPOINT ["python", "/src/ethan_app.py"]

Это угловой Dockerfile: 


FROM nginx:latest

RUN apt-get update \
    && apt-get install -y curl \
    && apt-get install -y iputils-ping \
    && apt-get install -y nano

WORKDIR /usr/share/nginx/html

    COPY ./dist .

Это фрагмент кода Python, который я использую для API Python: 


# coding: utf-8 

from flask import Flask
from flask_restful import Api
from flask_jwt import JWT
from flask_cors import CORS
import os

from ethan_loanRequest import LoanRequests

if not os.path.isfile("ethan.db"):
    resetDemo = ResetDemo()
    resetDemo.resetDemo()

UPLOAD_FOLDER = './uploads'
app = Flask(__name__)
app.secret_key = "xxxxx"
app.config['UPLOAD_FOLDER'] = UPLOAD_FOLDER
CORS(app, resources={r"/*": {"origins": "*"}})
api = Api(app)
jwt = JWT(app, authenticate, identity) # /auth
api.add_resource(LoanRequests, '/loan-requests')
if __name__ == '__main__':
    app.wsgi_app = LoggingMiddleware(app.wsgi_app)    
    app.run(port=5000, debug=True, host='0.0.0.0')

И это угловая 7 соответствующая передняя часть приложения: 


      loanRequestsGet(queryParams: {}) {
        const headers = new Headers({
          'Content-Type': 'application/json'
        });
        return this.http.post(this.httpLoanRequests,
                            queryParams,
                            {'headers': headers});
      }

Заранее спасибо всем, кто хочет мне помочь.

...