# Fetch/XHR File upload

**URL:** <https://forums.creativeclouddeveloper.com/t/fetch-xhr-file-upload/2117>\
**Category:** UXP Plugin API\
**Tags:** fetch, storage\
**Created:** [October 27, 2020, 12:41pm UTC](https://forums.creativeclouddeveloper.com/t/fetch-xhr-file-upload/2117 "2020-10-27T12:41:56Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![kacper.rogowski](https://avatars.discourse-cdn.com/v4/letter/k/5e9695/32.png) [@kacper.rogowski](https://forums.creativeclouddeveloper.com/u/kacper.rogowski)\
**Post date:** [October 27, 2020, 12:41pm UTC](https://forums.creativeclouddeveloper.com/t/fetch-xhr-file-upload/2117/1 "2020-10-27T12:41:56Z")

</div>

Hi,  
currently working on plugin using new UXP api for Photoshop. My goal is to export the current visible file as a single PNG file, then grab this file and send it to backend.

I was able to export file using:

```auto
const uxp = require('uxp');
const PS = require('photoshop');
const lfs = uxp.storage.localFileSystem;
const activeDoc = PS.app.activeDocument;

async function exportFile() {
  let tempFolder = await lfs.getTemporaryFolder();
  await activeDoc.save(await tempFolder.createFile('temp.png'));

  setTimeout(async function () {
    const tempFile = (await tempFolder.getEntries()).find(entry => entry.name === 'temp.png');
    const data = await tempFile.read({ format: uxp.storage.formats.binary });
   //uploadXHR(data)
   //uploadFetch(data)
  }, 2000)
}

```

And now I’m having problems sending this file to backend. In CEP I’ve used to use node.js for grabing file and sending it to backend.

But now we dont have node.js so I’ve tried fetch and XHR and I have weird errors. Can someone help?

My XHR:

```auto
const uploadXHR = (file) => {
  const API_URL = 'http://localhost:8070'
  const UPLOAD_ENDPOINT = `${API_URL}/api/upload`;

  const xhr = new XMLHttpRequest();
  xhr.onload = () => {
    console.log(xhr.status)
  };

  xhr.onerror = (e) => {
    reject(new TypeError('Network request failed'));
  };

  xhr.ontimeout = () => {
    reject(new TypeError('Network request failed'));
  };

  xhr.open('POST', UPLOAD_ENDPOINT);
  xhr.send(file);
}

```

and my fetch:

```auto
const uploadFetch = (file) => {
  const API_URL = 'http://localhost:8070'
  const UPLOAD_ENDPOINT = `${API_URL}/api/recognition/async`;
  var data = new FormData()
  data.append('image', file)
  let response = await fetch(UPLOAD_ENDPOINT, {
    method: 'post',
    body: data
  });

  if (!response.ok) {
    throw new Error(`HTTP error fetching weather station; status: ${response.status}`);
  }

  let resJson = await response.json();
  console.log(resJson)
} 

```

---

<div class="post-metadata">

**Author:** ![kerrishotts](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/kerrishotts/32/8_2.png) [@kerrishotts](https://forums.creativeclouddeveloper.com/u/kerrishotts)\
**Post date:** [October 27, 2020, 5:30pm UTC](https://forums.creativeclouddeveloper.com/t/fetch-xhr-file-upload/2117/2 "2020-10-27T17:30:52Z")

</div>

What error(s) are you getting?

Also, try `http://127.0.0.1:8070` and see if that does any better.

---

<div class="post-metadata">

**Author:** ![kacper.rogowski](https://avatars.discourse-cdn.com/v4/letter/k/5e9695/32.png) [@kacper.rogowski](https://forums.creativeclouddeveloper.com/u/kacper.rogowski)\
**Post date:** [October 28, 2020, 3:17pm UTC](https://forums.creativeclouddeveloper.com/t/fetch-xhr-file-upload/2117/3 "2020-10-28T15:17:23Z")

</div>

Request are not reaching my server. Changing from `localhost` to `http://127.0.0.1:8070` resolved my issue.

---

<div class="post-metadata">

**Author:** ![kerrishotts](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/kerrishotts/32/8_2.png) [@kerrishotts](https://forums.creativeclouddeveloper.com/u/kerrishotts)\
**Post date:** [October 28, 2020, 3:31pm UTC](https://forums.creativeclouddeveloper.com/t/fetch-xhr-file-upload/2117/4 "2020-10-28T15:31:03Z")

</div>

Cool. `localhost` is subject to any local security restrictions like App Transport Security and the like, where as `127.0.0.1` is usually excluded. (Don’t know _why_, but thankfully one of those is!)