Boostrap - My table can't read a local json file

i don't know, i can't read some json file ou put a table which read json data (internal or external source)

Someone have an idea ?

here is my link and script i used

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/css/bootstrap.min.css">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-table/1.10.1/bootstrap-table.min.css">
  <script src="https://unpkg.com/bootstrap-table@1.15.5/dist/bootstrap-table.min.js"></script>

Here is my script where I create the table, i use data-url to load the data from a local json file

<table id="table" data-toggle="table" data-height="460" data-search="true" data-url="data.json">
    <thead>
      <tr>
        <th data-field="id">#</th>
        <th data-field="oeuvre" data-search-formatter="false" data-formatter="nameFormatter">Oeuvres</th>
        <th data-field="type" data-formatter="nameFormatter">Type</th>
        <th data-field="artist" data-formatter="nameFormatter">Artiste</th>
        <th data-field="sheet" data-formatter="nameFormatter">Fiche</th>
      </tr>
    </thead>
  </table>
  <script>
    $table.bootstrapTable('refresh',{data: data})
  })

    function nameFormatter(value) {
      return 'Formatted ' + value
    }
  var $table = $('#table')

  $(function() {
    var data = [
      {"id":1,"oeuvre":"choppe","type":"Ambre","artist":"Etienne","sheet":"<a href=\"description.html\">"}
    ]
    $table.bootstrapTable({data: data})
  })
</script>

i really don't know why it doesn't work...

thanks in advance