Axios Catch being called even when response is 200 (Successful)












0















I am using a Electron Vue App with Axios for my HTTP calls to my Laravel Server. Everything was perfect in Dev mode of Electron. But as soon as I build my Electron App into a install and put it on the clients computer all chaos broke out. I fix some issues but this one issue is gonna kill me.



Simply put, even though all Axios return successfully they throw an error that I put in .catch(). I'm honestly very confused how that is even possible. For instance when my program loads it makes some calls to get needed information. Throws error and displays alert. I figure it was just my Laravel Server. But the data was successfully grabbed and added to application.



axios.post(`${this.$store.state.URL}/get_server_ticket_from_table?api=${this.$store.state.API}`, {
id: this.ServerTicketMove.Server1.id,
table: this.ServerTicketMove.currentTable
})
.then((response) => {
console.log(response)

if (typeof response.data.id != 'undefined') {
this.ServerTicketMove.ticket = response.data

}

})
.catch(() => {
alert('Did not get Servers Table Information. Cant Connect to Main Server.')
})


I did some googling and saw some posts about CORS. So I went through and enabled that on my Web Server and in Laravel. That made a bigger mess. Same error but this time no data was applied to anything. So the .then() is not even being called. On top of that with CORS enabled my Axios seems to be making an additional HTTP call with the Request Method of OPTIONS. Why? I don't think CORS is the answer to my problem.



Also inside of my Electron Vue background.js I turned web security back on. Which was off because of development. Which did not change anything.



win = new BrowserWindow({
width: 275,
height: 640,
title: 'title',
// webPreferences: { webSecurity: false }
})


Does Anyone know what is happening?



EDIT - 1-14-2019



After finding the error "regeneratorRuntime is not defined" I think this is a Babel Issue. I've followed everything https://babeljs.io/docs/en/babel-polyfill/ and I still get the "regeneratorRuntime is not defined". Is there anything about Babel + Axios + Electron + Await/Sync working all together with no errors? I personally would like to not just ignore the "regeneratorRuntime is not defined" and find a solid solution for this problem if possible. Any input or things for me to research would be appreciated!










share|improve this question

























  • if CORS is the issue, you can either add 'cross origin' header to your laravel apps, or disable webSecurity. OPTIONS request are preflight request. It'll be there when webSecurity is enabled

    – Jacob Goh
    Jan 3 at 9:33











  • @JacobGoh Disabling WebSecurity again seems to have stopped the additional HTTP call. And getting rid of all the CORS settings I only got one 1 HTTP 403 error. Im running an Apache Server. Any clue on that 403 Error even though I still get the information from the server successfully? Mind you the server is hosted locally.

    – Zach C.
    Jan 4 at 6:23











  • Ok so I have made some progress finding out more about my problem. When I make an Axios call and use the Axios Errors console logs I found this error: "regeneratorRuntime is not defined"... And some googling lead me to babel-polyfill. But Still getting the error above even though its a 200 status and successfully calls the .then(). Should I try await on or in my Axios function? Also with all that in mind, is this not a Axios issue but simply a Babel Issue?

    – Zach C.
    Jan 14 at 23:49


















0















I am using a Electron Vue App with Axios for my HTTP calls to my Laravel Server. Everything was perfect in Dev mode of Electron. But as soon as I build my Electron App into a install and put it on the clients computer all chaos broke out. I fix some issues but this one issue is gonna kill me.



Simply put, even though all Axios return successfully they throw an error that I put in .catch(). I'm honestly very confused how that is even possible. For instance when my program loads it makes some calls to get needed information. Throws error and displays alert. I figure it was just my Laravel Server. But the data was successfully grabbed and added to application.



axios.post(`${this.$store.state.URL}/get_server_ticket_from_table?api=${this.$store.state.API}`, {
id: this.ServerTicketMove.Server1.id,
table: this.ServerTicketMove.currentTable
})
.then((response) => {
console.log(response)

if (typeof response.data.id != 'undefined') {
this.ServerTicketMove.ticket = response.data

}

})
.catch(() => {
alert('Did not get Servers Table Information. Cant Connect to Main Server.')
})


