#python-3.x #reactjs #google-app-engine #flask #async-await
#python-3.x #reactjs #google-app-engine #flask #асинхронное ожидание
Вопрос:
При попытке отправить данные для входа в серверную часть я получаю это сообщение об ошибке в консоли: Неперехваченный (в) Promise Ошибка синтаксиса: неожиданный токен < в JSON в позиции 0 asyncToGenerator.js Пожалуйста, смотрите изображение журнала ошибок.
Интересно, что эта ошибка возникает даже перед операцией fetch . Объект, который вы видите перед ошибкой, является результатом инструкции console.log() непосредственно перед вызовом выборки. Отправленный объект, который отправляется с помощью выборки, создается следующим образом:
const handleSubmit = async (e) => {
e.preventDefault();
const userObj = {
method: 'POST',
cache: 'no-cache',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json'
},
body: JSON.stringify({username: username, password: password})
}
const result = await Auth.login(userObj);
if (result){
window.location.reload();
} else {
setAlert(true);
}
};
Функция Auth.login() выглядит следующим образом:
const login =async (postObj) => {
console.log(postObj);
const response = await fetch('/auth/login', postObj);
const data = await response.json();
if(data.loggedin){
Cookies.set('user', data.user);
Cookies.set('isAuthenticated', true);
}
return data.loggedin;
};
Извините за несоответствие в именовании, postObj и userObj одинаковы. Перед развертыванием все работает, но как только я его создаю и развертываю, он показывает ошибку синтаксиса в функции, которую я даже не писал.
Серверная функция в /auth/login выглядит следующим образом:
@app.route('/auth/login', methods=['GET', 'POST'])
def login():
print("reached /auth/login")
username = request.json.get('username')
password = request.json.get('password')
loggedin=False; userObj = {}
if verify_password(username, password):
login_user(g.user)
loggedin =True
userObj ={"uid":g.user.id, "username": g.user.username, "email": g.user.email}
return jsonify({"loggedin":loggedin, "user":userObj})
Предлагайте какие-либо решения, спасибо!
PS
Я изолировал ошибку, используя инструкции отладки повсюду. Я могу с уверенностью сказать вам, что эта ошибка возникает еще до того, как интерфейсу удается достичь /auth/login, серверной части. Ошибки возникают только при выборке, и я уверен, что это даже не повторный запуск первой строки функции в серверной части. Я уверен, потому что я не вижу этот путь в журналах, и при этом оператор печати в первой строке функции /auth/login не печатается.
Комментарии:
1. неожиданный токен в JSON
<обычно означает, что какой-то запрос для JSON получает HTML … проверьте консоль инструментов разработчика, чтобы узнать, что сервер отправляет вместо JSON для некоторого запроса (скорее всего, он будет иметь статус 404)2. вы действительно должны проверить
if (response.ok)свою выборку…3.
fetchтакже может возвращать отклонение обещания при сетевых ошибках и отмененных запросах, которые, похоже, плохо обрабатываются вашим кодом, т. Е. неперехваченная ошибка, которая у вас есть в настоящее время.4. @Jaromanda X, интерфейс react не проходит через вызов fetch. Если вы проверите изображение на наличие журнала ошибок, я напечатал объект post, и это просто объект json. Я не понимаю, как можно где-то вводить html.
5. Я считаю, что ошибка исходит от вашего серверной части. можете ли вы опубликовать, что делает ‘/ auth / login’?
Ответ №1:
В developmet установка прокси-переменной в package.json работает, но это приводит к сбою в работе. Я не знал об этом и, следовательно, о вышеупомянутой ошибке, интерфейс искал путь «/auth / login» в своем собственном каталоге (добавляя /auth / login к своему собственному URL), и это возвращает html, поскольку страница не существует. Одним из способов решения этой проблемы является использование всего URL-адреса в вызовах выборки или файле setup .env, который содержит переменные среды, которые затем можно использовать в вызове выборки.
ссылка — https://medium.com/better-programming/using-environment-variables-in-reactjs-9ad9c5322408