code

플라스크를 사용하여 오리진 간 자원 공유 해결

starcafe 2023. 3. 9. 22:12
반응형

플라스크를 사용하여 오리진 간 자원 공유 해결

하하 the ajax「」의 Flask(플라스크에 있는 Ajax에서 게시된 데이터를 어떻게 사용할 수 있습니까?)

$.ajax({
    url: "http://127.0.0.1:5000/foo", 
    type: "POST",
    contentType: "application/json",
    data: JSON.stringify({'inputVar': 1}),
    success: function( data ) { 
        alert( "success" + data );
    }   
});

에러가 표시된다.

No 'Access-Control-Allow-Origin' header is present on the requested resource. 
Origin 'null' is therefore not allowed access. 
The response had HTTP status code 500.

다음 두 가지 방법으로 해결하려고 했지만, 효과가 없는 것 같습니다.

  1. 플라스크-CORS 사용

은 거는입니다.Flask「」를 처리하기 CORS에이잭스

pythonServer.py에서는 다음 솔루션을 사용하고 있습니다.

from flask import Flask
from flask.ext.cors import CORS, cross_origin

app = Flask(__name__)
cors = CORS(app, resources={r"/foo": {"origins": "*"}})
app.config['CORS_HEADERS'] = 'Content-Type'

@app.route('/foo', methods=['POST','OPTIONS'])
@cross_origin(origin='*',headers=['Content-Type','Authorization'])
def foo():
    return request.json['inputVar']

if __name__ == '__main__':
    app.run()
  1. 특정 플라스크 데코레이터 사용

이것은 데코레이터를 정의하는 공식 플라스크 코드 조각입니다.CORS을 사용하다

pythonServer.py에서는 다음 솔루션을 사용하고 있습니다.

from flask import Flask, make_response, request, current_app
from datetime import timedelta
from functools import update_wrapper

app = Flask(__name__)

def crossdomain(origin=None, methods=None, headers=None,
                max_age=21600, attach_to_all=True,
                automatic_options=True):
    if methods is not None:
        methods = ', '.join(sorted(x.upper() for x in methods))
    if headers is not None and not isinstance(headers, basestring):
        headers = ', '.join(x.upper() for x in headers)
    if not isinstance(origin, basestring):
        origin = ', '.join(origin)
    if isinstance(max_age, timedelta):
        max_age = max_age.total_seconds()

    def get_methods():
        if methods is not None:
            return methods

        options_resp = current_app.make_default_options_response()
        return options_resp.headers['allow']

    def decorator(f):
        def wrapped_function(*args, **kwargs):
            if automatic_options and request.method == 'OPTIONS':
                resp = current_app.make_default_options_response()
            else:
                resp = make_response(f(*args, **kwargs))
            if not attach_to_all and request.method != 'OPTIONS':
                return resp

            h = resp.headers

            h['Access-Control-Allow-Origin'] = origin
            h['Access-Control-Allow-Methods'] = get_methods()
            h['Access-Control-Max-Age'] = str(max_age)
            if headers is not None:
                h['Access-Control-Allow-Headers'] = headers
            return resp

        f.provide_automatic_options = False
        return update_wrapper(wrapped_function, f)
    return decorator

@app.route('/foo', methods=['GET','POST','OPTIONS'])
@crossdomain(origin="*")
def foo():
    return request.json['inputVar']

if __name__ == '__main__':
    app.run()

왜 그런지 좀 알려주시겠어요?

다음과 같은 간단한 방법으로 결과를 얻을 수 있습니다.

@app.route('your route', methods=['GET'])
def yourMethod(params):
    response = flask.jsonify({'some': 'data'})
    response.headers.add('Access-Control-Allow-Origin', '*')
    return response

나도 같은 문제에 직면했어이 페이지에 액세스 할 가능성이 있는 신규 유저의 경우.공식 문서를 따르기만 하면 됩니다.

플라스크 코어 설치

pip install -U flask-cors

후 앱 후 초기화합니다.flask-cors다음 중 하나:

from flask import Flask
from flask_cors import CORS

app = Flask(__name__)
CORS(app)

@app.route("/")
def helloWorld():
   return "Hello, cross-origin-world!"

챔피언처럼 작동했어 코드를 조금 수정한 후에

# initialization
app = Flask(__name__)
app.config['SECRET_KEY'] = 'the quick brown fox jumps over the lazy   dog'
app.config['CORS_HEADERS'] = 'Content-Type'

cors = CORS(app, resources={r"/foo": {"origins": "http://localhost:port"}})

@app.route('/foo', methods=['POST'])
@cross_origin(origin='localhost',headers=['Content- Type','Authorization'])
def foo():
    return request.json['inputVar']

if __name__ == '__main__':
   app.run()

