我使用Fetch API创建了一个基于浏览器的端点有效性检查器,该检查器具有超时机制来测试跨浏览器的端点的有效性。试试看是否有效:
class EndpointValidator {
static async checkEndpoint(url, timeout = 5000) {
try {
const fullUrl = url.startsWith('http://') || url.startsWith('https://')
? url
: `http://${url}`;
const controller = new AbortController();
const timeoutId = setTimeout(() => controller.abort(), timeout);
try {
const response = await fetch(fullUrl, {
method: 'HEAD',
mode: 'no-cors',
signal: controller.signal
});
clearTimeout(timeoutId);
return {
valid: true,
url: fullUrl,
status: response.status
};
} catch (error) {
clearTimeout(timeoutId);
if (error.name === 'AbortError') {
return {
valid: false,
url: fullUrl,
error: 'Timeout',
details: 'Request took too long to respond'
};
}
return this.diagnoseEndpointError(fullUrl, error);
}
} catch (generalError) {
return {
valid: false,
url,
error: 'Unhandled Error',
details: generalError.message
};
}
}
static diagnoseEndpointError(url, error) {
const errorLowerCase = error.message.toLowerCase();
const errorTypes = [
{
pattern: /failed to fetch|network error/i,
type: 'Network Error',
details: 'Unable to resolve domain or connect to server'
},
{
pattern: /cors|cross-origin/i,
type: 'CORS Error',
details: 'Cross-Origin Resource Sharing restriction'
},
{
pattern: /dns/i,
type: 'DNS Error',
details: 'Domain name could not be resolved'
}
];
const matchedError = errorTypes.find(err => err.pattern.test(errorLowerCase));
return {
valid: false,
url,
error: matchedError ? matchedError.type : 'Connection Error',
details: matchedError ? matchedError.details : error.message
};
}
static async validateEndpoints(urls, concurrency = 5) {
const results = [];
for (let i = 0; i < urls.length; i += concurrency) {
const batch = urls.slice(i, i + concurrency);
const batchResults = await Promise.all(
batch.map(url => this.checkEndpoint(url))
);
results.push(...batchResults);
}
return results;
}
}
async function testEndpoints() {
const endpoints = [
'google.com',
'nonexistentdomain.xyz',
'http://example.com'
];
const results = await EndpointValidator.validateEndpoints(endpoints);
console.log(results);
}
window.EndpointValidator = EndpointValidator;
它使用
fetch()
具有
no-cors
绕过CORS限制,并提供超时以防止无限期等待。它还尝试诊断不同类型的连接错误。它支持完整的url和域名,并允许对端点进行批处理。
要使用它,您只需调用:
EndpointValidator.checkEndpoint('google.com')
.then(result => console.log(result));
EndpointValidator.validateEndpoints(['google.com', 'example.com'])
.then(results => console.log(results));
关于你的观察
net::ERR_NAME_NOT_RESOLVED
,这种方法提供了一种更具编程性的方法来检测和处理不同浏览器之间的此类错误。
我希望这能有所帮助。