用详细代码说明如何跨域,代码如下function getTruckNo() { const TruckNo = document.getElementById("TruckNo").value; const options = { method: "GET", url: "http://10.198.8.102:8081/TruckParkTime", params: { Token: "Parking20230103163153666", TruckNo: TruckNo }, headers: { "content-type": "application/json"}, }; axios.request(options).then(function (response){ console.log(response.data); var data = JSON.parse(response.data); console.log(data.TruckNo); console.log(data.Intime); console.log(data.ParkTime); console.log(data.Money); showResult(data); }) .catch(function (error) { console.error(error); }); } function showResult(data) { const resultDiv = document.getElementById("result"); resultDiv.textContent = "车牌:"+ data.TruckNo + "进场时间:"+ data.Intime+", 停车时长:" + data.ParkTime+", 产生金额:" + data.Money; }
时间: 2024-04-18 07:29:44 浏览: 109
在浏览器端进行跨域请求需要使用JSONP或CORS来实现。JSONP是一种通过动态创建`<script>`标签来获取跨域数据的方法,而CORS是一种通过服务器设置响应头来允许跨域请求的方法。
在你的代码中,我们可以使用JSONP来实现跨域请求。修改你的代码如下:
```javascript
function getTruckNo() {
const TruckNo = document.getElementById("TruckNo").value;
const script = document.createElement("script");
const url = `http://10.198.8.102:8081/TruckParkTime?Token=Parking20230103163153666&TruckNo=${TruckNo}&callback=showResult`;
script.src = url;
document.head.appendChild(script);
}
function showResult(data) {
const resultDiv = document.getElementById("result");
resultDiv.textContent = "车牌:" + data.TruckNo + "进场时间:" + data.Intime + ", 停车时长:" + data.ParkTime + ", 产生金额:" + data.Money;
}
```
在这个修改后的代码中,我们动态创建了一个`<script>`标签,并将要请求的URL设为`src`属性。URL中包含了要传递的参数以及回调函数`showResult`的名称。当服务器返回响应时,会执行回调函数并将数据作为参数传递给它。
请注意,使用JSONP跨域请求有一些限制,例如只能发送GET请求,且服务器需要支持JSONP。如果服务器不支持JSONP,你可能需要使用CORS来实现跨域请求。
如果你有任何疑问,请随时提问!
阅读全文