V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
phx13ye
V2EX  ›  Java

巨巨们,你们做 java web 一般怎么前后分离啊?

  •  
  •   phx13ye ·
    Alwayswithme · 2015-09-10 00:19:58 +08:00 · 13063 次点击
    这是一个创建于 3362 天前的主题,其中的信息可能已经有所发展或是发生改变。

    前端都有自己的依赖管理工具了, webapp 目录现在是不是可以不要了, 也不用 maven 或 gradle 管理了
    还是说把 package.json 和 webpack 相关配置放在 webapp 这里

    比如我用 spring mvc ,是不是只用 RestControllerRestful API 就可以了, ViewResolver 都不要配了。

    这些 API 的 RequestMapping 一般都是相对 ApplicationContext 的路径,前端 ajax 请求怎么指定 url 比较好啊

    求思路,求项目点星星

    17 条回复    2015-09-30 14:44:57 +08:00
    honam
        1
    honam  
       2015-09-10 00:42:15 +08:00   ❤️ 1
    webapp 貌似不会用到, java 只写后端接口, node 层做中后端,前端页面也自己玩,不会涉及到后台
    liujiangbei
        2
    liujiangbei  
       2015-09-10 01:48:04 +08:00 via iPhone   ❤️ 1
    简单粗暴的 前端所有资源包括 html 都部署到静态集群 页面加载完后再去 ajax 你的配置和接口 页面 load 完后 所有请求都是 ajax 这样你们就没有半点关系了 所有接口都是 resetful API 用 node 做中后端很棒 不过人力资源有限
    fuermosi777
        3
    fuermosi777  
       2015-09-10 02:25:26 +08:00
    @liujiangbei 这样的话 SEO 怎么办?
    hantsy
        4
    hantsy  
       2015-09-10 08:05:27 +08:00   ❤️ 3
    前后可以分不同的项目进行啊。

    1. 前端页面可以是纯静态页面,用 NodeJS 或者 Ngnix , Apache 运行。这是使用 SPA 模式的理想情况。
    2. 后端提供 REST 服务,可以是 PHP , NODE , Java ,.NET 等,或者混合( API gateway 或者 Proxy 将不同服务继续拆分,这可能向现在最热的 MicroService 发展了)。

    跨域问题可以用前端服务器代理解决(或者后端服务器上使用 CORS Filter ,或者 Spring 4.2 内置的方案),对于 Web 应用,代理方式比较简单。在前端项目中使用服务器代理,同样可以使用相对路径调用 REST API ,如果 /api/users,实际上指向的是后端 API 路径, http://localhost:9000/api/users.
    Septembers
        5
    Septembers  
       2015-09-10 08:09:13 +08:00 via Android   ❤️ 1
    后端提供 RESTful
    前端不管
    hantsy
        6
    hantsy  
       2015-09-10 08:12:15 +08:00   ❤️ 1
    @phx13ye https://github.com/hantsy/angularjs-springmvc-sample , 我的例子,前后编程完全是分离的,但这个没将其分为两个项目来运行。
    br00k
        7
    br00k  
       2015-09-10 09:16:52 +08:00   ❤️ 1
    自己弄过前端用 angularjs ,后端只用提供接口。静态页面放在 nginx ,接口请求通过 nginx 代理到 java 后端处理。
    phx13ye
        8
    phx13ye  
    OP
       2015-09-10 09:45:00 +08:00
    @hantsy 嗯,你前端不用 npm 管理吗?
    phx13ye
        9
    phx13ye  
    OP
       2015-09-10 09:53:27 +08:00
    @Septembers 这样假如我做验证,是不是一般用 Oauth 啊, 跳转重定向都是前端负责吗??
    hantsy
        10
    hantsy  
       2015-09-10 10:00:20 +08:00
    @phx13ye 用啊
    hantsy
        11
    hantsy  
       2015-09-10 10:01:53 +08:00
    @phx13ye 我那个只是 Demo 而已,以前项目中 Admin UI , Website , Mobile APP (ionic ) 都是基于 gulp 构建的。
    phx13ye
        12
    phx13ye  
    OP
       2015-09-10 10:15:27 +08:00
    安利一下 spring 的傻根,我暂时还没弄懂,算不算前后分离啊:
    https://github.com/spring-io/sagan
    https://github.com/bclozel/spring-resource-handling
    hantsy
        13
    hantsy  
       2015-09-10 10:18:25 +08:00   ❤️ 1
    @phx13ye 验证很简单,前端检测一下没有有验证过, Angular 中可以直接使用 intecepter 方式拦截 REST API ,如果没验证( 401 状态直接跳转登录),直接转登录,登录后记录登录信息( SPA 程序可以用 LocalStorage 存放)。这个过程用不用 OAuth2 都可以。

    一般应用(如果你不做开放平台,不需要开放 API 给第三方程序调用的话)我更倾向使用更简单的方案,比如 Spring Session 这个项目。
    crayhuang
        14
    crayhuang  
       2015-09-10 10:31:54 +08:00
    前端 vue.js ,后端提供 restful API
    phx13ye
        15
    phx13ye  
    OP
       2015-09-11 00:56:38 +08:00
    好多收藏,有一种走上人生巅峰的感觉

    马克一下我目前的做法, 希望也对你们有帮助

    ## java 相关
    tomcat 在 8080 端口跑 ApplicationContext 为`api`的 webapp
    就是我访问 localhost:8080/api/welcome 可以定位到 @RequestMapping ("/welcome") 的一个 controller 的方法

    ## webpack 相关
    前端相关的东西用 webpack-dev-server 跑
    webpack-dev-server 启动命令 `npm run dev` 和相关参数
    ### package.json 文件
    "scripts": {
    "dev": "webpack-dev-server --devtool eval --progress --colors --hot --content-base ./build"
    }

    # webpack.config.js 文件
    module.exports = {
    // webpack 相关配置 。。。
    devServer: {
    port: 9090,
    proxy: {
    "/api/*": "http://localhost:8080"
    }
    }
    }

    每一次修改经过 webpack 编译后在`http://localhost:9090/webpack-dev-server/` 上浏览器会自动刷新

    ## 发请求
    $.ajax ({
    method: "GET",
    url: "/api/welcome"
    })
    .done (function ( msg ) {
    console.log (msg );
    });

    ## see also
    http://christianalfoni.github.io/react-webpack-cookbook/Automatic-browser-refresh.html
    http://webpack.github.io/docs/webpack-dev-server.html
    http://stackoverflow.com/questions/26785268/webpack-dev-server-with-bypass-proxy
    ecyao
        16
    ecyao  
       2015-09-11 19:39:53 +08:00
    广州旅游 APP 求资深 JAVA ,高薪,带团队 邮箱: [email protected]
    liujiangbei
        17
    liujiangbei  
       2015-09-30 14:44:57 +08:00
    @fuermosi777 seo 这个问题确实存在,但是并不是所有的业务都需要 seo , seo 是个相对问题。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1500 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 25ms · UTC 17:14 · PVG 01:14 · LAX 09:14 · JFK 12:14
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.