【发布时间】：2021-08-09 11:54:43
【问题描述】：
您必须从网站服务获取“candidates/2021_05/mohamed_nagy_b3b03cbe”资源： https://hire.verkata.com/askme/ 使用运行在 Android 手机上的 Chrome 浏览器，通过从http://google.com/candidates/mohamed_nagy 指向资源的链接，使上面的 GET 请求看起来好像是在发送它。否则，Web 服务会给您一个拒绝访问错误。 谁能给我一些关于我们如何在android中完成类似任务的指导，而我以前没有这样做过，好吗？ 注意：我正在使用纯 JavaSacript fetch API 但无法解决难题，很遗憾。
客户端 index.js
let button = document.getElementById('generate');
let Info = document.querySelector('Info');
const key = 'candidates/2021_05/mohamed_nagy_b3b03cbe';
const url = 'https://hire.verkata.com/askme/';
button.addEventListener('click', () => {
fetchWeather(url, key)
.then((data) => {
postData('/', {
Information: data.content(),
})
}).then(() => {
updateUI();
})
});
const fetchWeather = async (url, key) => {
const res = await fetch(url + key)
try {
const data = await res.json();
console.log(data);
return data;
} catch (error) {
console.log("Error:", error) // appropriately handle the error
}
};
const postData = async (url = '', data = {}) => {
console.log(data)
const response = await fetch(url, {
method: 'POST',
credentials: 'same-origin',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify(data), // body data type must match "Content-Type" header
});
try {
const newData = await response.json();
console.log(newData);
return newData
} catch (error) {
console.log('Error', error);
}
};
const updateUI = async () => {
const request = await fetch('/all');
try {
const allData = await request.json();
console.log(allData);
document.getElementById('info').innerHTML = allData.Info;
} catch (error) {
console.log('error', error);
}
};
server.js
let projectData = {};
const express = require('express');
const app = express();
const bodyParser = require('body-parser');
app.use(bodyParser.urlencoded({
extended: true
}));
app.use(bodyParser.json());
const cors = require('cors');
app.use(cors());
const fetch = require('node-fetch');
app.use(express.static('website'));
const port = 8888;
app.listen(port, () => {
console.log(`server is running on localhost port number: ${port}`)
});
app.post('/', (req, res) => {
console.log(req.body)
const newEntry = {
Info: req.body.Information,
}
projectData = newEntry // projectData.push(newEntry)
res.send(projectData)
});
app.get('/all', (req, res) => {
console.log(projectData);
res.send(projectData);
});
HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Fetch API</title>
<link href="https://fonts.googleapis.com/css?family=Oswald:400,600,700|Ranga:400,700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="style.css">
<!--[if lt IE 9]>
<script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.js"></script>
<![endif]-->
</head>
<body>
<div id = "app">
<div class ="holder">
<a href="http://google.com/candidates/2021_05/mohamed_nagy_b3b03cbe"><div class="button" id="generate">Send Get Info</div></a>
</div>
<div class ="entry">
<div class = "title">Most Recent Entry</div>
<div id = "Holder">
<div id = "Info"></div>
</div>
</div>
</div>
<script src="app.js" type="text/javascript"></script>
</body>
</html>
服务器只是告诉我无法获取，因为此服务器上未找到 404
【问题讨论】：
-
你能告诉我们你到目前为止在代码方面尝试了什么吗？
-
我写了服务器端代码@Gaëtan Boyals，不想写无聊的问题我想要任何想法或任何帮助
-
我看到了你的 server.js，它对我来说似乎是有效的 JS 代码，除了它不是真正的“服务器”代码，因为它是在浏览器中执行的。但是，我仍然没有足够的上下文来完全回答您的问题：您的 html 代码是什么样的？如果您只需要检索数据（如您的第一句话所述），为什么会有 POST 请求？你到底想达到什么目的？代码在哪里崩溃？我非常愿意提供帮助，但您必须先帮助我充分了解您的问题。
-
真的很感谢你，我的兄弟，这是客户端代码或 app.js 或任何名称我的问题，他们希望我访问他们网站上的资源以便能够联系到他们并联系他们给了我三个部分的链接，我将重新附加所有部分，@Gaëtan Boyals
-
感谢上下文，午饭回来我会写详细的回答。
标签： javascript html