I did some googling and saw some posts about CORS. So I went through and enabled that on my Web Server and in Laravel. That made a bigger mess. Same error but this time no data was applied to anything. So the .then() is not even being called. On top of that with CORS enabled my Axios seems to be making an additional HTTP call with the Request Method of OPTIONS. Why? I don't think CORS is the answer to my problem.



Also inside of my Electron Vue background.js I turned web security back on. Which was off because of development. Which did not change anything.



win = new BrowserWindow({
width: 275,
height: 640,
title: 'title',
// webPreferences: { webSecurity: false }
})


Does Anyone know what is happening?



EDIT - 1-14-2019



After finding the error "regeneratorRuntime is not defined" I think this is a Babel Issue. I've followed everything https://babeljs.io/docs/en/babel-polyfill/ and I still get the "regeneratorRuntime is not defined". Is there anything about Babel + Axios + Electron + Await/Sync working all together with no errors? I personally would like to not just ignore the "regeneratorRuntime is not defined" and find a solid solution for this problem if possible. Any input or things for me to research would be appreciated!










share|improve this question

























  • if CORS is the issue, you can either add 'cross origin' header to your laravel apps, or disable webSecurity. OPTIONS request are preflight request. It'll be there when webSecurity is enabled

    – Jacob Goh
    Jan 3 at 9:33











  • @JacobGoh Disabling WebSecurity again seems to have stopped the additional HTTP call. And getting rid of all the CORS settings I only got one 1 HTTP 403 error. Im running an Apache Server. Any clue on that 403 Error even though I still get the information from the server successfully? Mind you the server is hosted locally.

    – Zach C.
    Jan 4 at 6:23











  • Ok so I have made some progress finding out more about my problem. When I make an Axios call and use the Axios Errors console logs I found this error: "regeneratorRuntime is not defined"... And some googling lead me to babel-polyfill. But Still getting the error above even though its a 200 status and successfully calls the .then(). Should I try await on or in my Axios function? Also with all that in mind, is this not a Axios issue but simply a Babel Issue?

    – Zach C.
    Jan 14 at 23:49
















0












0








0








I am using a Electron Vue App with Axios for my HTTP calls to my Laravel Server. Everything was perfect in Dev mode of Electron. But as soon as I build my Electron App into a install and put it on the clients computer all chaos broke out. I fix some issues but this one issue is gonna kill me.



Simply put, even though all Axios return successfully they throw an error that I put in .catch(). I'm honestly very confused how that is even possible. For instance when my program loads it makes some calls to get needed information. Throws error and displays alert. I figure it was just my Laravel Server. But the data was successfully grabbed and added to application.



axios.post(`${this.$store.state.URL}/get_server_ticket_from_table?api=${this.$store.state.API}`, {
id: this.ServerTicketMove.Server1.id,
table: this.ServerTicketMove.currentTable
})
.then((response) => {
console.log(response)

if (typeof response.data.id != 'undefined') {
this.ServerTicketMove.ticket = response.data

}

})
.catch(() => {
alert('Did not get Servers Table Information. Cant Connect to Main Server.')
})


I did some googling and saw some posts about CORS. So I went through and enabled that on my Web Server and in Laravel. That made a bigger mess. Same error but this time no data was applied to anything. So the .then() is not even being called. On top of that with CORS enabled my Axios seems to be making an additional HTTP call with the Request Method of OPTIONS. Why? I don't think CORS is the answer to my problem.



Also inside of my Electron Vue background.js I turned web security back on. Which was off because of development. Which did not change anything.



win = new BrowserWindow({
width: 275,
height: 640,
title: 'title',
// webPreferences: { webSecurity: false }
})


Does Anyone know what is happening?



EDIT - 1-14-2019



