vue项目打包发布到Nginx后无法访问后端接口解决办法

老套路，一图胜千言，先附上一张浏览器里请求后端数据的动图

作为一个桌面软件开发者，为了给客户出示推送数据到http接口的demo，耗费一周时间写了个vue请求后端http接口的程序，结果在vscode里运行，请求后端接口没问题，打包发布到nginx就请求失败了，此处记录一下解决过程。

vue跨域代码
module.exports ={dev:{// PathsassetsSubDirectory:'static',assetsPublicPath:'/',proxyTable:{'/api':{target:'http://192.168.0.100:8090/',//要解决跨域的接口的域名secure:false,//如果是https接口，需要配置这个参数changeOrigin:true,// 如果接口跨域，需要进行这个参数配置pathRewrite:{'^/api':''// 路径重写,这里的api代替target里面的地址}}},

nginx配置文件代码

 #access_log  logs/host.access.log  main;

        location /{
            root   D:/xxx/web/vue001/;
            index  index.html index.htm;}

        #error_page  404/404.html;

        # redirect server error pages to the static page /50x.html
        #
        error_page   500502503504/50x.html;
        location =/50x.html {
            root   html;}

        # proxy the PHP scripts to Apache listening on 127.0.0.1:80
        #
        location /api/{
        proxy_pass   http://192.168.0.100:8090/;}

其中的关联性，分析一下应该能看明白，我也是初学就不在此卖弄了，问题是解决了，怎么解决的，原理是什么，后续如果深入这个领域再补课吧。