Question

我正在使用docker-compose和其他人制作的图像，我想使用环境变量来动态分配它

docker-compose.yml

    @objc func keyboardWillShow(notification: NSNotification) {
        let keyboardFrame = (notification.userInfo?[UIResponder.keyboardFrameEndUserInfoKey] as? NSValue)?.cgRectValue
        let duration = ((notification.userInfo?[UIResponder.keyboardAnimationDurationUserInfoKey] as? NSNumber)?.doubleValue)!
        
        containerViewbottomAnchor?.constant = -keyboardFrame!.height

        
        UIView.animate(withDuration: duration) {
            self.view.layoutIfNeeded()
        }
        
    }

这是我的JavaScript，我想在其中获取变量，但我无法获取这些变量

api.js

version: "3.7"

services:
  appfronted2:
    image: trafex/alpine-nginx-php7
    container_name: fronted2
    ports:
      - "80:8080"
    volumes:
      - ./fronted2:/var/www/html
    environment:
      - HOST_BACKEND=172.99.0.11
      - PORT_BACKEND=4000
    networks:
      tesis:
        ipv4_address: 172.99.0.13

Answer 1

您正在使用nginx Web服务器容器来提供html和JS文件。 Web服务器将这些文件原样提供给浏览器。这与使用npm start的情况不同，在window.location.hostname中，Node引擎动态地提供HTML和JS文件。

当JS文件在客户端浏览器上运行时，没有名为process.env的变量。

在Create React应用程序中浏览有关以下问题的评论可能会帮助您了解更多信息：

https://github.com/facebook/create-react-app/issues/2353

如果没有更多的环境变量，最简单的解决方案是使用let backendHost; const hostname = window && window.location && window.location.hostname; if(hostname === 'whatsgoodonmenu.com') { backendHost = 'https://api.whatsgoodonmenu.com'; } else { backendHost = 'http://localhost:8080'; } export const API_ROOT = `${backendHost}`;并相应地准备或选择API URL。

app-config.js


import React from "react"
import {API_ROOT} from './app-config'

export default class UserCount extends  React.Component {
    constructor(props) {
        super(props);

        this.state = {
          data: null,
        };
    }

    componentDidMount() {
        fetch(`${API_ROOT}/count`)
            .then(response => response.json())
            .then(data => this.setState({ data }));
    }

    render(){
        return(
            <label>Total visits: {this.state.data}</label>
        );
    }
}

使用组件

-Dcom.sun.management.jmxremote \
-Djava.rmi.server.hostname=localhost \
-Dcom.sun.management.jmxremote.port=8001 \
-Dcom.sun.management.jmxremote.rmi.port=8001 \
-Dcom.sun.management.jmxremote.local.only=false \
-Dcom.sun.management.jmxremote.authenticate=false \
-Dcom.sun.management.jmxremote.ssl=false

如何将环境变量传递给Nginx中的前端Web应用程序？

1 个答案: