> 웹 프론트엔드 > 프런트엔드 Q&A > Vue 역방향 프록시 IP가 포트에 연결할 수 있습니까?

Vue 역방향 프록시 IP가 포트에 연결할 수 있습니까?

PHPz
풀어 주다: 2023-04-26 14:40:26
원래의
550명이 탐색했습니다.

Vue 역방향 프록시 IP를 포트에 연결할 수 있나요?

Vue.js는 도메인 간 문제를 해결하기 위해 역방향 프록시(역방향 프록시)를 사용하여 요청을 원격 서버로 전달하는 인기 있는 JavaScript 프레임워크입니다. 역방향 프록시는 클라이언트와 백엔드 서버 사이의 미들웨어입니다. 그 기능은 클라이언트가 보낸 요청의 실제 소스 주소를 숨기는 것입니다. Vue.js에서 역방향 프록시는 클라이언트 요청 수신, 원격 서버로 요청 전달, 서버 응답 반환, 클라이언트에 응답 전달 등의 기능을 완료할 수 있습니다.

역방향 프록시는 일반적으로 프록시 서버 주소를 구성해야 합니다. 이 주소는 일반적으로 IP 주소 또는 도메인 이름입니다. Vue.js에서 역방향 프록시 서버를 사용하고 서버가 특정 포트에서 실행되고 있는 경우 프록시 서버 주소 뒤에 포트 매개변수를 추가해야 합니다.

먼저 Vue.js 프로젝트의 루트 디렉터리에서 vue.config.js 파일을 열고 다음 구성을 추가합니다.

module.exports = {
devServer: {

proxy: {
  '/api': {
    target: 'http://127.0.0.1:3000',
    changeOrigin: true, // needed for virtual hosted sites
    pathRewrite: {
      '^/api': ''
    }
  }
}
로그인 후 복사

}
}

표시된 대로 위 코드에서는 표시된 것처럼 프록시 주소 "http://127.0.0.1:3000/api"로 역방향 프록시 서버를 구성했습니다. 그 중 "/api"는 전달해야 할 클라이언트 요청을 나타내고, "http://127.0.0.1:3000"은 전달해야 하는 원격 서버 주소를 나타냅니다. 프록시 서버가 특정 포트에 대한 요청을 수락하도록 하려면 대상 주소에 포트 번호를 추가하면 됩니다.

예를 들어 원격 서버가 포트 8000에서 실행 중인 경우 대상 주소를 "http://127.0.0.1:8000"으로 변경할 수 있습니다. 이러한 방식으로 Vue.js는 클라이언트 요청을 지정된 원격 서버로 성공적으로 전달할 수 있습니다.

일반적으로 Vue.js의 역방향 프록시 기능은 매우 강력하며 도메인 간 요청 문제를 해결하는 데 도움이 되어 프런트엔드 개발 작업을 단순화할 수 있습니다. Vue.js에서 역방향 프록시 서버를 사용해야 하고 특정 포트 번호를 지정해야 하는 경우 구성 파일에 해당 매개변수만 추가하면 됩니다.

위 내용은 Vue 역방향 프록시 IP가 포트에 연결할 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