In Vue.js 2 I"m making an ajax call with axios. It's all working fine. However when I go one page further and then go back to the page where the ajax call is made, the ajax call suddenly returns html so no json objects.
What could be going on here? When I test the url in postman I receive json back as wel?
My back-end is made with laravel 5.5.
Html response:
<!DOCTYPE html>\n<!--[if IEMobile]><html class=\"no-js iemobile\" lang=\"nl\"><![endif]-->\n<!--[if lt IE 7 ]><html class=\"no-js ie6\" lang=\"nl\"><![endif]-->\n<!--[if IE 7 ]><html class=\"no-js ie7\" lang=\"nl\"><![endif]-->\n<!--[if IE 8 ]><html class=\"no-js ie8\" lang=\"nl\"><![endif]-->\n<!--[if IE 9 ]><html class=\"no-js ie9\" lang=\"nl\"><![endif]-->\n<!--[if (gte IE 9)|!(IE)]><!--><html class=\"no-js\" lang=\"nl\"><!--<![endif]-->\n<head>\n\t<!-- Google Tag Manager -->\n<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':\n new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],\n j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=\n 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);\n })(window,document,'script','dataLayer','GTM-TP9MVZN');</script>\n<!-- End Google Tag Manager -->\n <meta data-required=\"true\" http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\"/>\n\n<title>Televisies </title>\n\n<meta d…", status: 200, statusText: "OK", headers: {…}, config: {…}, request: XMLHttpRequest }
Vue.js code looks like this:
Axios.get(url, { params: params }).then((response) => {
console.log(response);
});
In my app.js file I set the header like this:
Axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
Thanks
