我正在开发一个带有 Flask 后端和 React 前端的多用户应用程序。直到一天前,我才有了一个用于基本 CRUD 应用程序的工作 API,包括使用 JWT 进行身份验证。今天,我正在测试该应用程序以确保其正常工作,当我单击网站上的“生成帐户”按钮时,我在控制台中收到了 403 禁止错误。
Flask 后端控制台不显示消息,所以我知道请求没有到达后端,因此这不是服务器端问题。这是名为GenerateAccountModal.js 的前端文件中的代码
function generateAccount(event) {
var account = {
username: username,
password: password,
dob: dob,
city: city,
sex: sex,
firstname: firstName,
lastname: lastName
}
const config = {
method: 'post',
url: '/generate',
data: account,
headers: {
'Content-Type': 'multipart/form-data',
}
};
function addMessage(result) {
dispatch(messageAdded(result))
}
console.log(account)
axios(config)
.then((response) => {
let result = response.data.userMessage
addMessage(result)
},
(error) => {
addMessage(error.response.data.error)
});
event.preventDefault()
toggleClose()
}
再次,我非常有信心我的代码没有任何问题。我在后端启用了跨源资源。就在一天前,代码还可以正常工作,我没有理由相信它今天不起作用。
我认为发生的唯一问题是,我很早就连接到了 VPN 服务,并且实际上使用 VPN 运行了我的应用程序。当我意识到我仍在使用 VPN 时,我就断开了连接,但我无法解决问题。该问题的唯一例外是当我将 localhost:5000 添加到 url 时。在这种情况下,我遇到了一个不同的问题: 在控制台上它指出,“未捕获(承诺)类型错误:无法读取未定义的属性(读取'数据') 在GenerateAccountModal.js:48:1“
代理是 package-json 设置为 localhost:5000
所以我不确定问题是什么。我尝试更改终端中的权限以读取和写入所有各方。无效的缓存。我认为我的代码是正确的,但有可能我在不久的过去稍微改变了它,现在它不起作用了。
请帮忙提供任何建议。
描述有关 .
的情况我已经找到了这个问题的解决方案。这里实际上有两个问题。第一个是我的 Macbook Air 上的 Airtunes 在端口 5000 上启用。这使得我的目标服务器完全错误,它返回 403。解决方案是转到系统首选项、共享,然后禁用 Airtunes,或Airplay。
其次,代理以与前端客户端相同的端口号存储在缓存中。因此,您要做的是删除 package-lock-json,然后在 IDE 中使缓存无效并重新启动,或者只是重新启动。运行 npm start,即使没有重新安装 package lock json。我必须继续完成我的项目,看看是否需要在某个时候重新安装它。
我的代码毕竟没有任何问题,这是对的。