js 判断一个 url/网址是否能正常打开,然后跳转不同的网址,咋写?

2022-08-14 21:48:07 +08:00
 qiubangzhu

js 判断 baidu.com 是否正常,正常就在 3 秒之后跳转到 baidu.com

不正常就不跳转,在当前页面不动

咋写?

搜过一圈,没找到能用的,本人小白一个,大佬帮忙写一个,谢谢了

5750 次点击
所在节点    程序员
27 条回复
ink19
2022-08-14 21:55:10 +08:00
js 没办法跨域吧。。。感觉写不了
Moeyua
2022-08-14 21:55:12 +08:00
如果不考虑重定向等等问题的话,可以直接像该地址用 Ajax 发送 Get 请求,如果返回的 HTTP code 是 200 就说明页面能够正常访问。
qiubangzhu
2022-08-14 21:58:55 +08:00
@ink19 用啥能实现,不要后台的情况下
wenzichel
2022-08-14 22:01:34 +08:00
纯前端存在跨域的问题,肯定没法实现,只能借助于后端了,把将要跳转的地址发给你们后端接口,后端去请求这个地址的数据,若能正常请求,则告诉前端可以跳转,否则不能跳转。
autoxbc
2022-08-14 22:02:50 +08:00
const urls = [
'https://www.baidu.com/img/flexible/logo/pc/result.png',
'https://www.xxxxbaidu.com/img/flexible/logo/pc/result.png',
];

urls.forEach( url => {
const img = new Image();
img.onload = () => console.log(`url: ${ url }`);
img.src = url ;
} );
youbaoer
2022-08-14 22:29:17 +08:00
maggch97
2022-08-14 22:40:45 +08:00
跨域问题就用 iframe ,readyState
pytth
2022-08-14 22:50:14 +08:00
要用后端来获得请求头。
xiaoz
2022-08-14 23:36:22 +08:00
2 楼办法是可行的,比如 jquery 的 ajax 就可以发起一个请求,只获取 head 头,然后根据状态码判断。3xx 以下视为正常,大于 4xx 或超时视为异常。
beastk
2022-08-15 00:19:38 +08:00
请求资源文件呗,img css js ,然后判断加载
MossFox
2022-08-15 00:55:41 +08:00
我不知道合不合理,如果有问题的话麻烦指出下

try {
// 超时时间 6s
let controller = new AbortController();
setTimeout(() => {
controller.abort();
}, 6000);

let res = await fetch("https://baidu.com/", {
mode: "no-cors",
// ↑ 这种模式 (opaque mode) 不可以获取到任何响应数据和请求头,但如果出现响应异常,依然会有错误抛出。通过这个来检查是否成功访问了目标地址
signal: controller.signal
});
// 接着是有正常响应的情况

} catch (e) {
// 失败情况 (超时或网络错误)

}
MossFox
2022-08-15 00:57:57 +08:00
描述里面不清楚指的是 "**用户**能否访问目标网址" 还是 "目标网址的服务当前是否可用"。如果是前者,上面那个方案可以试试,否则的话会需要有后端参与。
Slshaolong
2022-08-15 01:04:20 +08:00
可以去试试请求这个网页的一张图片
然后用 onload 试试

一般这样的话我就写后端了
a90120411
2022-08-15 02:25:45 +08:00
#11 的方法是可行的。
yitalin
2022-08-15 03:46:51 +08:00
昨天刚做了个类似的,测试网页连接速度
http://speedtest.im/news.html
flymeto
2022-08-15 03:56:33 +08:00
@yitalin 大哥就这个就这个 怎么实现的呢 我看别的类似的都太粗糙而且不准确
hxy100
2022-08-15 07:08:04 +08:00
@yitalin 不是所有网址都能这样操作,除非对方服务器返回了允许跨域的 HTTP 标头;
---
zhuweiyou
2022-08-15 09:06:47 +08:00
哪怕楼上的方案可行,这个需求仍然不合理.
直接页面放多个链接,入口 1XX, 入口 2YY, 让用户自己去点得了
hgc81538
2022-08-15 10:21:47 +08:00
跟 5 樓一樣用圖片檢查,但用
https://www.baidu.com/favicon.ico

檢測 img onload, onerror
wangxiaoaer
2022-08-15 10:25:43 +08:00
检查对应网站的相对固定图片是最靠谱的了。

有些提到借助后端的,这种也不靠谱:后端和前端的连通性是不一样的,后端能访问不代表前端可以。

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/872818

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX