use custom build of langflow

[SVyusti]

@dosu I have langflow-0.6.19a1.tar.gz custom build of langflow.
i get 403 error when I run langflow in docker container:
An error has occurred while fetching types.
Please refresh the page.
provide the dockerfile and docker-compose to run this custom build

[dosubot[bot]]

Here's a Dockerfile and docker-compose.yml to run your custom build of Langflow (langflow-0.6.19a1.tar.gz) in a Docker container:

Dockerfile

# Dockerfile
FROM python:3.9-slim

# Set environment variables
ENV LANGFLOW_DATABASE_URL=postgresql://postgres:password@postgres:5432/langflow
ENV LANGFLOW_CONFIG_DIR=/var/lib/langflow

# Install dependencies
RUN apt-get update && apt-get install -y \
    build-essential \
    libpq-dev \
    && rm -rf /var/lib/apt/lists/*

# Copy the custom build of Langflow
COPY langflow-0.6.19a1.tar.gz /app/

# Set working directory
WORKDIR /app

# Install Langflow
RUN pip install langflow-0.6.19a1.tar.gz

# Expose the port Langflow runs on
EXPOSE 7860

# Run Langflow
CMD ["langflow"]

docker-compose.yml

# docker-compose.yml
version: '3.8'

services:
  langflow:
    build: .
    ports:
      - "7860:7860"
    depends_on:
      - postgres
    environment:
      - LANGFLOW_DATABASE_URL=postgresql://postgres:password@postgres:5432/langflow
      - LANGFLOW_CONFIG_DIR=/var/lib/langflow
    volumes:
      - langflow-data:/var/lib/langflow

  postgres:
    image: postgres:16
    ports:
      - "5432:5432"
    environment:
      - POSTGRES_USER=postgres
      - POSTGRES_PASSWORD=password
      - POSTGRES_DB=langflow
    volumes:
      - langflow-postgres:/var/lib/postgresql/data

volumes:
  langflow-data:
  langflow-postgres:

Resolving 403 Error

The 403 error when fetching types can be caused by invalid or expired access tokens or unauthorized URLs. Ensure your access tokens are valid and the URLs are authorized. The code includes mechanisms to renew access tokens and check authorized URLs:

Renew Access Token

async function tryToRenewAccessToken(error: AxiosError) {
    try {
        if (window.location.pathname.includes("/login")) return;
        const res = await renewAccessToken();
        if (res?.data?.access_token && res?.data?.refresh_token) {
            login(res?.data?.access_token);
        }
        if (error?.config?.headers) {
            delete error.config.headers["Authorization"];
            error.config.headers["Authorization"] = `Bearer ${cookies.get("access_token_lf")}`;
            const response = await axios.request(error.config);
            return response;
        }
    } catch (error) {
        clearBuildVerticesState(error);
        logout();
        return Promise.reject("Authentication error");
    }
}

Check Authorized URLs

const isAuthorizedURL = (url) => {
    const authorizedDomains = [
        "https://raw.githubusercontent.com/langflow-ai/langflow_examples/main/examples",
        "https://api.github.com/repos/langflow-ai/langflow_examples/contents/examples",
        "https://api.github.com/repos/langflow-ai/langflow",
        "auto_login",
    ];
    const authorizedEndpoints = ["auto_login"];

    try {
        const parsedURL = new URL(url);
        const isDomainAllowed = authorizedDomains.some(
            (domain) => parsedURL.origin === new URL(domain).origin
        );
        const isEndpointAllowed = authorizedEndpoints.some((endpoint) =>
            parsedURL.pathname.includes(endpoint)
        );

        return isDomainAllowed || isEndpointAllowed;
    } catch (e) {
        // Invalid URL
        return false;
    }
};

By ensuring the access token is valid and the URL is authorized, you can resolve the 403 error ^[1][2].

To continue talking to Dosu, mention @dosu.

[dosubot[bot]]

To resolve the Operation not permitted error when trying to change the ownership of /var/lib/langflow in your Docker container, you need to ensure that the operation is performed with the necessary permissions. Since the Dockerfile switches to a non-root user (user), you will need to perform the ownership change as the root user.

You can modify your Dockerfile to change the ownership before switching to the non-root user. Here is the updated Dockerfile:

FROM python:3.10-slim

RUN apt-get update && apt-get install gcc g++ git make -y && apt-get clean \
    && rm -rf /var/lib/apt/lists/*
RUN useradd -m -u 1000 user

# Change ownership of /var/lib/langflow before switching to non-root user
RUN chown -R user:user /var/lib/langflow

USER user
ENV HOME=/home/user \
    PATH=/home/user/.local/bin:$PATH

WORKDIR $HOME/app

COPY --chown=user . $HOME/app

RUN pip install langflow-0.6.19a1.tar.gz --user
CMD ["python", "-m", "langflow", "run", "--host", "0.0.0.0", "--port", "7860"]

This change ensures that the ownership of /var/lib/langflow is set correctly while the Dockerfile is still running as the root user, thus avoiding the Operation not permitted error ^[1].

To continue talking to Dosu, mention @dosu.

[SVyusti]

@dosu > [langflow stage-1 7/8] RUN chown -R user:user /var/lib/langflow:
0.660 chown: cannot access '/var/lib/langflow': No such file or directory

[dosubot[bot]]

To resolve the No such file or directory error when trying to change the ownership of /var/lib/langflow, you need to ensure that the directory exists before attempting to change its ownership. You can modify your Dockerfile to create the directory first. Here is the updated Dockerfile:

FROM python:3.10-slim

RUN apt-get update && apt-get install gcc g++ git make -y && apt-get clean \
    && rm -rf /var/lib/apt/lists/*
RUN useradd -m -u 1000 user

# Ensure the directory exists and change ownership
RUN mkdir -p /var/lib/langflow && chown -R user:user /var/lib/langflow

USER user
ENV HOME=/home/user \
    PATH=/home/user/.local/bin:$PATH

WORKDIR $HOME/app

COPY --chown=user . $HOME/app

RUN pip install langflow-0.6.19a1.tar.gz --user
CMD ["python", "-m", "langflow", "run", "--host", "0.0.0.0", "--port", "7860"]

This modification ensures that the /var/lib/langflow directory is created before changing its ownership, thus avoiding the No such file or directory error ^[1].

To continue talking to Dosu, mention @dosu.

[SVyusti]

i am getting:
AxiosError {message: 'Request failed with status code 403', name: 'AxiosError', code: 'ERR_BAD_REQUEST', config: {…}, request: XMLHttpRequest, …}
code
:
"ERR_BAD_REQUEST"
config
:
{transitional: {…}, adapter: Array(2), transformRequest: Array(1), transformResponse: Array(1), timeout: 0, …}
message
:
"Request failed with status code 403"
name
:
"AxiosError"
request
:
XMLHttpRequest {onreadystatechange: null, readyState: 4, timeout: 0, withCredentials: false, upload: XMLHttpRequestUpload, …}
response
:
{data: {…}, status: 403, statusText: 'Forbidden', headers: AxiosHeaders, config: {…}, …}
stack
:
"AxiosError: Request failed with status code 403\n at settle (http://0.0.0.0:7860/assets/index-9b144ae5.js:99:1305)\n at XMLHttpRequest.vt (http://0.0.0.0:7860/assets/index-9b144ae5.js:99:4974)\n at Axios.request (http://0.0.0.0:7860/assets/index-9b144ae5.js:101:3907)\n at async getAll (http://0.0.0.0:7860/assets/index-9b144ae5.js:123:190502)"
[[Prototype]]
:
Error

[dosubot[bot]]

The 403 error you're encountering is likely due to authentication or authorization issues. Here are some steps to troubleshoot and resolve this issue:

1. Check API Key or Access Token:
   Ensure that your API key or access token is correctly set and valid. You can set the access token as an environment variable in your Docker Compose file.

   version: "3.8"
   
   services:
     langflow:
       build: .
       ports:
         - "7860:7860"
       depends_on:
         - postgres
       environment:
         - LANGFLOW_DATABASE_URL=postgresql://postgres:password@postgres:5432/langflow
         - LANGFLOW_CONFIG_DIR=/var/lib/langflow
         - ACCESS_TOKEN=your_access_token_here
       volumes:
         - langflow-data:/var/lib/langflow
       command: >
         sh -c "chown -R 1000:1000 /var/lib/langflow && 
                chmod -R 755 /var/lib/langflow && 
                langflow"
   
     postgres:
       image: postgres:16
       environment:
         POSTGRES_USER: postgres
         POSTGRES_PASSWORD: password
         POSTGRES_DB: langflow
       ports:
         - "5432:5432"
       volumes:
         - langflow-postgres:/var/lib/postgresql/data
   
   volumes:
     langflow-data:
     langflow-postgres:

   Replace your_access_token_here with your actual access token.

2. Ensure Correct Permissions:
   Make sure the /var/lib/langflow directory has the correct permissions. This is already handled in the Docker Compose file above.

3. Check Authentication Settings:
   Verify that the authentication settings in Langflow are correctly configured. Misconfigurations in the AuthSettings class can lead to 403 errors. Ensure that SECRET_KEY, ALGORITHM, and token expiration times are correctly set.

4. API Key Security:
   Ensure that the API key is correctly passed in the request headers or query parameters. Langflow checks for the presence of an API key in the query parameters or headers. If neither is provided, or if the provided API key is invalid, a 403 error is raised.

   async def api_key_security(
       query_param: str = Security(api_key_query),
       header_param: str = Security(api_key_header),
       db: Session = Depends(get_session),
   ) -> Optional[User]:
       settings_service = get_settings_service()
       result: Optional[Union[ApiKey, User]] = None
       if settings_service.auth_settings.AUTO_LOGIN:
           result = get_user_by_username(db, settings_service.auth_settings.SUPERUSER)
       elif not query_param and not header_param:
           raise HTTPException(
               status_code=status.HTTP_403_FORBIDDEN,
               detail="An API key must be passed as query or header",
           )
       elif query_param:
           result = check_key(db, query_param)
       else:
           result = check_key(db, header_param)
   
       if not result:
           raise HTTPException(
               status_code=status.HTTP_403_FORBIDDEN,
               detail="Invalid or missing API key",
           )
       if isinstance(result, ApiKey):
           return result.user
       elif isinstance(result, User):
           return result

5. Renew Access Token:
   If the access token is expired, you need to renew it. Ensure that your frontend code handles token renewal properly.

   async function tryToRenewAccessToken(error: AxiosError) {
       try {
           if (window.location.pathname.includes("/login")) return;
           const res = await renewAccessToken();
           if (res?.data?.access_token && res?.data?.refresh_token) {
               login(res?.data?.access_token);
           }
           if (error?.config?.headers) {
               delete error.config.headers["Authorization"];
               error.config.headers["Authorization"] = `Bearer ${cookies.get("access_token_lf")}`;
               const response = await axios.request(error.config);
               return response;
           }
       } catch (error) {
           clearBuildVerticesState(error);
           logout();
           return Promise.reject("Authentication error");
       }
   }

By following these steps, you should be able to resolve the 403 error and ensure that Langflow operates correctly in your Docker container ^[1][2][3].

To continue talking to Dosu, mention @dosu.