通過axios requert調用php文件已被VUE CLI 3中的CORS策略阻止

Question

我在vue cli 3中通過axios get方法調用php文件。我的服務器：節點js和wamp服務器我的app（ 節點 ）路徑http：// localhost：8080 / ＆我的WAMP路徑http：// localhost：80 。

現在我has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource ，我看到了https://cli.vuejs.org/config/#devserver-proxy，但它不能正常工作為了我。

在我的vue.config.js中

module.exports = { devServer: { proxy: 'http://localhost/' } }

我在視圖文件夾中的PHP文件路徑http：// localhost：80 / blog / src / views / php / imageUpload.php

我需要知道我錯在哪里。

這是我得到的錯誤：

這是我的代碼：

Answer 1

CORS機制用於強制客戶端請求來自屬於與默認部署服務器的域相同的域的應用程序。換句話說，它是確保我們自己的應用程序只是訪問我們的API的應用程序並防止屬於其他域的應用程序訪問它。 在您的情況下，客戶端應用程序和服務器應用程序使用不同的端口。 這打破了規則

請求從8080運行的應用程序啟動到運行在80的服務器API，盡管它們在同一個localhost中運行。端口不同。 這就是拋出CORS錯誤的原因。

請在您的PHP應用程序中將標題Access-Control-Allow-Origin為localhost:8080 ，以允許跨域請求。

請在此處閱讀CORS機制的功能概述