Android 에뮬레이터를 사용하여 랩톱 웹 서버에 액세스 할 수 있으며 10.0.2.2:portno
잘 작동합니다.
그러나 실제 Android 전화를 연결하면 전화 브라우저가 랩톱의 동일한 웹 서버에 연결할 수 없습니다. 전화는 USB 케이블을 사용하여 랩톱에 연결되어 있습니다. adb devices 명령을 실행하면 내 전화를 볼 수 있습니다.
내가 무엇을 놓치고 있습니까?
Android 에뮬레이터를 사용하여 랩톱 웹 서버에 액세스 할 수 있으며 10.0.2.2:portno
잘 작동합니다.
그러나 실제 Android 전화를 연결하면 전화 브라우저가 랩톱의 동일한 웹 서버에 연결할 수 없습니다. 전화는 USB 케이블을 사용하여 랩톱에 연결되어 있습니다. adb devices 명령을 실행하면 내 전화를 볼 수 있습니다.
내가 무엇을 놓치고 있습니까?
답변:
USB는 모바일 장치에 네트워크를 제공하지 않습니다.
데스크탑과 전화가 모두 동일한 WiFi (또는 다른 로컬 네트워크)에 연결되어 있으면 라우터가 할당 한 데스크탑 IP 주소를 사용하십시오 (가 localhost
아닌 127.0.0.1
).
데스크탑의 IP 주소를 찾으려면
ipconfig
(Windows) 또는 ifconfig
(Unix)
ifconfig | grep "inet " | grep -v 127.0.0.1
는 중요한 것들만 을 산출 할 것입니다localhost
하고 127.0.0.1
)휴대 전화가 모바일 네트워크에 연결되어 있으면 상황이 더 어려워집니다.
하드 코어 :
<your desktop IP>:<server port number>
그렇지 않으면 xip.io 또는 ngrok 와 같은 것을 사용 하십시오 .
참고 :이 ifconfig
명령은 Debian에서 시작하여 Debian Linux에서 기본적으로 더 이상 사용되지 않으므로 누락되었습니다. Debian Linux에서 네트워크 구성을 검사하기위한 새롭고 권장되는 대안은 ip 명령입니다. 예를 들어 ip 명령을 사용하여 네트워크 구성을 표시하려면 다음을 실행하십시오.
ip address
위의 ip 명령은 다음과 같이 축약 될 수 있습니다.
ip a
여전히 ifconfig
일일 sys 관리 루틴의 일부로 사용하려는 경우 net-tools
패키지의 일부로 쉽게 설치할 수 있습니다 .
apt-get install net-tools
참조는 여기
실제로는 매우 간단합니다.
localhost
(Windows 용 WAMP 서버를 사용하고 있습니다).ipconfig
완료하면 다음과 같은 내용이 표시됩니다.
무선 LAN 어댑터 무선 네트워크 연결 : 연결 별 DNS 접미사. : 링크 로컬 IPv6 주소. . . . . : fe80 :: 80bc : e378 : 19ab : e448 % 11 IPv4 주소. . . . . . . . . . . : 192.168.43.76 서브넷 마스크 . . . . . . . . . . . : 255.255.255.0 기본 게이트웨이 . . . . . . . . . : 192.168.43.1
192.168.43.76
).참고 : 네트워크를 " 홈 네트워크 " 로 설정하십시오 . 네트워크를 홈 네트워크로 설정하면 PC가 같은 네트워크에있는 다른 장치와 자료를 공유 할 수 있습니다.
Windows 10을 사용하는 경우 다음을 수행하여 수행 할 수 있습니다.
문제가있는 경우 Windows 방화벽과 관련이있을 가능성이 큽니다.
나는 이것을 가능하게함으로써 이것을 달성했다. 원격 관리 .
System preferences/sharing
다음과 유사한 메시지가 나타납니다.
some.url.com
Android 기기에서 이제 Mac으로 some.url.com
위임 할 localhost
수 있습니다. ifconfig
Mac의 IP 주소를 얻는 데 사용할 수도 있습니다 .
ngrok
(Node.js가있는 모든 OS)프로젝트를 임시 도메인에 노출시키는 것이 마음에 들지 않으면를 사용할 수 있습니다 ngrok
. localhost:9460
간단하게 작성할 수 있는 앱이 있다고 가정 해 보겠습니다.
npm install ngrok -g
ngrok http 9460
이것은 나에게 줄 것이다 :
온라인 세션 상태 사용 가능한 업데이트 업데이트 (버전 2.2.8, 업데이트 할 Ctrl-U) 버전 2.2.3 지역 미국 (미국) 웹 인터페이스 http://127.0.0.1:4040 전달 http://f7c23d14.ngrok.io-> localhost : 9460 전달 https://f7c23d14.ngrok.io-> localhost : 9460 연결부 ttl opn rt1 rt5 p50 p90 0 0.00 0.00 0.00 0.00 0.00
이제 https://f7c23d14.ngrok.io
원격으로 볼 수있는 방법으로 접근 할 수 있습니다 localhost
. 고객과 디자인 작업 또는 진행 상황을 공유하는 것이 좋습니다.
nginx
프록시 패스가있는 대체 솔루션이와 같은 것을 실행하고 있다면 nginx proxy_pass
조금 더 조정해야합니다.
81
반대로80
sudo nginx -s reload
http://youripaddress:81
server {
listen 80;
listen 81; # <-------- add this to expose the app on a unique port
server_name ~^(local|local\.m).example.com$;
# ...
}
새로 고침 및 방문 http://youripaddress:81
192.168.0.101
했지만 호스트 이름이 작동하지 않았습니다.
간단한 해결책 ( laptop_ip_addr:port
모바일 장치와 랩톱이 동일한 WiFi에있을 때 모바일 장치에서 액세스 )으로 인해 ERR_CONNECTION_REFUSED 오류가 발생합니다. 즉, MacBook이 모바일 연결 시도를 거부하는 것 같습니다.
이 솔루션 은 저에게 효과적 입니다 (MacBook에서 테스트).
adb reverse tcp:4000 tcp:4000
4000
http://localhost:4000/
하면 실제로 휴대 기기가 아닌 랩톱에 연결됩니다.단점은 한 번에 하나의 모바일 장치 에서만 작동한다는 것 입니다. 다른 모바일 장치로 액세스하려면 먼저 첫 번째 장치의 연결을 끊고 ( USB 디버깅 사용 안함 ) 새 장치를 연결하고 ( USB 디버깅 사용 ) adb reverse tcp:4000 tcp:4000
다시 실행 해야합니다.
항상 작동 해야하는 또 다른 솔루션은 ngrok입니다 (다른 답변에서 언급했듯이). 로컬 네트워크가 아닌 인터넷을 통해 작동합니다.
사용이 매우 쉽습니다.
brew cask install ngrok
ngrok http 4000
이것은 다른 정보 중에서 다음과 같은 줄을 출력합니다.
Forwarding http://4cc5ac02.ngrok.io -> localhost:4000
이제 http://4cc5ac02.ngrok.io
인터넷에 연결된 모든 장치를 탐색 할 수 있으며이 URL localhost:4000
은 랩톱으로 리디렉션됩니다 .
ngrok 명령이 실행되는 동안 ( Ctrl-C를 누를 때까지 ) 프로젝트가 공개적으로 제공됩니다. URL이있는 모든 사람이 볼 수 있습니다.
이 문제에 대한 빠른 해결책을 찾았습니다. 이 링크를 사용해보십시오 . 문제 해결에 도움이됩니다.
튜토리얼에서 '127.0.0.1'을 'All'로 변경하고 서버가 실행중인 IP 주소로 변경하는 한 가지만 변경했습니다.
그 후에는 로컬 호스트에 연결할 수 있어야합니다.
아래는 링크 된 페이지에있는 정보의 교정본입니다.
Wamp 서버 (또는 원하는 다른 서버)를 설치하십시오.
이것은 로컬 서버를 설정하는 데 가장 적합한 서버 중 하나입니다. Apache 또는 다른 서버를 설치 한 경우이 단계를 무시하십시오.
여기에서 Wamp Server를 다운로드하여 설치하십시오.
Windows 방화벽에서 포트 80에 대한 새 규칙을 추가하십시오.
제어판을 열고 Windows 방화벽을 선택하십시오.
Windows 방화벽 설정 페이지의 왼쪽 패널에서 고급 설정을 선택하십시오.
왼쪽 패널에서 인바운드 규칙을 선택한 다음 새 규칙을 선택하십시오.
포트를 선택하고 다음을 클릭하십시오.
"특정 로컬 포트"라디오 버튼을 선택하고 포트 값으로 80을 입력하십시오.
연결을 변경하지 않고 다음 단계로 이동하십시오.
프로파일 옵션을 변경하지 않고 다음을 클릭하십시오.
새 규칙에 좋은 이름을 지정하고 완료를 클릭하십시오.
로컬 네트워크 IP에서 포트 80 액세스가 가능합니다.
403 오류를 수정하려면 Wamp 서버의 httpd.conf 파일을 편집하십시오.
이 파일을 편집해야합니다. 그렇지 않으면 로컬 네트워크 IP를 통해 로컬 호스트에 액세스 할 때 403 금지 오류가 발생합니다.
Wamp 서버 트레이 아이콘을 클릭하십시오.
Apache 서버 하위 메뉴를 엽니 다.
httpd.conf를 선택하십시오.
httpd.conf 파일에서이 구성 섹션을 찾으십시오.
Directory “c:/wamp/www/”
#
# Possible values for the Options directive are “None”, “All”,
# or any combination of:
# Indexes Includes FollowSymLinks SymLinksifOwnerMatch ExecCGI MultiViews
#
# Note that “MultiViews” must be named *explicitly* — “Options All”
# doesn’t give it to you.
#
# The Options directive is both complicated and important. Please see
# http://httpd.apache.org/docs/2.2/mod/core.html#options
# for more information.
#
Options Indexes FollowSymLinks
#
# AllowOverride controls what directives may be placed in .htaccess files.
# It can be “All”, “None”, or any combination of the keywords:
# Options FileInfo AuthConfig Limit
#
AllowOverride all
#
# Controls who can get stuff from this server.
#
# onlineoffline tag – don’t remove
Order Deny,Allow
Deny from all
Allow from 127.0.0.1
'127.0.0.1'을 찾아 'All'로 바꾸고 파일을 저장 한 후 Wamp 서버를 다시 시작하십시오.
로컬 네트워크 IP를 찾으십시오.
명령 프롬프트를여십시오.
ipconfig
명령을 입력하고 입력하십시오 .
필자의 경우 로컬 영역 네트워크 주소는 10.0.0.2입니다.
Wi-Fi를 통해 Android 휴대 전화에서 로컬 호스트에 액세스해야하는 IP입니다. 작동하는지 테스트하려면 로컬 호스트 서버가 설치된 데스크탑 브라우저에이 IP 주소를 입력하십시오. 브라우저가 로컬 호스트 페이지를 성공적으로 표시해야합니다. 이렇게하면 이제이 로컬 네트워크 IP가 Android 전화에서 성공적으로 액세스 될 수 있습니다.
이 튜토리얼이 wifi를 통해 로컬 호스트에 액세스하는 데 도움이되기를 바랍니다.
# onlineoffline tag - don't remove Order Allow,Deny Allow from all
Windows PC의 경우 "ipconfig"명령을 사용하여 IPv4 주소를 찾는 것 외에 다른 작업을 수행하지 않아도됩니다.
기타 환경 세부 정보 : Windows 7, Google Nexus 4 (4.2.2), Tomcat Server, Grails Application.
또한 AndroidManifest 파일에서 인터넷에 액세스 할 수있는 권한이 있는지 확인해야합니다.
<uses-permission android:name="android.permission.INTERNET"/>
java.io.FileNotFoundException: http://192.168.8.65:8000/app/web/users/
그러나 훨씬 더 나은 해결책이 있습니다. IP 주소 "10.0.2.2"를 사용하여 호스트 시스템에 액세스 할 수 있습니다. 이것은 안드로이드 팀에 의해 이런 식으로 설계되었습니다. 따라서 웹 서버는 localhost에서 완벽하게 실행할 수 있으며 Android 앱에서 "http://10.0.2.2:8080"을 통해 액세스 할 수 있습니다.
이것은 오래된 질문이므로 실제로는 매우 간단한 새로운 방법이 있습니다. ADB Chrome 확장 프로그램을 다운로드 한 후 다음 지침을 따르십시오.
https://developers.google.com/chrome-developer-tools/docs/remote-debugging
"Android 용 Chrome에서 포트 전달을 사용하면 모바일에서 개발 사이트를 쉽게 테스트 할 수 있습니다. 개발 기기의 특정 TCP 포트에 매핑되는 모바일 장치에서 수신 대기중인 TCP 포트를 만들어 작동합니다.이 포트 간의 트래픽은 USB, 연결은 네트워크 구성에 의존하지 않습니다. "
자세한 내용은 https://developer.chrome.com/devtools/docs/remote-debugging#port-forwarding
이 솔루션은 모바일 장치와 컴퓨터가 동일한 네트워크에 있지 않을 때 사용할 수 있습니다.
이 경우 포트 전달을 사용해야합니다. Google 크롬 검사 창 (chrome : // inspect)에서 연결된 장치를 볼 수 있습니다.
포트 포워딩 버튼을 클릭하고 3000이라는 임의의 포트를 랩톱이 사용하는 포트 8080으로 설정하십시오.
이제 장치에서 localhost : 3000을 사용하여 랩톱의 localhost : 8080 (or_whatever_ip : portno)에 액세스하십시오. 모바일 브라우저에서 확인할 수 있습니다. 모바일 브라우저에서 localhost : 3000을 시도하십시오. "포트 포워딩 설정"창에서 "포트 포워딩 활성화"체크 상자를 확인하십시오
CMD를 관리자로 실행
CMD 화면에서 ipconfig를 입력 하면 화면에 텍스트가 나타납니다
이 사진으로
이 IP를 사용하여 로컬 호스트에 액세스 할 수 있습니다 .PC에 연결된 것과 동일한 네트워크에 연결되어 있어야합니다
이 파일로 가십시오 :
C:\wamp\bin\apache\Apache2.2.11\conf\httpd.conf
# onlineoffline tag - don't remove
Order Deny,Allow
Allow from all // change it Deny
Allow from 127.0.0.1
그리고 10.0.2.2를 IP 주소로 변경하십시오.
마침내 Ubuntu에서 완료되었습니다 .localhost에서 nodejs 서버를 실행 중입니다 : 8080
1) 열린 터미널 유형 ifconfig 다음과 같이 ip를 얻습니다 : inet addr : 192.168.43.17
2) 이제 "192.168.43.17:8080"(로컬 호스트 포트 번호에서 오는 8080 포트)과 같은 URL 주소를 입력하십시오. 예 : "192.168.43.17:8080/fetch"
여러 다른 로컬 호스트 서버를 사용하여이 문제가 발생했습니다. 마지막으로 Python 간단한 서버를 사용하여 몇 초 만에 내 앱을 휴대 전화에서 실행했습니다. 몇 초 밖에 걸리지 않으므로 더 복잡한 솔루션에 들어가기 전에 시도해 볼 가치가 있습니다. 먼저 파이썬이 설치되어 있는지 확인하십시오. cmd+r
및 입력 python
Windows 또는 대한$ python --version
맥 터미널에서.
다음:
cd <your project root>
$ python -m SimpleHTTPServer 8000
그런 다음 네트워크에서 호스트 컴퓨터의 주소 System Preferences/Sharing
를 찾으십시오. 매킨토시에서 찾았습니다. 당신의 안드로이드 장치에 그것을 누르고 당신의index.html
하고 당신은 잘해야합니다.
그렇지 않은 경우 문제는 다른 것이며 다른 제안 된 솔루션을 살펴볼 수 있습니다. 행운을 빕니다!
* 편집하다 *
Chrome을 사용하는 경우 시도 할 수있는 또 다른 빠른 솔루션은 Chrome 용 웹 서버 확장입니다. 내 전화에서 로컬 호스트에 액세스하는 빠르고 쉬운 방법을 찾았습니다. Accessible to local network
아래에서 확인 Options
하면 문제없이 셀에서 작동해야합니다.
ngrok를 사용하면 로컬 호스트를 임시 서버에 배치 할 수 있으며 설정이 매우 간단합니다. 링크에서 찾을 수있는 몇 가지 단계를 여기에 제공했습니다.
ngrok http [port number]
터미널에 로컬 호스트를 가리키는 주소가있는 작은 대시 보드가 표시됩니다. 앱이 해당 주소를 가리키고 장치를 빌드하십시오.
기본 localhost를 설정하는 가장 쉬운 방법은 http : // localhost : port를 사용하는 것 입니다. 이것은 랩톱 및 Android에서도 작동합니다.
작동하지 않으면 Android에서 휴대 전화의 기본 IP를 127.0.0.1:port :)로 설정하십시오.
터미널 열기 및 유형 :-
hostname -i
#127.0.0.1
hostname -I
#198.168.*.*
우선 컴퓨터 (서버가 실행중인 곳)의 IP 주소를 정적으로 만드십시오. 이 고정 IP 주소를 안드로이드 코드에 입력하십시오. 다음으로 Wi-Fi 라우터의 인터페이스로 이동하여 왼쪽 패널을 확인하십시오. 포트 포워딩 / 포워딩과 같은 옵션이 표시됩니다. 그것을 클릭하고 포트 80을 전달하십시오. 이제 htttpd.conf
파일을 편집하고 편집하십시오.
모두 허용
. 서버를 다시 시작하십시오. 이제 모든 것이 잘 작동합니다.
또한 항상 IP 주소가 할당되도록 컴퓨터의 IP 주소를 예약 할 수 있습니다. 라우터 인터페이스의 왼쪽 패널에서를 찾아 DHCP -> Address Reservation
클릭하십시오. 기기의 MAC 주소와 코드에 입력 한 IP 주소를 입력하십시오. 저장을 클릭하십시오. 컴퓨터의 지정된 IP 주소가 예약됩니다.
랩톱을 기반으로 모바일 장치를 amp 프 서버에 연결하는 솔루션 :
첫째, wifi는 라우터가 아닙니다. 따라서 랩톱의 localhost를 기반으로 내 모바일 장치를 wamp 서버에 연결하려면 라우터가 필요합니다. 무료 가상 라우터를 다운로드하여 설치했습니다 : https://virtualrouter.codeplex.com/
그것을 구성하는 것은 정말 간단합니다.
그런 다음 브라우저를 시작하여 장치를 통해 랩톱에 연결하고 랩톱의 IPV4 주소를 채울 수 있습니다 (Windows에서 찾으려면 cmd : ipconfig를 입력하고 ipv4 주소를 찾으십시오).
wamp 서버 홈페이지가 나타납니다.
하나의 대답이 받아 들여졌지만 이것은 나를 위해 일했습니다.
ifconfig
터미널 내부 에 mac 유형의 경우 en0/en1 -> inet
다음과 같아야 19*.16*.1.4
합니다.) (Windows에서는`ipconfig를 사용하십시오)모바일 설정을 열고 네트워크-> Wi-Fi 네트워크를 길게 누르십시오-> 네트워크 수정-> 고급 옵션으로 아래로 스크롤-> 프록시 수동 선택을 선택하고 프록시 호스트 이름에 주소를 19*.16*.1.4
입력하십시오. 저장하십시오.
what is my ip
구글 크롬에서 검색하고 IP를 얻으십시오.1**.1**.15*.2**
1**.1**.15*.2**:port/
휴대 기기에서 액세스 해보 십시오.이만큼 간단합니다.
이것은 나를 위해 일한 것입니다 .127.0.0.1 ip 뒤에 다른 줄을 추가하여 사용하려는 장치의 정확한 로컬 네트워크 IP 주소 (공용 IP 주소가 아님)를 지정했습니다. 제 경우에는 Samsung Galaxy S3
Bangptit이 제안한대로 httpd.conf 파일 (x는 버전 번호)을 편집하십시오. C : \ wamp \ bin \ apache \ Apache2.xx \ conf \ httpd.conf
onlineoffline 태그를 검색하고 전화기의 IP를 추가하십시오 (라우터 구성 페이지에서 전화기의 IP 주소를 찾았습니다).
Order Deny,Allow
Deny from all
Allow from 127.0.0.1
Allow from 192.168.1.65
Allow from ::1
Allow from localhost
예를 들어 192.168.1.0/24 등의 전체 하위 도메인을 포함하도록 이것을 확장 할 수 있습니다
Ngrok 이 최고의 솔루션입니다. PHP를 개발하는 경우 Laravel Valet 설치를 권장합니다. MacOS 및 Linux 버전이 있으므로 valet share
명령을 사용할 수 있습니다 . 프론트 엔드 기술을 개발 중이고 3000과 같은 포트를 공유해야하는 경우 ngrok를 직접 사용하십시오.ngrok http 3000
미래 개발자를위한 솔루션 추가
IP 주소의 주소를 복사하십시오. 네트워크를 마우스 오른쪽 버튼으로 클릭-> 네트워크 및 공유-> 현재 연결을 클릭하십시오-> 세부 정보-> ipv4 주소 옆의 주소는 IP 주소입니다.
제어판-> 시스템 및 보안-> Windows 방화벽-> 고급 설정-> 인바운드 규칙-> 새 규칙으로 이동하십시오 (예 : 80, 포트를 추가하는 단계를 따르십시오)
적어 둔 IP 주소와 전화 브라우저에 적어 둔 포트 번호를 입력하십시오. 예 : 192.168.0.2:80 및 wala.
연결되지 않으면 가능한 해결책입니다. 마우스 오른쪽 버튼으로 네트워크-> 네트워크 열기 및 공유-> 연결 유형 아래에서 연결 이름 아래에서 활성 연결을보고 공용 인 경우 클릭하고 홈 네트워크로 변경하십시오.
사용 connectify
및 xampp
또는 동등한 및 액세스 모바일 URL 표시 줄에 주소를 IP 입력