작은 프로그램 개발 시 403 오류 해결 방법

문제 분석:

프런트 엔드 프로그램이 백엔드 서버에 요청을 보낼 때 서버가 도메인 간 요청을 허용하지 않으면 403 오류가 발생한다는 것을 알고 있습니다(오류 메시지는 다음과 같습니다). "잘못된 CORS 요청"). 그렇다면 이 문제를 해결하는 방법은 무엇입니까?

(학습 동영상 공유: 프로그래밍 동영상)

해결책:

다음 코드에 표시된 대로 신뢰할 수 있는 도메인을 CORS 허용 소스 주소 목록으로 구성합니다.

@Bean
public CorsFilter corsFilter() {
   UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
   CorsConfiguration config = new CorsConfiguration();
   config.setAllowCredentials(true);
   config.addAllowedOrigin("http://localhost:3000");
   config.addAllowedOrigin("http://127.0.0.1:3000");
   config.addAllowedOrigin("http://127.0.0.1:55135");
   config.addAllowedHeader(CorsConfiguration.ALL);
   config.addAllowedMethod(CorsConfiguration.ALL);
   source.registerCorsConfiguration("/**", config);
   CorsFilter bean = new CorsFilter(source);
   return bean;
}

WeChat 애플릿 개발의 경우 상황은 다음과 같습니다. 조금 다르게 위챗 애플릿은 도메인 이름 형태의 https 연결만 허용하기 때문에 Peanut Shell과 같은 인트라넷 침투 도구를 통해 외부에서 접근 가능한 공개 도메인 이름이 구축되고, 공개 도메인 이름은 내부 주소를 가리킵니다.

디버깅 중에 불법 도메인 간 요청 문제에 직면했습니다. 그 이유는 백엔드 서버를 요청할 때 WeChat 개발자 도구가 요청 헤더에 Origin 필드를 포함하므로 서버가 도메인 간 요청이라고 판단하기 때문입니다. Fiddler와 같은 도구를 통해 패킷을 캡처하고 다음 정보를 볼 수 있습니다.

POST https://xxx.xxx.net/public/login HTTP/1.1Host: sharework.gicp.netConnection: keep-aliveContent-Length: 50Pragma: no-cacheCache-Control: no-cacheOrigin: http://127.0.0.1:55135User-Agent: Mozilla/5.0 (iPhone; CPU iPhone OS 9_1 like Mac OS X) AppleWebKit/601.1.46 (KHTML, like Gecko) Version/9.0 Mobile/13B143 Safari/601.1 wechatdevtools/1.02.1902010 MicroMessenger/6.7.3 Language/zh_CN webview/ token/e011a64b71b385130aa1f595fe48521ccontent-type: application/jsonAccept: */*Referer: https://servicewechat.com/wx955fc9354838fd46/devtools/page-frame.htmlAccept-Encoding: gzip, deflate, br
{"account":"user","password":"defaultPassword123"}

이유는 여기에 있습니다. 휴대폰에서 직접 미리 보거나 디버깅하는 경우에는 이 문제가 발생하지 않습니다.

CORS 액세스를 허용하는 도메인에 http://127.0.0.1:55135를 추가하면 행복하게 디버깅을 시작할 수 있습니다.

물론 55135번 포트는 자주 바뀌는데 아직까지 수정할 방법을 찾지 못했습니다. 현재 다음 방법을 통해 이 포트를 빠르게 찾을 수 있습니다(예: Windows):

1. tasklist | findstr "wechat", 12824

E:\apps\data-integration>tasklist | findstr "wechat"
wechatdevtools.exe           13180 Console                    2     98,572 K
wechatdevtools.exe           11092 Console                    2      7,676 K
wechatdevtools.exe           15276 Console                    2    132,520 K
wechatdevtools.exe           18380 Console                    2    136,748 K
wechatdevtools.exe            8652 Console                    2     26,100 K
wechatdevtools.exe           12824 Console                    2    183,668 K
wechatdevtools.exe           16124 Console                    2     89,524 K
wechatdevtools.exe            1164 Console                    2    103,336 K
wechatdevtools.exe           12616 Console                    2     77,056 K
wechatdevtools.exe           13136 Console                    2     83,312 K

2와 같이 메모리 사용량이 가장 많은 프로세스 번호를 찾습니다. -ano | findstr "12824 ", LISTENING 상태의 라인과 우리가 찾고 있는 포트인 유일한 포트

E:\apps\data-integration>netstat -ano | findstr "12824"
  TCP    127.0.0.1:28475        0.0.0.0:0              LISTENING       12824
  TCP    127.0.0.1:28475        127.0.0.1:61306        ESTABLISHED     12824
  TCP    127.0.0.1:28475        127.0.0.1:61318        ESTABLISHED     12824
  TCP    127.0.0.1:28475        127.0.0.1:61402        ESTABLISHED     12824
  TCP    127.0.0.1:28475        127.0.0.1:61403        ESTABLISHED     12824
  TCP    127.0.0.1:55135        0.0.0.0:0              LISTENING       12824

3, 55135를 찾습니다.

관련 추천: WeChat 미니 프로그램 개발 튜토리얼

위 내용은 작은 프로그램 개발 시 403 오류 해결 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!