After finding the error "regeneratorRuntime is not defined" I think this is a Babel Issue. I've followed everything https://babeljs.io/docs/en/babel-polyfill/ and I still get the "regeneratorRuntime is not defined". Is there anything about Babel + Axios + Electron + Await/Sync working all together with no errors? I personally would like to not just ignore the "regeneratorRuntime is not defined" and find a solid solution for this problem if possible. Any input or things for me to research would be appreciated!










share|improve this question
















I am using a Electron Vue App with Axios for my HTTP calls to my Laravel Server. Everything was perfect in Dev mode of Electron. But as soon as I build my Electron App into a install and put it on the clients computer all chaos broke out. I fix some issues but this one issue is gonna kill me.



Simply put, even though all Axios return successfully they throw an error that I put in .catch(). I'm honestly very confused how that is even possible. For instance when my program loads it makes some calls to get needed information. Throws error and displays alert. I figure it was just my Laravel Server. But the data was successfully grabbed and added to application.



axios.post(`${this.$store.state.URL}/get_server_ticket_from_table?api=${this.$store.state.API}`, {
id: this.ServerTicketMove.Server1.id,
table: this.ServerTicketMove.currentTable
})
.then((response) => {
console.log(response)

if (typeof response.data.id != 'undefined') {
this.ServerTicketMove.ticket = response.data

}

})
.catch(() => {
alert('Did not get Servers Table Information. Cant Connect to Main Server.')
})


I did some googling and saw some posts about CORS. So I went through and enabled that on my Web Server and in Laravel. That made a bigger mess. Same error but this time no data was applied to anything. So the .then() is not even being called. On top of that with CORS enabled my Axios seems to be making an additional HTTP call with the Request Method of OPTIONS. Why? I don't think CORS is the answer to my problem.



Also inside of my Electron Vue background.js I turned web security back on. Which was off because of development. Which did not change anything.



win = new BrowserWindow({
width: 275,
height: 640,
title: 'title',
// webPreferences: { webSecurity: false }
})


Does Anyone know what is happening?



EDIT - 1-14-2019



After finding the error "regeneratorRuntime is not defined" I think this is a Babel Issue. I've followed everything https://babeljs.io/docs/en/babel-polyfill/ and I still get the "regeneratorRuntime is not defined". Is there anything about Babel + Axios + Electron + Await/Sync working all together with no errors? I personally would like to not just ignore the "regeneratorRuntime is not defined" and find a solid solution for this problem if possible. Any input or things for me to research would be appreciated!







vue.js electron axios babel-polyfill






share|improve this question















share|improve this question













share|improve this question




share|improve this question








edited Jan 14 at 23:57







Zach C.

















asked Jan 3 at 8:01









Zach C.Zach C.

128




128













  • if CORS is the issue, you can either add 'cross origin' header to your laravel apps, or disable webSecurity. OPTIONS request are preflight request. It'll be there when webSecurity is enabled

    – Jacob Goh
    Jan 3 at 9:33











  • @JacobGoh Disabling WebSecurity again seems to have stopped the additional HTTP call. And getting rid of all the CORS settings I only got one 1 HTTP 403 error. Im running an Apache Server. Any clue on that 403 Error even though I still get the information from the server successfully? Mind you the server is hosted locally.

    – Zach C.
    Jan 4 at 6:23











  • Ok so I have made some progress finding out more about my problem. When I make an Axios call and use the Axios Errors console logs I found this error: "regeneratorRuntime is not defined"... And some googling lead me to babel-polyfill. But Still getting the error above even though its a 200 status and successfully calls the .then(). Should I try await on or in my Axios function? Also with all that in mind, is this not a Axios issue but simply a Babel Issue?

    – Zach C.
    Jan 14 at 23:49





















  • if CORS is the issue, you can either add 'cross origin' header to your laravel apps, or disable webSecurity. OPTIONS request are preflight request. It'll be there when webSecurity is enabled

    – Jacob Goh
    Jan 3 at 9:33











  • @JacobGoh Disabling WebSecurity again seems to have stopped the additional HTTP call. And getting rid of all the CORS settings I only got one 1 HTTP 403 error. Im running an Apache Server. Any clue on that 403 Error even though I still get the information from the server successfully? Mind you the server is hosted locally.

    – Zach C.
    Jan 4 at 6:23











  • Ok so I have made some progress finding out more about my problem. When I make an Axios call and use the Axios Errors console logs I found this error: "regeneratorRuntime is not defined"... And some googling lead me to babel-polyfill. But Still getting the error above even though its a 200 status and successfully calls the .then(). Should I try await on or in my Axios function? Also with all that in mind, is this not a Axios issue but simply a Babel Issue?

    – Zach C.
    Jan 14 at 23:49



















