Я получаю ошибку ниже при попытке получить информацию из моего бэкэнда API Flask с использованием Axios.
Заблокирован перекрестный аоригин: такая же политика происхождения, не говоря уже о чтении удаленного ресурса по адресу https://453c-162-199-93-254.ngrok-fre. (Причина: учетные данные не поддерживаются, если заголовок CORS «Access-Control-Allow-Origin’ IS ‘*’)
Мой бэкэнд размещен по адресу http: // localhost: 5000, а My ReactJs Frontend размещается по адресу http: // localhost: 3000. Когда я использую бэкэнд -адрес Directhost 5000. Тем не менее, мне нужно использовать Ngrok для создания публичного адреса, который обращается к моему Localhost (потому что я хочу разместить бэкэнд на моем компьютере). Адрес NGROK доступен в другой сети и возвращает пользователя: несанкционированный .
[*] Когда я использую адрес ngrok (например, https://453c-162-199-93-254.ngrok free.app). использования экземпляра (axios.create от httpclient). Я предполагаю, что мне нужно использовать с Credentials, потому что у меня есть регистрация и вход (если нет другого пути?). Я также попытался добавить axios.defaults.withcredentials = true перед созданием экземпляра.
[*] Я пытался добавить происхождение при выполнении Cors (App, Origins = [http: // localhost: 3000]) .
Я попытался добавить @cross_oris_origins (Origins = [... ... ... ... ... .... /> < /ol>
my app.py code: < /p>
from flask import Flask, request, abort, jsonify, session
from flask_bcrypt import Bcrypt
from flask_session import Session
from flask_cors import CORS, cross_origin
from config import ApplicationConfig
from models import db, User
app = Flask(__name__)
app.config.from_object(ApplicationConfig)
bcrypt = Bcrypt(app)
CORS(app, supports_credentials=True, origins=[
"http://localhost:3000",
"http://localhost:5000",
"https://453c-162-199-93-254.ngrok-free.app",
])
server_session = Session(app)
db.init_app(app)
with app.app_context():
db.create_all()
@app.route("/@me")
def get_current_user():
user_id = session.get("user_id")
if not user_id:
return jsonify({"error": "User unauthorized."}), 401
user = User.query.filter_by(id = user_id).first()
if user is None:
return jsonify({"error": "User not found."}), 404
return jsonify({
"id": user.id,
"email": user.email,
"first_name": user.first_name,
"last_name": user.last_name,
"phone_number": user.phone_number,
"grade": user.grade,
"school": user.school
})
@app.route("/registration", methods=["POST"])
def register_user():
email = request.json["email"]
password = request.json["password"]
first_name = request.json["firstName"]
last_name = request.json["lastName"]
phone_number = request.json["phone"]
grade = request.json["grade"]
school = request.json["school"]
user_exists = User.query.filter_by(email = email).first() is not None
if user_exists:
return jsonify({"error": "User already exists."}), 409
hashed_password = bcrypt.generate_password_hash(password)
new_user = User(email = email, password = hashed_password, first_name = first_name, last_name = last_name, phone_number = phone_number, grade = grade, school = school)
db.session.add(new_user)
db.session.commit()
session["user_id"] = new_user.id
return jsonify({
"id": new_user.id,
"email": new_user.email,
"first_name": new_user.first_name,
"last_name": new_user.last_name,
"phone_number": new_user.phone_number,
"grade": new_user.grade,
"school": new_user.school
})
@app.route("/remove-user", methods=["POST"])
def remove_user():
user_id = request.json["user_id"]
if not user_id:
return jsonify({"error": "User ID not found."}), 404
user = User.query.filter_by(id=user_id).first()
if user:
db.session.delete(user)
db.session.commit()
return jsonify({"message": "User removed successfully."}), 200
@app.route("/login", methods=["POST"])
def login_user():
email = request.json["email"]
password = request.json["password"]
user = User.query.filter_by(email = email).first()
if user is None:
return jsonify({"error": "User unauthorized."}), 401
if not bcrypt.check_password_hash(user.password, password):
return jsonify({"error": "User unauthorized."}), 401
session["user_id"] = user.id
return jsonify({
"id": user.id,
"email": user.email,
})
@app.route("/logout", methods=["POST"])
def logout_user():
session.pop("user_id")
return "200"
if __name__ == "__main__":
app.run(debug = True)
< /code>
my httpclient.js код: < /p>
import axios from "axios";
axios.defaults.withCredentials = true;
export default axios.create({
withCredentials: true,
});
< /code>
my app.js code: < /p>
import "./App.css";
import "./styles/Fonts.css";
import Navbar from "./components/Navbar.js";
import Footer from "./components/Footer.js";
import Home from "./pages/Home";
import Timeline from "./pages/Timeline";
import Registration from "./pages/Registration";
import Submission from "./pages/Submission";
import Contact from "./pages/Contact";
import About from "./pages/About";
import Login from "./pages/Login";
import Profile from "./pages/Profile";
import React, { useState, useEffect } from "react";
import httpClient from "./util/httpClient.js";
import styled from "styled-components";
import { HashRouter as Router, Route, Routes } from "react-router-dom";
import backendLink from "./util/backendLink.js";
import axios from "axios";
axios.defaults.withCredentials = true;
const AppStyle = styled.div`
text-align: center;
font-family: "Regular";
`;
function App() {
const [user, setUser] = useState(null);
useEffect(() => {
(async () => {
try {
const resp = await httpClient.get(`${backendLink}/@me`, {
withCredentials: true,
});
setUser(resp.data);
} catch (error) {
console.log("Unauthenticated");
}
})();
}, []);
return (
{user != null ? (
) : (
)}
{/* TODO: add 404 not found page, fix fade out animation for alerts */}
);
}
export default App;
< /code>
my config.py code: < /p>
from dotenv import load_dotenv
import os
import redis
load_dotenv()
class ApplicationConfig:
SECRET_KEY = os.environ["SECRET_KEY"]
SQLALCHEMY_TRACK_MODIFICATIONS = False
SQLALCHEMY_ECHO = True
SQLALCHEMY_DATABASE_URI = r"sqlite:///./db.sqlite"
SESSION_TYPE = "redis"
SESSION_PERMANENT = False
SESSION_USE_SIGNER = True
SESSION_REDIS = redis.from_url("redis://127.0.0.1:6379")
SESSION_COOKIE_SAMESITE = "None"
SESSION_COOKIE_SECURE = True
Подробнее здесь: https://stackoverflow.com/questions/796 ... se-of-with
Заголовок CORS 'Access-Control-Allow-Origin'-это «*» (проблема может быть из-за Credentials: True) ⇐ Python
-
- Похожие темы
- Ответы
- Просмотры
- Последнее сообщение