使用axios请求本地数据失败

解决axios请求本地的json文件在打包后路径出错问题

vue 项目中使用axios请求了本地项目的static文件夹下的json文件,使用npm run build 打包后,在Hbuilder编辑器打开,页面报错404: 在浏览器打开的路径 http://127.0.0.1:8020/poverty/dist/index.html 我们可以看到index.html前面还有两个文件层级,也就是说json文件的路径已经发生变化,而不是原来开发环境下的路径了. 下面我们使用 http-server来解决这个问题: dell@DESKTOP-KD0EJ4H

vue脚手架用axios请求本地数据

首先需要声明的是:本地请求,不用考虑跨域问题,这适用刚入坑的前端小白看,小白在做自己的项目时,通常都是用自己写的json数据,之后用axios请求过来,渲染到页面上. 1.cnpm install axios --save (在终端安装上axios,我是用的淘宝镜像安装的) 2.哪个组件使用axios方法请求数据,就在哪个组件里面引入,不用在main.js里面引入,不用改原型链在组件的script标签内写: import axios from ‘axios’ 3.在组件的m

ajax和axios请求本地json数据对比

AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术,通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新. ajax请求本地json test.json { "first":[ {"name":"王小婷","nick":"祈澈菇凉"}, {"name":"安安",&q

VUE请求本地数据的配置json-server

VUE开发请求本地数据的配置,早期的vue-lic下面有dev-server.js和dev-client.js两文件,请求本地数据在dev-server.js里配置,最新的vue-webpack-template 中已经去掉了dev-server.js和dev-client.js 改用webpack.dev.conf.js代替,所以配置本地访问在webpack.dev.conf.js里配置即可.同时更新了config/index.js开发模式dev下几个配置: autoOpenBrowser:

VUE开发请求本地数据的配置，旧版本dev-server.js，新版本webpack.dev.conf.js

VUE开发请求本地数据的配置,早期的vue-lic下面有dev-server.js和dev-client.js两文件,请求本地数据在dev-server.js里配置,最新的vue-webpack-template 中已经去掉了dev-server.js和dev-client.js 改用webpack.dev.conf.js代替,所以配置本地访问在webpack.dev.conf.js里配置即可.同时更新了config/index.js开发模式dev下几个配置: autoOpenBrowser:

axios请求本地的json文件在打包部署到子目录域名下，路径找不到

前言: 因为要同时部署两个项目,有一个是部署到域名下面的子目录下,如:https://xxx.com/siot-admin vue 项目中使用axios请求了本地项目的static文件夹下的json文件,使用npm run build 打包后,json文件请求不到报404: 解决办法: Vue-cli打包后部署到子目录下路径问题举例,若需要部署到www.***.com/catalog1/catalog2/下,需要更改 config/index.js文件中,build下assetsPublicP

vue模拟后台数据，请求本地数据的配置（旧版本dev-server.js，新版本webpack.dev.conf.js）

最近学习一个vue-cli的项目,需要与后台进行数据交互,这里使用本地json数据来模仿后台数据交互流程.然而发现build文件夹下没有dev-server.js文件了,因为新版本的vue-webpack-template 中已经去掉了dev-server.js,取而代之的是webpack.dev.conf.js文件,所以可以在webpack.dev.conf.js里配置本地访问. 对比旧版本的build文件夹,新版本的build下少了dev-server.js和dev-client.js 旧版

Vue-Resource请求PHP数据失败的原因

在写一个Vue项目的时候发现在使用Vue-Resource的post方法请求PHP数据时,完全没有反应,查阅资料才知道没有加配置参数: { emulateJSON:true } 这个配置参数的意思是: 设置为true后,会把request body以application/x-www-form-urlencoded的形式发送,相当于表单提交.此时http中的header的content-type为application/x-www-form-urlencoded.常用于服务器端未使用applic

vue使用axios请求后端数据

1. 安装axios $ npm install axios 2.在main.js里面导入axios import axios from 'axios' Vue.prototype.$http = axios 3.下面就可以使用axios获取数据了 // 发送get请求 // 向具有指定ID的用户发出请求 this.$http.get('/user?ID=12345') .then(response => { console.log(response); }) // 错误处理 .catch(er

vue 在发送axios请求时数据渲染问题

这是我请求的json格式的数据一开始在vue用普通的数据渲染,更改为vue后使用v-for 发现没办法渲染上去了. obj.data就是以上数据. 必须加上这三行给this随意赋个值,神奇的事情就会发生了哈哈哈这里是我随意做的一个例子

简单的axios请求返回数据解构赋值

本地 data.json 文件 { "name": "大熊", "age": 18, "fnc": [ 1, 2, 3 ] } <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content=

axios请求本地json

在vux的项目中 1,首先,json文件的位置: 原因: 访问服务器文件,应该把 json文件放在最外层的static文件夹,这个文件夹是vue-cli内置服务器向外暴露的静态文件夹 2,一定要用get的请求方式,post就会404,亲测 3,请求路径

vue使用axios请求本地json文件出现404

之前的路径是这么写的,一直出现404,后来发现必须是http的才可以,这样是无法请求的把路径改为以下位置根据json文件决定,但是必须是http://localhost:断口号

使用axios请求发送数据

之前一直没有用成功,今天看了一些博客,学会了使用axios插件 1.首先就是下载依赖啦 2.main.js import axios from 'axios'Vue.prototype.$axios = axios axios.defaults.baseURL = 'http://xxx/';axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded'; 3,组件引用第一种 var param

本地主机作服务器解决AJAX跨域请求访问数据的方法

近几天学到ajax,想测试一下ajax样例,由于之前在阿里租用的服务器过期了,于是想着让本地主机既做服务器又做客户端,只是简单地测试,应该还行. 于是,下载了xampp,下载网址http://www.apachefriends.org ,只需要解压傻瓜式地安装就可以. 找到安装软件的目录,点击xampp-control.exe然后启动Apache服务, 打开浏览器,在地址栏输入localhost,出现如下图片,说明安装启动都没问题现在编写两个简单的文本,一个txt文件,一个html代码: 截图

vue中请求本地的json数据

为什么要请求本地的数据?模拟后台的请求数据,验证页面的逻辑是否存在问题,抛开后台提前开发等. 常用的说来有:jq的方式约等于 axios的方式,vuex状态管理的方式个人认为最好用的就是jq的方式,应为jq请求使用最为频繁. 1.jq方式 1.1 首先在vue中引入全局 jq 常见引入jq的方法有:直接在根目录的index.html中引入jq 这样引入jq存在一个问题,有时候没有被加载,就会造成jq不能使用: 引入全局jq的较优方案:更改build下的配置文件,详情链接. 1.2 在组件

vue-cli项目 build后请求本地static文件中的 json数据，路径不对，报错404处理方法

vue-cli 项目 build 出错点: 1,build生成dist 放在tomcat上报错,不显示内容解决办法: config>index.js===>assetsPublicPath: '/', 修改为 assetsPublicPath: './', note:如果css中图片不显示,打开“build/utils.js”,增加一行代码即可 2,用 axios 请求本地 static 文件中的JSON 文件报错, static文件不经过编译,需要配置根目录解决办法:配置 'st

【VueJS】VueJS开发请求本地json数据的配置

VueJS开发请求本地json数据的配置,旧版本是build/dev-server.js,新版本是build/webpack.dev.conf.js. VueJS开发请求本地json数据的配置,早期的vue-lic下面有dev-server.js和dev-client.js两文件,请求本地数据在dev-server.js里配置,最新的vue-webpack-template中已经去掉了dev-server.js和dev-client.js 改用webpack.dev.conf.js代替,所以配置

vue开发请求本地模拟数据的配置方法（转）

VUE开发请求本地数据的配置,早期的vue-lic下面有dev-server.js和dev-client.js两文件,请求本地数据在dev-server.js里配置,最新的vue-webpack-template 中已经去掉了dev-server.js和dev-client.js 改用webpack.dev.conf.js代替,所以配置本地访问在webpack.dev.conf.js里配置即可. 1.旧版dev-server.js配置本地数据访问: 在const app = express()

vue项目axios请求接口，后端代理请求接口404，问题出现在哪？

在vue项目中,列表数据需要用到qq音乐接口中的数据,但是直接请求不行,有host及referer限制,需要采用后端代理的方式.借助axios及node的express,在dev-server.js中实现后,重启项目,结果接口404了.代码如下: 仔细检查后,代码没问题:于是在apiRouts中console.log()打印信息,运行没有打印信息,意味着根本没有运行这部分代码.于是想到会不会是webpack版本更新,配置发生了改变导致的.所以仔细看了配置后,发现webpack.dev.conf.

使用axios请求本地数据失败

热门专题