在某些网站接口时,用postman测试好的数据,但离开了postman,却不行(这以小米商城移动端为例,其它网站类似情况一样)?
在这种情况下,要注意了!这时你会好奇,我甚至明明复制的就是,postman提供的请求代码块,
然而,在html网页获取数据时,仍然获取不到数据:原因就是,你`跨域`了;这时,你刚解决跨
域后,浏览器可能不会给你抛出错误,虽然浏览器给你一个200的状态码,但是,你会发现,data
里面还是没有获取到数据,哎呀!这是为什么呢?
答案就是:你没有设置代理服务器!!!
乍一听,好像好复杂的样子,其实,你可以自己来搭建一个代理服务器,不难的,下面我用十几
行代码,来演示以下,怎样快速配置一个代理服务器。
这里,我是在node环境中,来配置代理服务器。准备阶段:我需要三个框架,express、
axios、cores。这里,我就以小米移动端获取数据为例,废话不多说,开整:
const express = require('express'); // 引入express框架,做搭建服务器
const axios = require('axios'); // 引入axios框架,做数据获取用
const cores = require('cors'); // 引入cores,用来解决跨域
const app = express(); // 创建express实例
// axios(其实就是ajax封装后的) 默认发送的数据是 json 格式的;
// jQ发送的数据格式,默认是url编码的,故需做以下配置
app.use(express.json()); // 设置服务器端,接收数据的格式可以为json格式
app.use(express.urlencoded()); // 设置服务器端,接收的数据格式可以为url编码格式的
app.use(cores()); // 解决浏览器跨域问题
// 设置代理请求接口
app.post('/api/v1', (req, res) => {
const { url } = req.body; // 获取post请求中的数据(目标地址)
axios.post(url, {}, {
headers: {
// 下面这一行代码的设置也是多余的,
// 因为我html请求时,用的是jQ,它默认就是url编码的,
// 这里只做说明用
'Content-Type': 'application/x-www-form-urlencoded',
// ES5中规定,不能修改 Origin 的值,即使在这设置了Origin,也不会起作用
// 所以下面 Origin 的设置其实是无效的,写了占地方,并且你也修改不了,
// 把 Origin 先放在这里,也是做说明用!
Origin: '',
// Referer 必须设置的!作用可以百度,有好多对它的解释的
Referer: '/'
}
}).then(result => {
res.json(result.data);
})
})
app.listen(3003, () => {
console.log('服务器运行成功')
})
这样,一个简单的代理服务器就配置完成了,怎么样,是不是很简单呢?下面是对该代理服务器的使用,即我们可以在html代码中,这样设置,来获取小米手机版的数据了:
<!DOCTYPE html>
<html>
<head>
<meta name="referrer" content="never">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title></title>
</head>
<body></script> -->
<script src="/ajax/libs/jquery/3.5.1/"></script>
<script>
$.post('http://localhost:3003/api/v1/', {
url: '/v1/home/page'
}, function (data, textStatus, jqXHR) {
console.log("res===>", data);
console.log("code===>", textStatus);
console.log("XHR===>", jqXHR);
})
</script>
</body>
</html>
最后说明一下,其实这种代理服务器来获取数据,并没什么用的,你只能做数据展示来使用,除非,你会操作数据库(有一定的写接口的经验),把得到的数据,做一个增删改查及相应接口的设置。这就考验个人的能力的哦,但以上分享,是我在某社区,看到有人问关于该问题,就。。。。其实这样获取数据,没什么用的!在平时开发中,我们需要找到问题的关键所在,才能有所收获。甚至有时候,我们不但要知其然,还要知其所以然。嘿嘿!