全新 Dubbo Admin 安装（开发版-Dubbo OPS）

时间 2019-12-09

标签全新 dubbo admin 安装开发 ops 栏目 Dubbo 繁體版

原文原文链接

这是正在研发的Dubbo Admin，这一版Dubbo Admin名称改为了Dubbo OPS，目前功能简陋，不建议使用（2018/11月）。架构上使用了先后端分离。前端使用Vue实现，后端使用Spring Boot实现。在安装以前你须要先安装Node和NPM用于运行前端项目。成功安装后长这样：javascript

前端部分

项目：dubbo-admin-frontendhtml

使用Vue.js做为javascript框架，Vuetify做为UI框架前端

后端部分

项目：dubbo-admin-backendvue

标准spring boot工程java

图node

下载项目

GitHub 项目地址： https://github.com/apache/incubator-dubbo-opswebpack

git clone https://github.com/apache/incubator-dubbo-ops.git

把项目clone下来后有git

后端项目：dubbo-admin-backend 前端项目：dubbo-admin-frontendgithub

生产环境配置

一、修改注册中心地址web

在application-production.properties中指定注册中心地址

dubbo-admin-backend/src/resources/application-production.properties

二、构建项目

mvn clean package

三、启动项目

mvn --projects dubbo-admin-backend spring-boot:run

四、访问

http://localhost:8080

五、Swagger 支持

部署完成后，能够访问ip:port来查看全部的restful api

http://localhost:8080/swagger-ui.html

开发环境配置

项目：dubbo-admin-backend

是一个标准spring boot工程，能够在任何java IDE中运行它

package org.apache.dubbo.admin;

import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.context.ApplicationContext;

@SpringBootApplication
public class DubboAdminApplication {

   public static void main(String[] args) {
      ApplicationContext act = SpringApplication.run(DubboAdminApplication.class, args);
      SpringUtil.setApplicationContext(act);

   }
}

项目：dubbo admin frontend

由npm管理和构建，在开发环境中，能够单独运行

构建安装程序

nodejs环境将自行安装，本文不介绍

# install dependencies
$ npm install

# serve with hot reload at localhost:8081
$ npm run dev

> dubbo-admin-frontend@1.0.0 dev F:\OpenSource\incubator-dubbo-ops\dubbo-admin-frontend
> webpack-dev-server --inline --progress --config build/webpack.dev.conf.js

 95% emitting DONE  Compiled successfully in 11312ms16:18:31

 I  Your application is running here: http://localhost:8081

页面访问 Dubbo OPS

访问 http://localhost:8081, 因为先后端分开部署，前端支持热加载，任何页面的修改均可以实时反馈，不须要重启应用。

图1 图2

跨域问题

为了方便开发，咱们提供了这种先后端分离的部署模式，主要的好处是支持前端热部署，在这种模式下，前端会经过8080端口访问后端的restful api接口，获取数据, 这将致使跨域访问的问题。所以咱们在dubbo-admin-frontend/config/index.js添加了支持跨域访问的配置,当前端经过npm run dev单独启动时，这些配置将被激活，容许跨域访问