問題分析：
我們知道當前端程式向後台伺服器發送請求時，如果伺服器不允許跨網域請求，就會發生403錯誤（錯誤訊息為：「Invalid CORS request"）。那該怎麼解決這個問題呢？
（學習影片分享：程式設計影片）
解決方法：
將信任的網域配置到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;
}對於微信小程式的開發，情況有點不一樣，由於微信小程式只允許以域名方式的https連接，因此透過花生殼等內網穿透工具，搭建了一個外部可存取的公網域名，公網域名指向內部位址。
在偵錯時，就遇到了非法的跨域請求這個問題。原因是在向後台伺服器請求時，微信開發者工具在請求頭中，帶上了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"}原因就在這裡了。如果直接在手機上預覽或調試則不會遇到這個問題。
把http://127.0.0.1:55135加入到允許CORS存取的網域中，就可以愉快地開始調試了。
當然，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 、netstat -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就是我們要找的連接埠了。
相關推薦：微信小程式開發教學
#以上是開發小程式遇到403錯誤怎麼解決的詳細內容。更多資訊請關注PHP中文網其他相關文章！
