部署再nginx上的vue如何才能取到后台的接口数据呢? 20C

部署再nginx上的vue如何才能取到后台的接口数据呢?
基本介绍:
(1)项目采用完全的前后端分离开发与部署;
(2)前端采用vue,后端采用springboot开发;
(3)前端部署在nginx上,后端部署在websphere服务器上。
假设前端项目vue项目部署在A服务器上,后端部署在B服务器上,即A与B的ip不相同,
那么前端的vue项目如何才能请求到部署在B上的后端接口数据呢?vue需要什么特殊配置吗?
nginx的配置需要什么特殊的吗?
望各位大佬不吝赐教,小白我在此跪谢!

0

1个回答

0
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
其他相关推荐
Nginx 部署 vue 并且 跨域访问 后端 接口
先说一下我遇到的问题: 前端 后端 分离的项目 部署到一个服务器上,前端用的vue,后端用的 springBoot 我之前的想法认为 我的 前端vue 放到Tomcat容器中,然后后端是 springBoot 项目直接启动 在用Nginx 配置代理 后端的 端口 重点:其实 并不是我认为的那样,是我 前端vue 挂到 Nginx 上 然后 Nginx 代理后端 端口号进行访问 步入正题: 后...
nginx下部署vue项目
今天要用到服务器nginx,还需要把自己的vue的项目部署到服务器上去所以就写一下记录下来。首先要去nginx官网下下载nginx: 下载地址:https://nginx.org/en/download.html 下载下来会是一个解压包,解压到你想放的文件夹下运行nginx.exe,然后打开浏览器输入localhost出来如下图片所示就说明成功了:然后如果没有成功
nginx部署vue项目
1.使用hbuilder新建vue项目,右键新建-->项目-->vue项目,如下图: 2.建成的项目如下testVue 3.右键项目名称,打开项目所在目录,打开cmd,转到testVue项目根目录下 (1)E: (2)cd E:\interest-master\interest-master\TestVue dist和node_modules原本没有,下面讲...
vue多项目nginx部署
一. 项目目的 1. 问题 实现服务端同一域名下部署多个vue项目。 2. 实例说明 kefu项目: https://www.test.com/kefu/... collect项目: https://www.test.com/collect/... lend项目:   https://www.test.com/lend/... 二. 客户端配置修改 1. index.h
vue在nginx中部署
vue在nginx中部署本文主要介绍如何在nginx中部署vue前端。本文阅读前提:1、已经安装好nginx,可以参考如下文章:http://blog.csdn.net/wild46cat/article/details/780249892、已经打好vue的包,如果遇到问题,可以参考:http://blog.csdn.net/wild46cat/article/details/78024796好,...
在Nginx上部署vue项目(Mac版)
构建项目 将vue项目打包,打包后会在项目根路径下生成一个dist文件,这个就是需要发布到nginx服务器上的静态页面。(不同项目配置的打包命令可能稍有不同) $ npm run dev 安装Nginx 1、打开terminal终端 2、安装Command Line Tools $ xcode-select --install 3、安装brew命令 $ ruby -e "$(...
vue请求后台接口
vue不支持直接发送AJAX请求,需要使用vue-resource、axios等插件实现。 一.使用axios发送AJAX请求: 1.安装axios并引入: 1)npm install axios -S (直接下载axios组件,下载完毕后axios.js就存放在node_modules\axios\dist中),首先在 main.js 中引入 axios:在此文件加入import axio...
如何部署vue前端项目到服务器上(nginx处理跨域)
注: 本文选择了nginx做web服务器。 因为在本文vue前端项目中,需要从接口获取数据,可是数据与vue前端项目是在同一ip地址但不同端口号,所以需要跨域读取数据。本文的跨域处理是使用了nginx。 环境: 阿里云服务器(ubuntu 64bit) xshellnginx 1.使用xshell登录到阿里云服务器。安装nginx(本文安装到/etc下) cd /etc
vue mock数据,模拟后台接口
在前端开发过程中,有后台配合是很必要的。但是如果自己测试开发,或者后台很忙,没时间,那么我们需要自己提供或修改接口。下面提供两种方式,第二种更简单,个人推荐第二种。 一、mock文件 1、安装,开发环境 npm i mockjs -D 2、在src目录下新建mock目录,结构如下: 3、index.js内容如下: const Mock = require('mockjs'); ...
vue打包部署nginx 配置
vue开发完毕,打包之后上线,传到nginx服务器配置问题解决
nginx部署Vue前端项目
nginx nginx地址:10.0.1.101 位置:/usr/local/nginx/ 访问地址:10.0.1.101:80 启动[root@bj-esbp-mid1 sbin]# ./nginx查看进程[root@bj-esbp-mid1 sbin]# ps -ef | grep nginx root 14982 1 0 14:13 ? 00:00:00 n
Vue项目与nginx部署跨域问题
目录 Vue项目的跨域问题: Vue项目部署到nginx上的跨域问题解决 Vue项目的跨域问题:     在使用Vue构建的前端工程中,访问本地不同ip与端口,都会存在跨域问题,下面给出一个使用代理解决的办法:     在config目录的index.js文件中,添加:      proxyTable: { '/api':{ target:'ht...
vue使用nginx部署配置
一、打包(mode:history) a.打开config的文件夹中的index.js 如图把assetsPUblicPath修改为‘/’ b.路由里修改mode,为的是把url的“#”去掉。路由path前面全部要加上/ c.npm run build打包后的dist目录上传到服务器的/opt目录下 二、nginx配置 //前端 location / { proxy_s...
docker下nginx部署vue项目
环境centos7 准备: 安装git 安装nodejs 安装docker 拉取git仓库 cd ~ #进入home目录 git clone *********.sto.git #后面是仓库地址 切换分支 cd ~/sto git branch -a #查看分支 以* 开头的是当前分支 *master dev remotes/origin/HEAD -&gt...
nginx部署多个vue项目
上一篇已经介绍了然后配置web项目;今天由于公司需求,需要在同一域名端口下,部署两个项目;今天花了一上午终于弄好了,选择赶紧做一个笔记。 如何连接阿里云服务器就不在这里说了,请看我以前的文章。 首先需要的效果 http://47.97.244.83/login http://47.97.244.83/student/login 文件目录 两个项目并列在同一文件夹内。 准备好两个vue的项目 ...
Nginx 部署Vue前端项目
1.Vue前端构建 ➜ npm run build 构建成功后基本会在配置的dist文件下生成静态html文件。 2.生成的静态代码上传到服务器 把生成目录dist里的文件打包上传至服务器(192.168.234.97) ➜ scp ./dist.zip root@192.168.234.97:/opt/www/vue-base 输入服务器登录密码。 上传到服务器静态地址...
在nginx上面部署vue项目
vue项目打包 1.npm run build 如果出错为 npm run build:prod 2.之后会生成dist文件夹 nginx的配置步骤 1.安装 sudo yum install nginx 2.加入系统启动项 sudo system start nginx 3.nginx 重载 nginx -s reload nginx -s reopen 注:每次更改完配置文件...
Apache,Nginx部署vue项目
vue项目直接打包发布在服务器上,访问项目非根目录路由,刷新界面的时候,会出现404情况。这是由于服务端不识别vue的路由配置,所以在遇到404的情况,要返回index.html,让vue自己去寻找自己的路由页面。 vue打包注意点请看我的另一篇博客:(有一定关联) https://blog.csdn.net/bocongbo/article/details/81670072 一、Apach...
windows系统上部署nginx
先说说nginx的作用。 nginx可以部署在PC上,使PC变成一个可以访问的WEB服务器。 什么意思呢,就是你把它部署到你的电脑上,你的电脑就成了一个WEB Server。这时候从浏览器输入你PC的ip地址或者对应的域名,就能访问你配置的网页了。
vue部署,nginx同域名多项目部署
1、修改vue生成参数 1、dist/index.html文件修改 添加 <meta base="/子目录名/"> 2、config/index.js文件修改 修改 assetsPublicPath: '/子目录名/' 3、src/router/index.js文件修改 添加 base: '/子目录名/' 2、nginx配置 server ...
vue请求后台接口跨域问题
在vue项目中通过axios请求后台接口,出现跨域问题。我的解决方法如下。 在config/index.js中有个 “ proxyTable:{ } “ ,在里面添加代理规则如下: target: ‘http://’+接口的域名 secure: false, // 如果是https接口,需要配置这个参数 changeOrigin:true,// 如果接口跨域,需要进行这个参数配置 注意: ‘...
vue模拟后台数据
在项目根目录存放json文件 在项目根目录创建一个server.js文件 var express = require("express"); var app = express(); var appData = require('./data.json'); var seller = appData.seller; var goods...
vue后台数据接入
在项目中如果要接的后台数据接口量大,则需要将接口统一管理,将axios封装后 在页面中相应的位置上调用
vue模拟后台数据
 最近正在学习vuejs这个框架,我安装的vuejs是2.9.3的版本,在环境配置完成后打开项目发现没有dev-server这个文件,当时我就懵了,这表示我无法在按照以前的方法进行数据模拟,后来参考资料说dev-server已经整合到了webpack.dev.conf.js里,我先在这里说明怎么在新版本里面的vue里进行后台数据模拟:首先找到const portfinder = require('...
vue请求后台数据
一,使用axios发送请求 axios 是一个基于Promise 用于浏览器和 nodejs 的 HTTP 客户端,它本身具有以下特征: 从浏览器中创建 XMLHttpRequest 从 node.js 发出 http 请求 支持 Promise API 拦截请求和响应 转换请求和响应数据 取消请求 自动转换JSON数据 1安装 :$ npm install axios 2,请求界面引入impor...
vue 请求后台数据
需要引用vue-resource安装请参考https://github.com/pagekit/vue-resource官方文档在入口函数中加入import VueResource from 'vue-resource' Vue.use(VueResource);在package.json文件中加入 "dependencies": { "vue": "^2.2.6", "vue-re
自动补全数据提取到后台
AJAX 的英语原意是“异步的 Javascript 和 XML”。rn这个本意对于我们现在理解日常的 Ajax 操作已经没有什么帮助了。rn首先“异步”这个词,因为缺乏历史背景现在让人觉得不知所谓了,另外 XML 现在基本上被 JSON 取代了。Ajax 就是使用 JS 来实现页面的局部刷新rnrn传统方式的AJax,以及各种jQuery方式的AJax、Ajax处理JSON数据等常见使用场景的讲解
SpringBoot jar包如何部署在nginx上
将web项目部署到服务器上,之前大多接触的是打包成war包部署。这次因为自己写了个小demo需要部署到个人网站下,所以实践了一次。 怎么安装nginx大家可以自行百度。 这里给出nginx.conf的配置 server { listen 80; server_name localhost; #charset koi8-r; ...
使用nginx发现接口获取到的数据被截取
接口数据被截取,使用nginx,接口数据过大的时候,nginx会将写入缓存查看nginx错误日志 出现如下错误信息,原来是权限问题 2017/06/20 14:36:28 [crit] 18223#0: *759884 open() "/usr/local/webserver/nginx/proxy_temp/2/36/0000001362" failed (13: Permission deni
DCOM如何配置 才能 部署到 internet上
其实 如何实现透明的权限访问rnrn在没有域的条件下,如何实现一台PC 调用另一台PC的DCOM,最好实现用户无关性rnrn运行环境 Win2k以上
如何一步步在生产环境上部署django和vue
本文由云+社区发表 本文主要讲述了如何一步步在生产环境上部署django和vue,操作系统默认为centos 说明:后文中出现的以下字符串均表示具体的路径或者名称,含义如下: DJANGO_DIR----表示django的工程根目录 DJANGO_NAME----表示django的工程名称 VUE_HTML_DIR----表示vue编译好的index.html路径 VUE_STATIC_...
如何一步步在生产环境上部署django和vue
本文由云+社区发表本文主要讲述了如何一步步在生产环境上部署django和vue,操作系统默认为centos 说明:后文中出现的以下字符串均表示具体的路径或者名称,含义如下: DJANGO_DIR----表示django的工程根目录 DJANGO_NAME----表示django的工程名称 VUE_HTML_DIR----表示vue编译...
Nginx上部署静态页面小结
最近要在VPS上解析域名然后部署NGinx作为个人站点,忙忙活活了一整天,虽说是很简单的功能,但是也遇到了很多坑。 在这里把他们写出了以作参考。 1、在Linux上安装Nginx,以Debian为例apt-get install nginx, 然后系统会自动安装Nginx相关文件,包括Nginx-full,Nginx-common2、Nginx安装完之后,ls -alh会看到nginx被放在/e
部署ruby_on_rails项目到nginx上
 然后进行bundle安装 bundle install rake db:dump //迁移数据库  配置生产环境使用的数据库:在config/database.yml文件添加如下内容:  production: <<: *default database: db/development.sqlite3 然后加载数据库: rake db:load RAILS_ENV='production' 生成安全密钥: rake sec
Nginx上部署https模块
生成密钥文件 在使用https时需要密钥文件,可以通过openssl来生成,同时,nginx的https模块也需要安装openssl的支持,生成密钥文件: openssl genrsa -des3 -out *.key 1024 openssl req -new -key *.key -out *.csr openssl rsa -in *.key -out *_nopass.key o...
将静态页面部署nginx上
步骤: // 域名自己随意写 1 修改host文件 127.0.0.1 www.taobao.com 2 修改nginx/conf/nginx.conf #windows文件服务器配置 server { listen 80; server_name www.taobao.com; charset utf-8; #浏览器打开路径:localhost:8098...
spring-boot gradle vue 前后端分离项目在腾讯云上部署到 tomcat nginx
前言 因为种种原因,把后端部署在 tomcat 上,前端项目部署在 nginx 上。 Tomcat tomcat 的运行没什么说的,将项目打包为 war,放在 webapps 下,启动 tomcat 会自动解压 war 包。 spring-boot 项目打 war 包部署到外部容器见文章末。 比如 etob.war ,放在 webapps 下,运行后 webapps 下会有一个 wa...
Windows服务器上用NGINX部署vue项目
背景:项目前端vue 2.0 + elementUI,后端spring boot 2.0.3,服务器是Windows 8。此处默认数据库已经安装到位。 1、服务器上安装NGINX,参考https://blog.csdn.net/yangfengjueqi/article/details/87973698 2、后端项目生成可执行jar包,参考https://blog.csdn.net/yangf...
nginx上部署thinkphp的解决方法
nginx上部署thinkphp的解决方法   最近在用thinkphp做个小东西,基本完成后部署到nginx服务器上才发觉nginx是不支持pathinfo的,网上搜索了别人的解决方法,有两种思路:1、修改thinkphp让他可以在nginx上运行2、修改nginx让它支持pathinfo 网上说nginx开启pathinfo是有一定风险的,能不用pathinfo最好不用,所以还是...
datagrid里面我如何取到数据呢?
各位,看了好多帖子关于鼠标操作的和取里面数据的问题,可是都没有详细的.主要是在datagrid里面用鼠标点一下那行,就可以得到里面的数据?该如何操作rn主要响应那几个事件?我觉得itemselected事件一直没有触发,这个事件是干什么用的呢?rn望能详细指导一下
相关热词 c# 线程顺序 c#昨天当前时间 c# 多进程 锁 c#mysql图片存取 c# ocx 委托事件 c# 读取类的属性和值 c# out 使用限制 c#获取url的id c#怎么进行分页查询 c# update 集合