*를 localhost로 대체했습니다.많은 블로그나 투고에서 읽었듯이 특정 도메인에 대한 접근을 허용해야 합니다.

이게 답이 되는 게 낫지오늘도 같은 문제가 발생했는데 생각보다 문제가 되지 않았습니다.CORS 기능을 추가한 후 Flask 서버를 재시작해야 합니다.ctrl + c->python manage.py runserver또는 어떤 방법을 사용하든)를 사용하여 변경을 유효하게 합니다.코드가 올바른 경우에도 마찬가지입니다.그렇지 않으면 활성화인스턴스에서는 CORS가 동작하지 않습니다.

이 기능은 다음과 같습니다(Python 3.6.1, Flask 0.12).

팩토리py:

from flask import Flask
from flask_cors import CORS  # This is the magic


def create_app(register_stuffs=True):
    """Configure the app and views"""
    app = Flask(__name__)
    CORS(app)  # This makes the CORS feature cover all routes in the app

    if register_stuffs:
        register_views(app)
    return app


def register_views(app):
    """Setup the base routes for various features."""
    from backend.apps.api.views import ApiView
    ApiView.register(app, route_base="/api/v1.0/")

views.py:

from flask import jsonify
from flask_classy import FlaskView, route


class ApiView(FlaskView):
    @route("/", methods=["GET"])
    def index(self):
        return "API v1.0"

    @route("/stuff", methods=["GET", "POST"])
    def news(self):
        return jsonify({
            "stuff": "Here be stuff"
        })

내 React 앱 콘솔.log에서 다음을 수행합니다.

Sending request:
GET /stuff
With parameters:
null
bundle.js:17316 Received data from Api:
{"stuff": "Here be stuff"}

이 질문에는 늦을지도 모르지만, 이하의 순서로 문제를 해결합니다.

from flask import Flask
from flask_cors import CORS

app = Flask(__name__)
CORS(app)

「 」를에 주의해 .Access-Control-Allow-Origin플라스크 응답 객체의 헤더는 대부분의 경우 정상이지만(이것처럼), 정적 자산을 제공할 때는(적어도 생산 설정에서는) 아무런 영향을 미치지 않습니다.이는 정적 자산이 전면 웹 서버(보통 Nginx 또는 Apache)에 의해 직접 제공되기 때문입니다.따라서 이 경우 응답 헤더를 Flask가 아닌 Web 서버 레벨로 설정해야 합니다.

상세한 것에 대하여는, 얼마전에 쓴 이 기사를 참조해 주세요.헤더를 설정하는 방법을 설명합니다(내 경우는, Font Awesome 자산의 크로스 도메인 서비스를 하려고 하고 있었습니다).

또한 @Satu가 말했듯이 JS AJAX 요청의 경우 특정 도메인에 대해서만 액세스를 허용해야 할 수 있습니다.정적 자산(글꼴 파일 등)을 요구할 경우 규칙이 덜 엄격하고 임의의 도메인에 대한 접근을 허용하는 것이 더 허용된다고 생각합니다.

주의: cross_origin의 배치가 올바르고 의존관계가 설치되어 있어야 합니다.클라이언트측에서는, 사용하고 있는 데이터의 종류를 지정합니다.예를 들어 application/json 또는 text/html 입니다.

나는 아래 적힌 코드가 마법을 부렸다.

from flask import Flask,request,jsonify
from flask_cors import CORS,cross_origin
app=Flask(__name__)
CORS(app, support_credentials=True)
@app.route('/api/test', methods=['POST', 'GET','OPTIONS'])
@cross_origin(supports_credentials=True)
def index():
    if(request.method=='POST'):
     some_json=request.get_json()
     return jsonify({"key":some_json})
    else:
        return jsonify({"GET":"GET"})


if __name__=="__main__":
    app.run(host='0.0.0.0', port=5000)

