# How do I load a JSON file?

**URL:** <https://discuss.kotlinlang.org/t/how-do-i-load-a-json-file/4422>\
**Category:** JavaScript\
**Created:** [September 1, 2017, 7:08pm UTC](https://discuss.kotlinlang.org/t/how-do-i-load-a-json-file/4422 "2017-09-01T19:08:04Z")\
**Posts on this page:** 13\
**Page:** 1

<div class="post-metadata">

**Author:** ![karelp](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.kotlinlang.org/karelp/32/4161_2.png) [@karelp](https://discuss.kotlinlang.org/u/karelp)\
**Post date:** [September 1, 2017, 7:08pm UTC](https://discuss.kotlinlang.org/t/how-do-i-load-a-json-file/4422/1 "2017-09-01T19:08:04Z")

</div>

Hey!

I’m learning how to work with Kotlin and Javascript, and right now, I’m trying to load a .json file that’s present on the same server the website itself is hosted from.

How would I go about this? There’s a [JSON](https://kotlinlang.org/api/latest/jvm/stdlib/kotlin.js/-j-s-o-n/index.html) object but the documentation doesn’t really say how to use it.

Thanks!

---

<div class="post-metadata">

**Author:** ![bashor](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.kotlinlang.org/bashor/32/1431_2.png) [@bashor](https://discuss.kotlinlang.org/u/bashor)\
**Post date:** [September 4, 2017, 4:48pm UTC](https://discuss.kotlinlang.org/t/how-do-i-load-a-json-file/4422/2 "2017-09-04T16:48:57Z")

</div>

Actually, (according to documentation) it’s just declaration to use JS builtin JSON object, you can find more info about it on [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON), for example.

---

<div class="post-metadata">

**Author:** ![karelp](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.kotlinlang.org/karelp/32/4161_2.png) [@karelp](https://discuss.kotlinlang.org/u/karelp)\
**Post date:** [September 4, 2017, 5:00pm UTC](https://discuss.kotlinlang.org/t/how-do-i-load-a-json-file/4422/3 "2017-09-04T17:00:45Z")

</div>

Right, so I can use it to parse a string into a JSON object graph, the problem I’m having is that I don’t undertstand where to get this string from, ie. how do I read the file?

---

<div class="post-metadata">

**Author:** ![bashor](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.kotlinlang.org/bashor/32/1431_2.png) [@bashor](https://discuss.kotlinlang.org/u/bashor)\
**Post date:** [September 4, 2017, 5:05pm UTC](https://discuss.kotlinlang.org/t/how-do-i-load-a-json-file/4422/4 "2017-09-04T17:05:21Z")

</div>

You can use [Fetch API](https://kotlinlang.org/api/latest/jvm/stdlib/org.w3c.fetch/index.html) or [XMLHttpRequest API](https://kotlinlang.org/api/latest/jvm/stdlib/org.w3c.xhr/-x-m-l-http-request/index.htmluest/index.html) for that.

---

<div class="post-metadata">

**Author:** ![karelp](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.kotlinlang.org/karelp/32/4161_2.png) [@karelp](https://discuss.kotlinlang.org/u/karelp)\
**Post date:** [September 29, 2017, 8:56pm UTC](https://discuss.kotlinlang.org/t/how-do-i-load-a-json-file/4422/5 "2017-09-29T20:56:49Z")

</div>

I can’t really get the fetch API to work, neither with resources on the same site nor with a site like pastebin. For example:

```auto
Request("https://pastebin.com/raw/p58mH6Cd").text().then(onFulfilled = {println(it)})
```

Shouldn’t that work?

---

<div class="post-metadata">

**Author:** ![Alexey.Andreev](https://avatars.discourse-cdn.com/v4/letter/a/e36b37/32.png) [@Alexey.Andreev](https://discuss.kotlinlang.org/u/Alexey.Andreev)\
**Post date:** [October 2, 2017, 7:58am UTC](https://discuss.kotlinlang.org/t/how-do-i-load-a-json-file/4422/6 "2017-10-02T07:58:10Z")

</div>

This code works for me:

```kotlin
import kotlin.browser.*
import org.w3c.fetch.*

fun main(args: Array<String>) {
    window.fetch(Request("https://raw.githubusercontent.com/JetBrains/kotlin/master/.gitignore")).then(onFulfilled = {
        it.text().then(onFulfilled = {
            println(it)
        })
    })
}

```

---

<div class="post-metadata">

**Author:** ![karelp](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.kotlinlang.org/karelp/32/4161_2.png) [@karelp](https://discuss.kotlinlang.org/u/karelp)\
**Post date:** [October 2, 2017, 7:55pm UTC](https://discuss.kotlinlang.org/t/how-do-i-load-a-json-file/4422/7 "2017-10-02T19:55:47Z")

</div>

And how would this work for a file on the same site? Trying to fetch `"res/test.txt"` results in the following error:  
`Main.kt:5 Fetch API cannot load file:///D:/Programming/Kotlin/SiteTest/web/res/test.txt. URL scheme must be "http" or "https" for CORS request.`

---

<div class="post-metadata">

**Author:** ![Konstantin-Khvan](https://avatars.discourse-cdn.com/v4/letter/k/4af34b/32.png) [@Konstantin-Khvan](https://discuss.kotlinlang.org/u/Konstantin-Khvan)\
**Post date:** [October 3, 2017, 8:06am UTC](https://discuss.kotlinlang.org/t/how-do-i-load-a-json-file/4422/8 "2017-10-03T08:06:33Z")

</div>

Thats a browser safety feature. Imagine any site can read any file on your device thats bad for security.  
You have to serve files with some kind of server.  
For tutorial porpoises there are simplistic web servers built in node.js/python/ IDEA itself and many others.  
If you are using IDEA try opening html file with IDE it will spin up internal server and serve whole folder contents. You can access files in there with relative paths in html.

---

<div class="post-metadata">

**Author:** ![Alexey.Andreev](https://avatars.discourse-cdn.com/v4/letter/a/e36b37/32.png) [@Alexey.Andreev](https://discuss.kotlinlang.org/u/Alexey.Andreev)\
**Post date:** [October 3, 2017, 8:07am UTC](https://discuss.kotlinlang.org/t/how-do-i-load-a-json-file/4422/9 "2017-10-03T08:07:31Z")

</div>

This won’t work with filesystem, it’s not Kotlin constraint it’s rather because of XSS protection in browsers. You should serve your HTML, JS and files from HTTP server.

---

<div class="post-metadata">

**Author:** ![karelp](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.kotlinlang.org/karelp/32/4161_2.png) [@karelp](https://discuss.kotlinlang.org/u/karelp)\
**Post date:** [October 3, 2017, 7:30pm UTC](https://discuss.kotlinlang.org/t/how-do-i-load-a-json-file/4422/10 "2017-10-03T19:30:22Z")

</div>

Ah but using relative paths like that will start working when I host them on an actual server?

I didn’t even think about the security implications this would have if it actually worked 🙂 . The build-in IDEA web server will do fine for now, thanks for the suggestion @Konstantin-Khvan.

---

<div class="post-metadata">

**Author:** ![Alexey.Andreev](https://avatars.discourse-cdn.com/v4/letter/a/e36b37/32.png) [@Alexey.Andreev](https://discuss.kotlinlang.org/u/Alexey.Andreev)\
**Post date:** [October 4, 2017, 7:47am UTC](https://discuss.kotlinlang.org/t/how-do-i-load-a-json-file/4422/11 "2017-10-04T07:47:12Z")

</div>

> [@karelp](#):
>
> Ah but using relative paths like that will start working when I host them on an actual server?

Yes, this should work. `res/test.txt` will load file relative to a HTML page you are sending request from. `/res/test.txt` will load file from the current host and corresponding path (for example, `http://localhost:8080/res/test.txt`).

---

<div class="post-metadata">

**Author:** ![mrtact](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.kotlinlang.org/mrtact/32/4751_2.png) [@mrtact](https://discuss.kotlinlang.org/u/mrtact)\
**Post date:** [October 4, 2017, 4:37pm UTC](https://discuss.kotlinlang.org/t/how-do-i-load-a-json-file/4422/12 "2017-10-04T16:37:36Z")

</div>

There are also quick and dirty one-liners to do basic web serving out of a file folder: [Big list of http static server one-liners · GitHub](https://gist.github.com/willurd/5720255).

---

<div class="post-metadata">

**Author:** ![karelp](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.kotlinlang.org/karelp/32/4161_2.png) [@karelp](https://discuss.kotlinlang.org/u/karelp)\
**Post date:** [October 7, 2017, 12:22pm UTC](https://discuss.kotlinlang.org/t/how-do-i-load-a-json-file/4422/13 "2017-10-07T12:22:43Z")

</div>

I know it’s not strictly Kotlin-related any more, but is there a way to start the build-in Idea server as a run configuration? Otherwise I’ll have to resort to one of the web serving one-liners 🙂.
