JavaScript加載json數據錯誤解決

JavaScript加載json數據錯誤解決

  這個問題花了一天才解決，必須將這個悲傷的經歷記錄下來。

• 引言

  這兩天爲了完成物聯網實時數據分析服務前端可視化的設計，需要用到Echarts擴展的百度地圖API來完成熱力圖的顯示，因此到Echarts官網去看demo，然後copy了demo上的代碼直接放到JSP文件中，有興趣可以去Echarts官網去找。然而，我的問題出現在，其源碼中是用jQuery+xajax中的方法$.get()來獲取本地的json文件，但是我將項目發佈到Tomcat上的時候無法獲取到json文件，提示http500error。

• 問題查詢過程

一開始並不知道是json文件無法獲取，以爲是引用的jQuery.js文件不成功，但是在瀏覽器f12控制檯中無任何錯誤。同時我發現在Echarts的官網教程中有一部分是專門講解數據異步加載的，這裏面同時也提到了￥$.get()，後來是在f12的網絡中發現瞭如下的信息：

這才完成確定是因爲Tomcat無法獲取到json文件，因此在百度上搜了半天。

• 解決結果

最終在百度上搜到簡書上的一個方法https://www.jianshu.com/p/a7a...。

在web.xml配置文件中添加以下代碼：

  <servlet-mapping>   <!--解決了json無法調用的問題-->
    <servlet-name>default</servlet-name>
    <url-pattern>/json/*</url-pattern>
  </servlet-mapping>

我的maven springmvc項目目錄如下：

• 深入理解

  接下來我還需要了解一下<servlet-mapping>在web.xml中的作用，和爲什麼Tomcat沒有這一項設置就無法加載json文件？
解決：Servlet-mapping是什麼都可以在其他博客上找到，其實上述的方法就是配置了Servlet來找到json靜態文件，
  在後期的工作中會將項目放到服務器上，會不會還會出什麼問題，都需要進一步瞭解。待續。。。項目託管在碼雲上。