if CORS is the issue, you can either add 'cross origin' header to your laravel apps, or disable webSecurity. OPTIONS request are preflight request. It'll be there when webSecurity is enabled

– Jacob Goh
Jan 3 at 9:33





if CORS is the issue, you can either add 'cross origin' header to your laravel apps, or disable webSecurity. OPTIONS request are preflight request. It'll be there when webSecurity is enabled

– Jacob Goh
Jan 3 at 9:33













@JacobGoh Disabling WebSecurity again seems to have stopped the additional HTTP call. And getting rid of all the CORS settings I only got one 1 HTTP 403 error. Im running an Apache Server. Any clue on that 403 Error even though I still get the information from the server successfully? Mind you the server is hosted locally.

– Zach C.
Jan 4 at 6:23





@JacobGoh Disabling WebSecurity again seems to have stopped the additional HTTP call. And getting rid of all the CORS settings I only got one 1 HTTP 403 error. Im running an Apache Server. Any clue on that 403 Error even though I still get the information from the server successfully? Mind you the server is hosted locally.

– Zach C.
Jan 4 at 6:23













Ok so I have made some progress finding out more about my problem. When I make an Axios call and use the Axios Errors console logs I found this error: "regeneratorRuntime is not defined"... And some googling lead me to babel-polyfill. But Still getting the error above even though its a 200 status and successfully calls the .then(). Should I try await on or in my Axios function? Also with all that in mind, is this not a Axios issue but simply a Babel Issue?

– Zach C.
Jan 14 at 23:49







Ok so I have made some progress finding out more about my problem. When I make an Axios call and use the Axios Errors console logs I found this error: "regeneratorRuntime is not defined"... And some googling lead me to babel-polyfill. But Still getting the error above even though its a 200 status and successfully calls the .then(). Should I try await on or in my Axios function? Also with all that in mind, is this not a Axios issue but simply a Babel Issue?

– Zach C.
Jan 14 at 23:49














1 Answer
1






active

oldest

votes


















0














After much Googling I figured out I was simply missing dependencies in my package.json. Even though they were required in node_modules folder they were not listed as a dependency in my program.



Working on my Production build of Electron + Vue + Axios + Sync/Await



npm install --save @babel/runtime 
npm install --save-dev @babel/plugin-transform-runtime


And, in .babelrc, add:



{
"presets": ["@babel/preset-env"],
"plugins": [
["@babel/transform-runtime"]
]
}


Got this code from this answer from here






