当前位置:首页 > 技术分析 > 正文内容

vue+nginx代理配置,解决跨域问题

ruisui884个月前 (01-15)技术分析23

举例登录接口,ip地址是随便举例的,实际生成地址域名,不一定是本地ip。

前端首页地址是:http://192.168.1.25:8080/#/login,

前端登录的地址是:http://192.168.1.25:8080/api/login

后端登录接口地址是:http://192.168.1.24:8081/login

1、vue项目的config里的Index.js


proxyTable: {
          '/api': {
            target: 'http://192.168.1.24:8081',
            changeOrigin: true,
            pathRewrite: {
                  '^/api': ''
              }
          }
        },

2、nginx配置


    server {
        listen  8081;
        server_name 127.0.0.1;
        charset utf8;
        #access_log  logs/host.access.log  main;

        location /{
            root  /usr/local/tomcat/webapps/ROOT;
            index  index.html index.htm;
            
        }
		
        location /api{
           rewrite ^.+api/?(.*)$ /$1 break;
           include uwsgi_params;
           proxy_pass http://192.168.1.24:8081;
        }

    }

为什么需要这样处理呢?因为前后端分离了,有可能会出现跨域问题。

其实有没有其他办法,不需要这样代理的。

当然有的,可以部署一个Servlet项目作为sdk,然后再由sdk做转发到你的后端地址即可。

还有其他办法的,可以私信教一下我。

扫描二维码推送至手机访问。

版权声明:本文由ruisui88发布,如需转载请注明出处。

本文链接:http://www.ruisui88.com/post/316.html

分享给朋友:

“vue+nginx代理配置,解决跨域问题” 的相关文章

总结了Vue3的七种组件通信方式,别再说不会组件通信了

写在前面本篇文章是全部采用的<script setup>这种组合式API写法,相对于选项式来说,组合式API这种写法更加自由,具体可以参考Vue文档对两种方式的描述。本篇文章将介绍如下七种组件通信方式:propsemitv-modelrefsprovide/injecteventBusv...

「2022」打算跳槽涨薪,必问面试题及答案——VUE篇

1、为什么选择VUE,解决了什么问题?vue.js 正如官网所说的,是一套构建用户界面的渐进式框架。与其它重量级框架不同的是,vue 被设计为可以自底向上逐层应用。vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另外一方面,当与现代化工具链以及各种支持类库结合使用时,vu...

我的VIM配置

写一篇关于VIM配置的文章,记录下自己的VIM配置,力求简洁实用。VIM的配置保存在文件~/.vimrc中(Windows下是C:\Users\yourname \_vimrc)。VIM除了自身可配置项外,还可插件扩展。VIM的插件一般用vundle或vim-plug来管理,但我力求简单,不打算装太...

别让“跑焦”毁所有!仅需这一项设置,即可显著改善镜头对焦精度

我常常会收到一些摄影爱好者的私信,也一直在努力的帮助大家解决更多摄影中常见问题。在我收到的所有问题中。有一个问题是最麻烦的,那就是“为什么我的图像看起来模糊?”。这个问题几乎每个人都遇到过,究其原因可以说是多种多样相对复杂。起初我一直认为是对焦问题所导致,也就有了我之前所写的“后按对焦”以及“对焦模...

一起学Vue:路由(vue-router)

前言学习vue-router就要先了解路由是什么?前端路由的实现原理?vue-router如何使用?等等这些问题,就是本篇要探讨的主要问题。vue-router是什么路由是什么?大概有两种说法:从路由的用途上来解释路由就是指随着浏览器地址栏的变化,展示给用户的页面也不相同。从路由的实现原理上来解释路...

22《Vue 入门教程》VueRouter 路由嵌套

1. 前言本小节我们介绍如何嵌套使用 VueRouter。嵌套路由在日常的开发中非常常见,如何定义和使用嵌套路由是本节的重点。同学们在学完本节课程之后需要自己多尝试配置路由。2. 配置嵌套路由实际项目中的应用界面,通常由多层嵌套的组件组合而成。同样地,URL 中各段动态路径也按某种结构对应嵌套的各层...