3

I want to permanently enable CORS on the default PHP Docker container (https://hub.docker.com/_/php). What is the configuration in docker-compose.yaml or docker-compose.yaml?

This is the request from ReactJS with axios

  class App extends React.Component {
    ... getUsers() {

    axios.get(`http://127.0.0.1:8000/index.php/api`).then(res => {

      this.setState({ users: res.data });

      console.log(state.users);

      // this.setState({ users });

    });

  }

ERROR: Access to XMLHttpRequest at 'http://127.0.0.1:8000/index.php/api' from origin 'http://127.0.0.1:8080' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

docker-compose.yaml

version: '3.3'
services:
  web:
    build:
      context: ./php
      dockerfile: Dockerfile 
    container_name: php74
    depends_on: 
      - db
    volumes:
      - ./php:/var/www/html/
    ports: 
      - 8000:80
  db:
    container_name: mysql8
    image: mysql:latest
    command: --default-authentication-plugin=mysql_native_password
    restart: always
    environment:
      MYSQL_ROOT_PASSWORD: root
      MYSQL_DATABASE: test_db
      MYSQL_USER: devuser
      MYSQL_PASSWORD: devpass
    ports:
      - 3306:3306

Dockerfile:

FROM php:7.4-apache
RUN apt-get update && apt-get upgrade -y 
RUN docker-php-ext-install mysqli && docker-php-ext-enable mysqli
EXPOSE 80
lito
  • 3,105
  • 11
  • 43
  • 71
  • 1
    try writing in a file .htaccess Header set Access-Control-Allow-Origin "*" – Aleksandr Jan 10 '20 at 23:06
  • @Aleksandr I added this line there but it gave me `500 error`. Then, have looked for an indeed `.htaccess`. Finally, it has solved by [this answer](https://stackoverflow.com/a/60109320/6602159). – M. Rostami Sep 23 '20 at 07:27

2 Answers2

5

You need to add the relevant header in apache configuration in the image. You will also need to enable mod_headers as it is not by default in your image. I used a similar technique as the one described on php docker image documentation (search for "Changing DocumentRoot (or other Apache configuration)" on the page).

Here is a possible Dockerfile. I added as well some good practice to limit the size of layer after running apt.

FROM php:7.4-apache

RUN apt-get update && apt-get upgrade -y \
    && apt-get clean && rm -rf /var/lib/apt/lists/*

RUN docker-php-ext-install mysqli && docker-php-ext-enable mysqli \
    && a2enmod headers
    && sed -ri -e 's/^([ \t]*)(<\/VirtualHost>)/\1\tHeader set Access-Control-Allow-Origin "*"\n\1\2/g' /etc/apache2/sites-available/*.conf

EXPOSE 80

References:

Zeitounator
  • 38,476
  • 7
  • 53
  • 66
  • thanks, I deleted the containers with "docker rm php74" and added the line to my file "Dockerfile". it is not working yet. DO you know how can I make sure it is working? – lito Jan 11 '20 at 00:55
  • am I suppose to find the "Access-Control-Allow-Origin" inside the .config files in path "/etc/apache2/sites-available" in the docker container when I get into the docker with "docker exec -it php74 bash"? – lito Jan 11 '20 at 00:58
2

Thanks to @Zeitounator is working.

This is the version of Dockerfile (nano installed but not needed):

FROM php:7.4-apache
RUN apt-get update && apt-get upgrade -y && apt-get install -y nano
RUN docker-php-ext-install mysqli && docker-php-ext-enable mysqli \
    && a2enmod headers \
    && sed -ri -e 's/^([ \t]*)(<\/VirtualHost>)/\1\tHeader set Access-Control-Allow-Origin "*"\n\1\2/g' /etc/apache2/sites-available/*.conf
ENV TERM xterm
EXPOSE 80

Note: Remeber to delete your images and recreate them https://www.digitalocean.com/community/tutorials/how-to-remove-docker-images-containers-and-volumes

docker system prune -a // be careful with this one it will delete all your images
lito
  • 3,105
  • 11
  • 43
  • 71