Vue跨域配置proxyTable问题

最近在做一个前后端分离的毕设，在前端向后端发送get请求时遇到了Vue跨域的问题。

been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header
is present on the requested resource

解决方案如下（以vue脚手架为例）：
1、打开config文件夹里面的index.js文件，找到proxyTable参数。这个参数是vue为我们解决跨域问题专门设置的。
2、修改参数（以我的项目为例）。我原本要请求的url是后端的地址，http://localhost:8083/predict/api 但是我前端的地址是http://localhost:8080 于是产生了跨域问题。此时，只需要把proxyTable设置成如下
target表示服务器端的地址,changeOrigin表示是否跨域。
‘/predict’: {}, 就是告诉node, 我接口只要是’/predict’开头的就用代理.所以你的接口就要这么写

‘^predict’ :'predict'

表示将路径中的predict换为predict，因为我请求路径中原本就有predict所以我就不用修改，不用修改就是这么写。如果你的predict只是为了标识使用代理，实际上不存在，那就把predict替换成空，如下。

‘^predict’ :''

注意predict只是我自己的路径，不是本身就带有的参数，你需要根据自己的路径来重写。

3、修改完之后，还有一个坑，可能因为浏览器、端口存在缓存，不会立即生效，这时候可以尝试把前端的端口改一下再改回去，清除掉缓存。还是index.js文件，修改里面的port参数的数值即可。
4、npm run dev

此时，在浏览器看到的url依旧是前端的url请求，但是实际上请求会被代理至服务器端

参考文章https://blog.csdn.net/weixin_34400525/article/details/88798160
https://blog.csdn.net/ZXT149074136/article/details/100016891