연결이 로컬 호스트인지 javascript로 확인하는 방법은 무엇입니까?
페이지로드가 내 로컬 컴퓨터에있는 경우 내 자바 스크립트를 확인하고 싶습니다.
내가 그렇게하고 싶은 이유는 개발할 때 서버 측 (C #) 유효성 검사가 모두 올바르게 작동하는지 확인하기 때문입니다. 그래서 클라이언트 측과 서버 측 오류가 모두 표시되는 것을 좋아합니다.
그래서 테스트하는 동안 jquery에 항상 잘못된 데이터를 통과시키는 플래그가 있습니다. 이렇게하면 클라이언트 측 및 서버 오류를 한 번에 볼 수 있습니다.
그러나 지금은 개발에서 프로덕션으로 이동할 때 수동으로 이동하고 앞뒤로 변경해야합니다.
location.hostname변수는 당신에게 현재의 호스트를 제공합니다. 어느 환경에 있는지 확인하기에 충분합니다.
if (location.hostname === "localhost" || location.hostname === "127.0.0.1")
alert("It's a local server!");
예를 들어 file:///C:/Documents and Settings/Administrator/Desktop/"localhost"감지 와 같은 위치에서 브라우저에서 정적 html을 실행하면 작동하지 않습니다. location.hostname빈 문자열을 반환합니다. 그래서
if (location.hostname === "localhost" || location.hostname === "127.0.0.1" || location.hostname === "")
alert("It's a local server!");
여전히 모든 것을 잡는 것은 아니지만 약간 개선 될 수 있습니다. 이제 도메인 배열을 만들고 .includes를 사용할 수 있습니다.
const LOCAL_DOMAINS = ["localhost", "127.0.0.1", ...];
if (LOCAL_DOMAINS.includes(window.location.hostname))
alert("It's a local server!");
이를위한 쉬운 방법은 localhost에 대해 호스트 이름을 확인하거나 하위 문자열 (이 경우 http : //testsite.local 과 같은 ".local"URL)에 대해 사용자 지정 도메인 이름을 확인하는 것입니다 .
var myUrlPattern = '.local';
if (window.location.hostname === "localhost" || location.hostname === "127.0.0.1" || window.location.hostname.indexOf(myUrlPattern) >= 0) {
alert("It's a local server!");
}
다음과 같이 C #으로 페이지 뒤의 코드 중 하나에서 감지 할 수 있습니다.
if ((Request.Url.Host.ToLower() == "localhost"))
{
// ..., maybe set an asp:Literal value that's in the js
}
또는 클라이언트 스크립트에서 수행하려는 경우 window.location.host의 값을 확인할 수 있습니다.
if (window.location.host == "localhost")
{
// Do whatever
}
도움이 되었기를 바랍니다.
다른 스크립트와 동일한 메커니즘을 사용하는 가장 짧은 형식 :
if ( ["localhost", "127.0.0.1", ""].includes(window.location.hostname) ) {
console.log("It's local host !");
}
위의 답변은 대부분 문제를 해결하지만 ...
- localhost가 반드시 'localhost /'가 아닌 경우 어떻게해야합니까?
- 개발 중에 FE 검증을 수행하려면 어떻게해야합니까?
- 개발 중에 다른 동작을 원하는 경우
( fe 유효성 검사, 유효성 검사, 유효성 검사 없음 )
한 가지 해결책은 위치 해시를 설정하고 확인하는 것입니다.
http://myname.foo.com/form.html#devValidation
스위치로 무제한 옵션을 추가 할 수 있습니다.
switch(location.hash) {}
case '#devValidation':
// log the results and post the form
break;
case '#beValidation':
// skip front end validation entirely
break;
case '#noValidation':
// skip all validation $('[name=validationType']).val('novalidation');
break;
case '#feValidation':
default:
// do fe validation
break;
}
정규 표현식은 더 느리지 만 * 짧고 깔끔합니다. 또한 여기에서 아무도 IPv6 로컬 호스트 (:: 1)를 확인하지 않습니다.
/localhost|127\.0\.0\.1|::1|\.local|^$/i.test(location.hostname)
일반 localhost, .local 도메인 및 파일 (빈 호스트 이름)을 확인합니다.
*) In Chrome, performance of [].includes(...) is the best (42 ms), followed by simple loop (for, while) with array item checking (119 ms), then [].indexOf(...) > -1 (289 ms) and finally the regexp (566 ms). But those measurements are somehow relative, because different browsers are optimized differently. In FF 52 ESR includes and indexOf have similar results, regexp is 2× slower and loop 6× slower.
That's how it get checked in React, register service worker, good way to check if you are on localhost by checking hostname, including localhost and IPv6, and matching start with 127:
const isLocalhost = Boolean(
window.location.hostname === 'localhost' ||
// [::1] is the IPv6 localhost address.
window.location.hostname === '[::1]' ||
// 127.0.0.1/8 is considered localhost for IPv4.
window.location.hostname.match(
/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/
)
);
Based on the above comments th following regular expression has helped me to verify if the url is 'localhost', any IP adress IPv4 or IPv6.
window.location.hostname.match(/localhost|[0-9]{2,3}\.[0-9]{2,3}\.[0-9]{2,3}\.[0-9]{2,3}|::1|\.local|^$/gi)
const LOCAL_DOMAINS = [ "localhost", "127.0.0.1" ];
/* offline || development */
if ( LOCAL_DOMAINS.includes(location.hostname) )
{
BASE_URL_PUBLIC = location.hostname + "/folder/website/"; // your project folder
}
/* online || production */
else
{
BASE_URL_PUBLIC = location.hostname;
}
참고URL : https://stackoverflow.com/questions/3162457/how-to-check-with-javascript-if-connection-is-local-host
'program story' 카테고리의 다른 글
| JSON을 CSV로 변환하는 동안 JSON 키의 순서 유지 (0) | 2020.10.18 |
|---|---|
| TypeScript에서 배열 선언 (0) | 2020.10.18 |
| 목록 항목을 가장 좋은 방법으로 바꾸는 방법 (0) | 2020.10.18 |
| Espresso에 대화 상자가 표시되는지 확인 (0) | 2020.10.18 |
| Chrome 기기 모드 에뮬레이션 미디어 쿼리가 작동하지 않음 (0) | 2020.10.18 |