使用Dockerfile在单个端口中运行react和node

时间:2019-02-27 05:07:42

标签: node.js reactjs docker

我正在尝试为我的示例项目运行docker,其中在容器中我需要运行一个端口,但是react代码的构建将用作index.html,我具有以下文件夹结构。

在index.js文件中,我尝试添加静态路径,这里我在做什么错?我已经评论了。

我已经尝试了很多。

sampleapp
   client
     // using cra (create react app) files
     src
     public
     ...
   server
     index.js
   Dockerfile

// app.js

import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';

class App extends Component {
  state = {
    response: null
  }

  componentWillMount(){
    this.dataFetching()
  }

  dataFetching = async () => {
    const resjson = await fetch('/api/data');
    const res = await resjson.json();
    this.setState({
      response: res.data
    })
  }


  render() {
    return (
        this.state.response ? this.state.response : null
    );
  }
}

export default App;

// package.json --client

{
  "name": "client",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "react": "^16.8.3",
    "react-dom": "^16.8.3",
    "react-scripts": "2.1.5"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not ie <= 11",
    "not op_mini all"
  ],
  "proxy": "http://localhost:4000"
}

// index.js-服务器

const express = require('express');
const path = require('path');
const app = express();

// app.use(express.static(path.join(__dirname,  'build')));

// app.get('/*', function(req, res) {
//     res.sendFile(path.join(__dirname, '..', 'app', 'build', 'index.html'));
// });

app.get('/api/data', (req, res) => {
    res.send({data: "Success"})
})

app.listen(4000);

// Dockerfile-sampleapp

FROM node:10.15.1-alpine

COPY . /var/app

WORKDIR /var/app/client
RUN npm install --no-cache && npm run build && npm install -g serve


WORKDIR /var/app/server
RUN npm install --no-cache


EXPOSE 4000
EXPOSE 3000

1 个答案:

答案 0 :(得分:1)

对于Caused by: java.lang.RuntimeException: java.util.concurrent.ExecutionException: java.lang.IllegalArgumentException: context not bound: < TermId(516U), TermId(185U), TermId(186U) : Explicit > at com.bigdata.rdf.spo.SPORelation.insert(SPORelation.java:2272) at com.bigdata.rdf.store.AbstractTripleStore.addStatements(AbstractTripleStore.java:4392) at com.bigdata.rdf.rio.StatementBuffer$Batch.writeSPOs(StatementBuffer.java:2179) at com.bigdata.rdf.rio.StatementBuffer$Batch.addStatements(StatementBuffer.java:2027) at com.bigdata.rdf.rio.StatementBuffer$Batch.writeNow(StatementBuffer.java:1912) at com.bigdata.rdf.rio.StatementBuffer$Batch.access$1000(StatementBuffer.java:1645) at com.bigdata.rdf.rio.StatementBuffer$DrainQueueCallable.call(StatementBuffer.java:819) at com.bigdata.rdf.rio.StatementBuffer$DrainQueueCallable.call(StatementBuffer.java:795) at java.util.concurrent.FutureTask.run(FutureTask.java:266) at com.bigdata.util.concurrent.LatchedExecutor$1.run(LatchedExecutor.java:121) at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1149) at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:624) at java.lang.Thread.run(Thread.java:748) Caused by: java.util.concurrent.ExecutionException: java.lang.IllegalArgumentException: context not bound: < TermId(516U), TermId(185U), TermId(186U) : Explicit > at java.util.concurrent.FutureTask.report(FutureTask.java:122) at java.util.concurrent.FutureTask.get(FutureTask.java:192) at com.bigdata.rdf.spo.SPORelation.logFuture(SPORelation.java:2298) at com.bigdata.rdf.spo.SPORelation.insert(SPORelation.java:2253) ... 12 more Caused by: java.lang.IllegalArgumentException: context not bound: < TermId(516U), TermId(185U), TermId(186U) : Explicit > at com.bigdata.rdf.spo.SPOIndexWriter.call(SPOIndexWriter.java:266) at com.bigdata.rdf.spo.SPOIndexWriter.call(SPOIndexWriter.java:68) at java.util.concurrent.FutureTask.run(FutureTask.java:266) ... 3 more ,您可以将其更改为以下内容:

Dockerfile

对于FROM node:10.15.1-alpine COPY . /var/app WORKDIR /var/app/client RUN npm install --no-cache && npm run build && npm install -g serve WORKDIR /var/app/server RUN npm install --no-cache EXPOSE 4000 CMD [ "npm", "start", "index.js" ] (服务器),您可以将其更改为以下内容:

index.js
  1. React将通过nodeJS用作静态文件
  2. const express = require('express'); const path = require('path'); const app = express(); app.get('/api/data', (req, res) => { res.send({data: "Success"}) }) app.use(express.static(path.join(__dirname, '..', 'client', 'build'))); app.get('/*', function(req, res) { res.sendFile(path.join(__dirname, '..', 'client', 'build', 'index.html')); }); app.listen(4000, '0.0.0.0'); 需要绑定到index.js,以便您可以从容器外部连接到它。