장면:
프론트 엔드 및 백엔드 분리 및 로컬 프론트 엔드 개발 및 전화 인터페이스에는 도메인 간 문제가 발생합니다. 일반적으로 세 가지 해결책이 있습니다.
1. 백엔드 인터페이스 패키지 로컬로 실행할 수 있습니다 (단점 : 백엔드 업데이트가 업데이트 될 때마다 테스트 서버의 다음 업데이트 패키지로 이동해야하며 로컬로 운영하는 Java 실행 환경을 구축해야합니다.
2. Cors Cross-Domain : 백엔드 인터페이스가 반환되면 'Access-Control-Olkal-Origin'을 추가합니다.
3. Nodejs를 사용하여 로컬 HTTP 서버를 구축하고 인터페이스 URL에 액세스 할 때 전달하고 로컬 개발 중 크로스 도메인 문제를 완벽하게 해결하십시오.
사용 된 기술 :
1. Nodejs가있는 로컬 HTTP 서버를 구축하십시오
2. 인터페이스 URL을 전달하려면 Node-HTTP-Proxy를 적용하십시오
특정 방법 :
1. Node.js는 로컬 HTTP 서버를 구축합니다. Shawn.xie의 "Nodejs는 로컬 HTTP 서버를 빌드"를 참조하십시오.
2. Node.js는 Node-HTTP-Proxy를 전달하는 데 사용됩니다. 공식 문서는 https://github.com/nodejitsu/node-http-proxy#using-https입니다
3. 작업 방법은 http://hao.jser.com/archive/10394/?utm_source=tuicool&utm_medium=referral을 참조합니다
4. 여기 내 자신의 실제 작업이 있습니다
프로젝트 준비
1. NPM 초기화
npm init
2. Node-HTTP-Proxy 모듈을 설치하십시오
NPM 설치 http-proxy -save-dev
3. 프로젝트 구조
다음 예에서는 HTML 파일을 루트 디렉토리 './'에 직접 넣거나 proxy.js에서 사용자 정의 할 수있는 웹 사이트 디렉토리를 지정합니다.
HTTP 서버 및 프록시 전달을 구성하십시오
var port = 3000; var http = require ( 'http'); var url = require ( 'url'); var fs = require ( 'fs'); var mine = require ( './ mine'). type; var path = require ( 'path'); var httpproxy = reque ( 'http-proxy'); 'http://192.168.10.38:8180/', // 인터페이스 주소 // 다음 설정은 https // ssl에 사용됩니다 : {// key : fs.readfilesync ( 'server_decrypt.key', 'utf8'), // cert : fs. screts ','utf8 '),') false}); proxy.on ( 'error', function (err, req, res) {res.writehead (500, { 'content-type': 'text/plain'}); console.log (err); res.end ( '무언가 잘못된 오류 메시지를보고합니다. url.parse (request.url). // var realpath = path.join ( "메인 페이지", pathname); '알 수없는'; // 인터페이스 액세스 인 경우 판단 if (pathname.indexof ( "mspj-mall-admin")> 0) {proxy.web (요청, 응답); return;} fs. exists (realpath, function (Exists) {if (! Exists) {explice.writehead (404, 404, { 'text-type'); 요청 URL " + pathName +"이 서버에서 찾을 수 없었습니다. "); response.end ();} else {fs. ReadFile (realPath,"binary ", function (err, file) {if (err) {response.writehead (500, { 'content-type': 'text/plain'}); responsive.end (err) | "text/plain"; response.writehead (200, { 'content-type': contenttype}); response.write (파일, "binary"); response.end ();}});}});}); server.listen (포트); "포트에서 실행되는 서버 :" + port + ");Mine.js
여기서 우리는 Shawn.xie의 소스 코드를 참조하고 몇 가지 글꼴 파일을 추가합니다.
Exports.Types = { "CSS": "Text/CSS", "GIF": "Image/Gif", "HTML": "Text/Html", "ICO": "Image/X-ICon", "JPEG": "image/jpeg", "jpg": "image/jpeg", "텍스트/JSON": "Application/JSON", "PDF": "Application/PDF", "PNG": "Image/PNG", "SVG": "Image/SVG+XML", "SWF": "Application/X-Shockwave-Flash", "Tiff": "Image/Tiff", "TXT": "Text/Plain", "wav" "Audio/X-MS-Wma", "WMV": "비디오/X-MS-WMV", "XML": "Text/XML", "Woff": "Application/X-Woff", "Woff2": "Application/X-Woff", "TFF": "Application/X-Font-Truetype", "OTF": ""Application/x-font-" "응용 프로그램/vnd.ms-fontobject"};위는 모든 소스 코드입니다
그런 다음 프로젝트의 인터페이스 주소를 http : // localhost : 3000/...으로 변경하십시오.
Nodejs 서비스를 시작하십시오
CMD를 시작하고 프로젝트 디렉토리를 찾고 실행하십시오
노드 proxy.js
입장:
http : // localhost : 3000/index.html
프로젝트에서 데이터가 http : // localhost : 3000/......에서 얻은 다음 지역 지역으로 전달 될 것임을 알 수 있습니다.
이렇게하면 크로스 도메인이 없습니다.
위의 것은 지역 개발 Ajax의 교차 도메인 문제를 해결하기 위해 Node.js 및 Node-HTTP-Proxy에 대한 편집기의 소개입니다. 모든 사람에게 도움이되기를 바랍니다. 궁금한 점이 있으면 메시지를 남겨 주시면 편집자가 제 시간에 모든 사람에게 답장을 드리겠습니다. Wulin.com 웹 사이트를 지원해 주셔서 대단히 감사합니다!