share|improve this answer























    Your Answer






    StackExchange.ifUsing("editor", function () {
    StackExchange.using("externalEditor", function () {
    StackExchange.using("snippets", function () {
    StackExchange.snippets.init();
    });
    });
    }, "code-snippets");

    StackExchange.ready(function() {
    var channelOptions = {
    tags: "".split(" "),
    id: "1"
    };
    initTagRenderer("".split(" "), "".split(" "), channelOptions);

    StackExchange.using("externalEditor", function() {
    // Have to fire editor after snippets, if snippets enabled
    if (StackExchange.settings.snippets.snippetsEnabled) {
    StackExchange.using("snippets", function() {
    createEditor();
    });
    }
    else {
    createEditor();
    }
    });

    function createEditor() {
    StackExchange.prepareEditor({
    heartbeatType: 'answer',
    autoActivateHeartbeat: false,
    convertImagesToLinks: true,
    noModals: true,
    showLowRepImageUploadWarning: true,
    reputationToPostImages: 10,
    bindNavPrevention: true,
    postfix: "",
    imageUploader: {
    brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
    contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
    allowUrls: true
    },
    onDemand: true,
    discardSelector: ".discard-answer"
    ,immediatelyShowMarkdownHelp:true
    });


    }
    });














    draft saved

    draft discarded


















    StackExchange.ready(
    function () {
    StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54018400%2faxios-catch-being-called-even-when-response-is-200-successful%23new-answer', 'question_page');
    }
    );

    Post as a guest















    Required, but never shown

























    1 Answer
    1






    active

    oldest

    votes








    1 Answer
    1






    active

    oldest

    votes









    active

    oldest

    votes






    active

    oldest

    votes









    0














    After much Googling I figured out I was simply missing dependencies in my package.json. Even though they were required in node_modules folder they were not listed as a dependency in my program.



    Working on my Production build of Electron + Vue + Axios + Sync/Await



    npm install --save @babel/runtime 
    npm install --save-dev @babel/plugin-transform-runtime


    And, in .babelrc, add:



    {
    "presets": ["@babel/preset-env"],
    "plugins": [
    ["@babel/transform-runtime"]
    ]
    }


    Got this code from this answer from here






    share|improve this answer




























      0














      After much Googling I figured out I was simply missing dependencies in my package.json. Even though they were required in node_modules folder they were not listed as a dependency in my program.



      Working on my Production build of Electron + Vue + Axios + Sync/Await



      npm install --save @babel/runtime 
      npm install --save-dev @babel/plugin-transform-runtime


      And, in .babelrc, add:



      {
      "presets": ["@babel/preset-env"],
      "plugins": [
      ["@babel/transform-runtime"]
      ]
      }


      Got this code from this answer from here






      share|improve this answer


























        0












        0








        0







        After much Googling I figured out I was simply missing dependencies in my package.json. Even though they were required in node_modules folder they were not listed as a dependency in my program.



        Working on my Production build of Electron + Vue + Axios + Sync/Await



        npm install --save @babel/runtime 
        npm install --save-dev @babel/plugin-transform-runtime


        And, in .babelrc, add:



        {
        "presets": ["@babel/preset-env"],
        "plugins": [
        ["@babel/transform-runtime"]
        ]
        }


        Got this code from this answer from here






        share|improve this answer













        After much Googling I figured out I was simply missing dependencies in my package.json. Even though they were required in node_modules folder they were not listed as a dependency in my program.



        Working on my Production build of Electron + Vue + Axios + Sync/Await



        npm install --save @babel/runtime 
        npm install --save-dev @babel/plugin-transform-runtime


        And, in .babelrc, add:



        {
        "presets": ["@babel/preset-env"],
        "plugins": [
        ["@babel/transform-runtime"]
        ]
        }


        Got this code from this answer from here







        share|improve this answer












        share|improve this answer



        share|improve this answer










        answered Jan 15 at 17:10









        Zach C.Zach C.

        128




        128
































            draft saved

            draft discarded




















































            Thanks for contributing an answer to Stack Overflow!


            • Please be sure to answer the question. Provide details and share your research!

            But avoid



            • Asking for help, clarification, or responding to other answers.

            • Making statements based on opinion; back them up with references or personal experience.


            To learn more, see our tips on writing great answers.




            draft saved


            draft discarded














            StackExchange.ready(
            function () {
            StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54018400%2faxios-catch-being-called-even-when-response-is-200-successful%23new-answer', 'question_page');
            }
            );

            Post as a guest















            Required, but never shown





















































            Required, but never shown














            Required, but never shown












            Required, but never shown







            Required, but never shown

































            Required, but never shown














            Required, but never shown












            Required, but never shown







            Required, but never shown







            Popular posts from this blog

            Monofisismo

            Angular Downloading a file using contenturl with Basic Authentication

            Olmecas