亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

Angular 和 Golang“不存在訪問控制允許來源......”

Angular 和 Golang“不存在訪問控制允許來源......”

Go
慕森卡 2023-06-26 15:08:07
我正在使用 Angular 構建前端 GUI 應用程序,以與用 Go 編寫的 API 服務器進行交互。我嘗試在客戶端和服務器兩端添加標頭,但沒有成功。我嘗試禁用 http 攔截器,因此它不會添加 JWT 令牌,在這種情況下我會收到未經授權的訪問錯誤,這是預期的。但是,無論我將令牌添加到請求中(無論是使用攔截器還是在發出獲取請求之前手動),未經授權的訪問錯誤都會消失(到目前為止一切順利),但隨后會出現丟失標頭錯誤。服務器應該返回存儲文章的 JSON 數據,它可以與 Postman 和我的其他普通 JS 前端配合使用。去代碼:r.HandleFunc("/", func(w http.ResponseWriter, r *http.Request) {  http.ServeFile(w, r, "./index.html")})allowedHeaders := handlers.AllowedHeaders([]string{"X-Requested-With"})allowedOrigins := handlers.AllowedOrigins([]string{"*"})allowedMethods := handlers.AllowedMethods([]string{"GET", "HEAD", "POST", "PUT", "DELETE", "OPTIONS"})r.HandleFunc("/login", GetTokenHandler).Methods("POST")apiRouter := r.PathPrefix("/api").Subrouter()apiRouter.Use(jwtMiddleware.Handler)apiRouter.HandleFunc("/articles", getArticles).Methods("GET")apiRouter.HandleFunc("/articles/{id}", getArticle).Methods("GET")apiRouter.HandleFunc("/articles", createArticle).Methods("POST")apiRouter.HandleFunc("/articles/{id}", updateArticle).Methods("PUT")apiRouter.HandleFunc("/articles/{id}", deleteArticle).Methods("DELETE")fmt.Println("Server running on port", port)log.Fatal(http.ListenAndServe(port, handlers.CORS(allowedHeaders, allowedOrigins, allowedMethods)(r)))角度獲取請求:this.http.get('http://localhost:8000/api/articles').subscribe(res => {    console.log(res);},err => console.log(err));角度 HttpInterceptor:export class AuthInterceptor implements HttpInterceptor {    intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {        const token = localStorage.getItem("token");        if (token) {            const cloned = req.clone({                headers: req.headers.append("Authorization", "Bearer " + token)            });            return next.handle(cloned);        }        else {            return next.handle(req);        }    }}我收到此錯誤:...請求..已被 CORS 策略阻止:對預檢請求的響應未通過訪問控制檢查:請求的資源上不存在“Access-Control-Allow-Origin”標頭。
查看完整描述

2 回答

?
不負相思意

TA貢獻1777條經驗 獲得超10個贊

此問題稱為CORS。跨域資源共享。_?_?_?_?當請求和響應的來源不同時就會出現這種情況。例如:如果您的項目位于https://139.43.33.122:1111/并且您的服務器托管在https://123.0.3.444:3000上,那么您的請求和響應的來源完全不同,因此,瀏覽器將阻止響應。這是瀏覽器的事情。郵遞員并不關心它們的來源。要接收響應,有兩種方法(也許更多,但我只使用這兩種)。

  1. 附加標頭:如果您有權訪問/許可服務器代碼,則向服務器響應添加附加標頭:?Access-Control-Allow-Origin: http:?//siteA.com、Access-Control-Allow-Methods:GET、POST ,PUT,訪問控制允許標頭:內容類型

  2. 使用擴展:有多個擴展可以繞過此限制。如果您無權更改服務器響應,那么這就是可行的方法。我個人僅使用此方法。


查看完整回答
反對 回復 2023-06-26
?
智慧大石

TA貢獻1946條經驗 獲得超3個贊

以下事項將幫助您解決此問題:


1)由于您也在請求標頭中包含了授權,因此在服務器中允許似乎錯過了相同的授權。


2) 您可以使用 Proxy.config 映射到所需的主機(主機名 + 端口) a) 創建 proxy.config.json 文件:


{

? "/api/articles": {

? ? "target": "http://localhost:8000",

? ? "secure": false

? }

}

b) 通過以下命令運行:


ng serve --proxy-config proxy.conf.json

查看完整回答
反對 回復 2023-06-26
  • 2 回答
  • 0 關注
  • 162 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號