Armin Ronacher가 준 데코레이터를 (클라이언트가 요구하는 헤더가 다르기 때문에) 조금 수정하지 않고 사용했습니다.그리고 그게 나한테 효과가 있었어.(어플리케이션/json 타입을 의뢰하는 의뢰자로서 angular를 사용하고 있습니다.

코드는 아래 부분에서 약간 수정되어 있습니다.

from flask import jsonify

@app.route('/my_service', methods=['POST', 'GET','OPTIONS'])
@crossdomain(origin='*',headers=['access-control-allow-origin','Content-Type'])
def my_service():
    return jsonify(foo='cross domain ftw')

jsonify는 어플리케이션/json 타입을 전송합니다.그렇지 않으면 텍스트나 텍스트가 됩니다.헤더가 클라이언트로 추가되어 있습니다.

 const httpOptions = {
      headers: new HttpHeaders({
        'Content-Type': 'application/json',
        'Access-Control-Allow-Origin':'*'
      })
    };
    return this.http.post<any>(url, item,httpOptions)

비행 전 요청에 문제가 있는 것 같습니다.@route @patch @delete decorators를 사용하는 경우 OPTIONS 요청에 대한 자동 응답을 비활성화하는 효과적인 방법은 없는 것 같습니다.제 회피책은 API 시작 부분(장식된 기능 전)입니다.

def option_todo(id): 
  return '', 204 
 
app.add_url_rule('/', view_func=option_todo, provide_automatic_options=False, methods=['OPTIONS']) 
app.add_url_rule(r'/<path:path>', view_func=option_todo, provide_automatic_options=False, methods=['OPTIONS']) 

@app.after_request
def after_request(response):
  response.headers['Access-Control-Allow-Methods']='*'
  response.headers['Access-Control-Allow-Origin']='*'
  response.headers['Vary']='Origin'
  return response

이것은 이미 꽤 오래되고 잘 알려진 질문이지만, 가장 간단한 해결책이라고 생각되는 것을 제안하고 싶습니다.

@app.after_request
def after_request(response: Response) -> Response:
    response.access_control_allow_origin = "*"
    return response

오늘 이 문제가 발생했는데, 어떤 답변도 효과가 없었습니다.

가 설 i i설니를 했다.cross_origin()데코레이터는 다음과 같습니다.

@app.route('/', methods = ['POST'])
@cross_origin()
def index():

그리고 나서 나는 했다:

  1. IDE에서 Flask Python 파일을 엽니다.
  2. 파일을 마우스 오른쪽 버튼으로 클릭합니다.
  3. 클릭: 터미널에서 Python 파일 실행

나에게 문제는 플라스크 파이썬 파일을 실행시키는 것이었습니다.CTRL+ALT+NVSCode "실행 코드" 플라스크CORS를 사용하다

나의 ★★★★★★★★★★★★★★★★★★★.print()는 항상 표시되지 않기 때문에 디버깅도 어려웠습니다.는 이 via via via에서 으로써 발생하였습니다.CTRL+ALT+NVSCode는 TERMINAL 창이 아닌 OUTPUT 창에 초점을 맞춥니다.

또한.print()출력 창에 나타난 s는 TERMINAL 창과 같은 이모티콘을 지원하지 않습니다.그래서 내 앱은 내가 모든 것을 알아낼 때까지 가장 오랫동안 다운되었다.

하지만 내 입장에서는 바보 같은 실수였어, 더 잘 알았어야 했어.이것이 다른 사람들에게 도움이 되길 바랍니다!

비행 전 문제였는데 앱에 추가해야 했어요.화이

...

@app.after_request
def after_request(response: Response) -> Response:
    response.access_control_allow_credentials = True
    return response

제가 고친 건

@app.after_request
def handle_options(response):
    response.headers["Access-Control-Allow-Origin"] = "*"
    response.headers["Access-Control-Allow-Methods"] = "GET, POST, PUT, DELETE, OPTIONS"
    response.headers["Access-Control-Allow-Headers"] = "Content-Type, X-Requested-With"

    return response

저는 비슷한 걸로 많이 고생했어요.다음을 시도해 보십시오.

  1. HTML 헤더를 표시할 수 있는 일종의 브라우저 플러그인을 사용합니다.
  2. 서비스의 URL 을 입력하고 반환된 헤더 값을 표시합니다.
  3. Access-Control-Allow-Origin이 1개의 도메인으로 설정되어 있는지 확인합니다.도메인은 요청 발신기지여야 합니다.Access-Control-Allow-Origin을 *로 설정하지 마십시오.

이것이 도움이 되지 않는 경우는, 이 기사를 봐 주세요.PHP에 있지만 CORS가 작동하기 위해 어떤 헤더를 설정해야 하는지 정확히 설명합니다.

IE, Firefox, Chrome 및 Safari에서 작동하는 CORS

언급URL : https://stackoverflow.com/questions/26980713/solve-cross-origin-resource-sharing-with-flask

반응형

'code' 카테고리의 다른 글

TypeScript 코멘트의 구문은 어디에 기재되어 있습니까?  (0) 2023.03.09
AngularJs에서 개인 메서드를 사용하여 테스트 가능한 컨트롤러를 작성하는 방법은 무엇입니까?  (0) 2023.03.09
ReactJ에서는 동기 호출 시 setState가 다르게 동작하는 이유는 무엇입니까?  (0) 2023.03.04
AngularJS HTML을 동적으로 추가하고 컨트롤러에 바인드하는 방법  (0) 2023.03.04
스프링 테스트 및 보안:인증을 모의하는 방법  (0) 2023.03.04

'code'의 다른글

  • 현재글플라스크를 사용하여 오리진 간 자원 공유 해결

관련글

댓글

티스토리툴바