如何解决无法从反应方法发送 POST 请求
我正在使用 Django 创建一个类似 FB 的应用程序并做出反应。在主页上有一个供稿,用户可以在其中创建帖子并将其发布到供稿中。
逻辑是: 用户单击帖子上的删除按钮,浏览器将 XMLHttpeRequest 发送到服务器以删除该帖子。
这是反应组件:
class Feed extends React.Component {
constructor(props){
super(props);
this.state = {
profile_pic: profile_pic_url,user: username,posts: posts_from_server,}
}
handleClick() {
const text = document.querySelector('#new_post_text').value;
if (text.length > 1) {
const data = {author: username,text: text}
// send that post to the server to save it
const csrftoken = Cookies.get('csrftoken');
const request = new XMLHttpRequest();
request.open('POST','/create_new_post',true);
request.setRequestHeader('X-CSrftoken',csrftoken);
request.setRequestHeader("Content-Type","text/plain;charset=UTF-8");
request.onload = () => {
const response = JSON.parse(request.responseText)
this.setState({
posts : [{author: response.author,author_picture: profile_pic_url,text: response.text,date: response.date},...this.state.posts]
})
document.querySelector("#new_post_text").value = '';
console.log(response)
}
request.send(JSON.stringify(data))
}
}
deletePost(post_id,author) {
const post = document.getElementById(post_id)
post.style.animationPlayState = 'running';
setTimeout(() =>{
this.setState({
posts: this.state.posts.filter(post => post.id != post_id)
})
},1000)
// delete the post from the server
const data = {'post_author': author,'id': post_id}
const csrftoken = Cookies.get('csrftoken');
const request = new XMLHttpRequest();
request.open('POST','/delete_post',true);
request.setRequestHeader('X-CSrftoken',csrftoken);
request.setRequestHeader("Content-Type","text/plain;charset=UTF-8");
request.onload = () => {
response = JSON.parse(request.responseText);
console.log(response)
}
request.send(JSON.stringify(data))
}
render() {
return (
<div>
<Post_generator
current_user={this.state.user}
picture={this.state.profile_pic}
onClick={() => this.handleClick()} />
{this.state.posts.map(post => <Post
onClick={() => this.deletePost(post.id,post.author)}
key={post.id}
post_id={post.id}
current_user={this.state.user}
user={post.author}
profile_pic={post.author_picture}
text={post.text}
date={post.date}
/>)}
</div>
)
}
}
这是 urls.py:
from django.urls import path
from . import views
urlpatterns = [
path('',views.index,name='login'),path('login',views.login_view,path('index',name='index'),path('register',views.register_view,name='register'),path('logout',views.logout_view,name='logout'),path('profile',views.profile,name='profile'),path('change_profile_pic',views.change_profile_pic,name='upload_profile_pic'),path('create_new_post',views.create_new_post,name='create_new_post'),path('<str:friend>',views.friends_profile,name='friends_profile'),path('delete_post',views.delete_post_function,name='delete_post'),]
这些是 views.py 中处理两个请求的视图:
@login_required
@require_http_methods(['POST'])
def create_new_post(request):
data = json.loads(request.body.decode("utf-8"))
print(data)
new_post = Post(author=request.user,text=data['text'])
new_post.save()
data['date']= new_post.date
return JsonResponse(data)
# delete post
@login_required
@require_http_methods(['POST'])
def delete_post_function(request):
print('sdfgdfsghdsfkgjsdklfg')
response = {"response": "data arrived to server"}
return JsonResponse(response)
给我带来麻烦的是 deletePost() 方法... 执行时,我在控制台中收到 405 错误。
有趣的是,handleClick 方法中的 XMLHTTPRequest 工作得很好
解决方法
好的,我想通了...如果 urls.py 中的 delete_post 路径不在 urlspatterns 列表的末尾,则代码有效...
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。