axios.post
(下面的代码)必须将数据发送到url api/add-todo
,但我得到了以下错误:
axios.post('http://localhost/vueoctober/todo/api/add-todo', todo).then(function (response) {
console.log(response);
}).catch(function(error) {
console.log(error);
});
路径api/add-todo
是用十月方法Route::get()
(https://octobercms.com/docs/services/router)处理的,为什么找不到?
如果我将axios.post
更改为axios.get
,它将工作!但我需要后数据,而不是获取。
我尝试的是:
1)我尝试将这些头文件添加到.htaccess:
Header add Access-Control-Allow-Origin "*"
Header add Access-Control-Allow-Headers "origin, x-requested-with, content-type"
Header add Access-Control-Allow-Methods "PUT, GET, POST, DELETE, OPTION"
它只对axios.get
起作用。axios.post
仍然阻塞。
2)我在httpd. conf中添加了Header set Access-Control-Allow-Origin "*"
。
Vue应用程序在端口8080上提供服务,因此axios.post URL不能是相对。
5条答案
按热度按时间vs3odd8k1#
我在FF上也遇到过这样的问题,尽管我在.htaccess中有这样的内容:
Header set Access-Control-Allow-Methods "PUT, GET, POST, DELETE, OPTIONS"
.经过更多的搜索,我找到了一个由@marcomessa的Gist,解决了我的问题。
https://gist.github.com/marcomessa/54d077a0208439f5340126ff629a3718
ncgqoxb02#
请仔细查看错误消息,它指出预检请求的响应没有HTTP ok状态。
显然,服务器端代码没有OPTIONS请求的路由处理程序,因此需要添加一个。
顺便说一句,在浏览器获得一个成功的OPTIONS响应后,它将发出POST请求,但您说:
路由api/add-todo是用October方法Route::get()处理的
您将需要使用
Route::post()
来处理此问题。xzlaal3s3#
为了澄清这一点,总是有很多方法来回答一个问题。下面是我对我的问题所做的。Check this for Preflight Request。预检请求是由浏览器创建的,并不是为了安全。我首先创建的这个函数将在请求时抛出一个ok消息,那么如果数据包含任何数据,它将执行所谓的操作(这是你检查安全性的地方)。我不需要弄乱.htaccess文件。虽然我确实安装了CORS插件,因为它是一个很好的插件。还有来自watch-了解作者是做一个跨源请求,他在如何纠正问题。我认为他只是拍摄的视频之前,预检请求开始成为一个浏览器的规范。找到路由信息在这里。
xkrw2x1b4#
我不能通过axios解决它,我浪费了很多时间,但我很容易通过这种方式解决它。
假设我们正在发布:
我执行了下一个函数来发送最后一个JSON(任何JSON结构都适用):
你可以调用这个函数,它需要改变“uri”变量的值,并且需要使用JSON.stringify来发送数据。
在PHP中,API对于傻瓜来说也非常简单:
我希望它能帮助你,任何问题都是允许的,如果我有答案,我会很高兴地帮助。