Axios-module: Axios with nuxt property decorator Always Send OPTIONS method

Created on 24 Aug 2018  路  10Comments  路  Source: nuxt-community/axios-module

when i send POST method it always send OPTIONS why it is ? i already tried alot of things like

      proxyHeaders: false,
      credentials: false 

> 
> OPTIONS /app/security/login-processing HTTP/1.1
> Host: localhost:8080
> Connection: keep-alive
> Pragma: no-cache
> Cache-Control: no-cache
> Access-Control-Request-Method: POST
> Origin: http://localhost:3000
> User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/68.0.3440.106 Safari/537.36
> Accept: */*
> Accept-Encoding: gzip, deflate, br
> Accept-Language: en-US,en;q=0.9
> 

This question is available on Nuxt community (#c157)
question

Most helpful comment

Hi. Sorry, I was not able to respond fast. Actually, this is browser that makes Two requests One Options for preflight and secondly the real request. If you have CORS problems with slack I would recommend enabling proxy mode.

{
  axios: { proxy: true },
  proxy: {
    '/services': 'https://hooks.slack.com/services'
  }

Then simply making requests to the same domain:

this.$axios.$post('/services/...', data)

All 10 comments

This issue as been imported as question since it does not respect axios-module issue template. Only bug reports and feature requests stays open to reduce maintainers workload.
If your issue is not a question, please mention the repo admin or moderator to change its type and it will be re-opened automatically.
Your question is available at https://cmty.app/nuxt/axios-module/issues/c157.

@pi0

Same thing for me... Unable to make a POST request to the slack API.

this.$axios.$post('https://hooks.slack.com/services/...', JSON.stringify(data))
.then(response => {
   //
})
.catch(error => {
   //
})

The method is always OPTIONS instead of POST

Hi. Sorry, I was not able to respond fast. Actually, this is browser that makes Two requests One Options for preflight and secondly the real request. If you have CORS problems with slack I would recommend enabling proxy mode.

{
  axios: { proxy: true },
  proxy: {
    '/services': 'https://hooks.slack.com/services'
  }

Then simply making requests to the same domain:

this.$axios.$post('/services/...', data)

thanks for the reply @pi0 but i already resolve this one thanks.. 馃挴

hi @Try-Parser

How did you solve this problem?
Thanks

@gomezmark it is usually sending two request The first is OPTIONS to test and if the first request is successfull then it will send the second request its actually it is the behavior of the cors preflight so you need to add the OPTIONS or Support some HTTP verbs in your API and if your using some custom headers you need to add those also in your global cors in server side

@Try-Parser
Great thanks!
But it only occurs on IE and Mozilla.
Anyways, it is now working on my end.
Thanks!

@gomezmark happy to help

I had this exact same problem with a route on my API that ended with links, e.g. /api/quick-links. I don't know why, but every API route I tried that ended with links would send the OPTIONS request. Changing the route to end with linkz (or anything else) fixed the problem. I don't know if this was a problem with Nuxt, Axios, or my API.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

simllll picture simllll  路  6Comments

seanwash picture seanwash  路  6Comments

mclighter picture mclighter  路  3Comments

cawa-93 picture cawa-93  路  4Comments

tebaly picture tebaly  路  3Comments