# Viewport

> Source: https://scrape.do/documentation/headless-browser/viewport/

Configure browser window dimensions

The viewport defines the visible area of the browser window. Adjusting viewport dimensions is crucial for responsive web scraping, as many websites render different content based on screen size. Mobile-optimized sites may show simplified layouts, while desktop viewports reveal full navigation menus and sidebars.

### Width

You can change the width dimension of the browser viewport by passing the `width=1920` parameter. The default width is 1920 pixels, which represents a standard desktop display.

Common width values:
- **1920px** - Full HD desktop (default)
- **1366px** - Standard laptop
- **768px** - Tablet
- **375px** - Mobile device

**cURL (API mode)**

```bash
curl --location --request GET 'https://api.scrape.do/?url=https://httpbin.co/anything&render=true&token=YOUR_TOKEN&width=1920&height=1024'
```

**Python (API mode)**

```python
import requests
import urllib.parse
token = "YOUR_TOKEN"
targetUrl = urllib.parse.quote("https://httpbin.co/anything")
render = "true"
width = "1920"
height = "1024"
url = "http://api.scrape.do/?token={}&url={}&render={}&width={}&height={}".format(token, targetUrl,render,width,height)
response = requests.request("GET", url)
print(response.text)
```

**Node.js (API mode)**

```javascript
const axios = require('axios');
const token = "YOUR_TOKEN";
const targetUrl = encodeURIComponent("https://httpbin.co/anything");
const render = "true";
const width = "1920";
const height="1024"
const config = {
    'method': 'GET',
    'url': `https://api.scrape.do/?token=${token}&url=${targetUrl}&render=${render}&width=${width}&height=${height}`,
    'headers': {}
};
axios(config)
    .then(function (response) {
        console.log(response.data);
    })
    .catch(function (error) {
        console.log(error);
    });
```

**cURL (Proxy mode)**

```bash
curl -k -x "http://YOUR_TOKEN:render=true&height=1024&width=1920@proxy.scrape.do:8080" 'https://httpbin.co/anything' -v
```

**Python (Proxy mode)**

```python
import requests
import urllib3
urllib3.disable_warnings(urllib3.exceptions.InsecureRequestWarning)
url = "https://httpbin.co/anything"
token = "YOUR_TOKEN"
proxyModeUrl = "http://{}:render=true&height=1024&width=1920@proxy.scrape.do:8080".format(token)
proxies = {
    "http": proxyModeUrl,
    "https": proxyModeUrl,
}
response = requests.request("GET", url, proxies=proxies, verify=False)
print(response.text)
```

**Node.js (Proxy mode)**

```javascript
const axios = require('axios');
const token = "YOUR_TOKEN";
const targetUrl = "https://httpbin.co/anything";

axios({
    method:"GET",
    url:targetUrl,
    proxy: {
        protocol:'http',
        host: 'proxy.scrape.do',
        port: 8080,
        auth: {
            username: token,
            password: 'render=true&height=1024&width=1920'
        }
    }
})
    .then(response => {
        console.log(response.data);
    })
    .catch(error => {
        console.error(error.message);
    });
```

*(Go, Ruby, Java, C#, PHP examples are also available on the HTML version.)*

### Height

You can change the height dimension of the browser viewport by passing the `height=1080` parameter. The default height is 1080 pixels.

Height affects how much vertical content is initially visible before scrolling is required. Taller viewports can capture more "above the fold" content, while shorter heights better simulate mobile browsing experiences.

**cURL (API mode)**

```bash
curl --location --request GET 'https://api.scrape.do/?url=https://httpbin.co/anything&token=YOUR_TOKEN&render=true&height=1024&width=1920'
```

**Python (API mode)**

```python
import requests
import urllib.parse

token = "YOUR_TOKEN"
targetUrl = urllib.parse.quote("https://httpbin.co/anything")
render = "true"
height = "1024"
width = "1920"
url = "http://api.scrape.do/?token={}&url={}&render={}&height={}&width={}".format(token, targetUrl,render,height,width)
response = requests.request("GET", url)
print(response.text)
```

**Node.js (API mode)**

```javascript
const axios = require('axios');
const token = "YOUR_TOKEN";
const targetUrl = encodeURIComponent("https://httpbin.co/anything");
const render = "true";
const height = "1024";
const width="1920";
const config = {
    'method': 'GET',
    'url': `https://api.scrape.do/?token=${token}&url=${targetUrl}&render=${render}&height=${height}&width=${width}`,
    'headers': {}
};
axios(config)
    .then(function (response) {
        console.log(response.data);
    })
    .catch(function (error) {
        console.log(error);
    });
```

**cURL (Proxy mode)**

```bash
curl -k -x "http://YOUR_TOKEN:render=true&height=1024&width=1920@proxy.scrape.do:8080" 'https://httpbin.co/anything' -v
```

**Python (Proxy mode)**

```python
import requests
import urllib3
urllib3.disable_warnings(urllib3.exceptions.InsecureRequestWarning)
url = "https://httpbin.co/anything"
token = "YOUR_TOKEN"
proxyModeUrl = "http://{}:render=true&height=1024&width=1920@proxy.scrape.do:8080".format(token)
proxies = {
    "http": proxyModeUrl,
    "https": proxyModeUrl,
}
response = requests.request("GET", url, proxies=proxies, verify=False)
print(response.text)
```

**Node.js (Proxy mode)**

```javascript
const axios = require('axios');
const token = "YOUR_TOKEN";
const targetUrl = "https://httpbin.co/anything";

axios({
    method:"GET",
    url:targetUrl,
    proxy: {
        protocol:'http',
        host: 'proxy.scrape.do',
        port: 8080,
        auth: {
            username: token,
            password: 'render=true&height=1024&width=1920'
        }
    }
})
    .then(response => {
        console.log(response.data);
    })
    .catch(error => {
        console.error(error.message);
    });
```

*(Go, Ruby, Java, C#, PHP examples are also available on the HTML version.)*