使用AJAX將RSS feed傳遞到Django視圖

Question

我對ajax相當陌生，下面是我的用例：我正在開發一個附帶項目，它將顯示新聞和各種體育賽事的得分。 為了執行相同的操作，我使用來自不同來源的rss feed。 我能夠使用'feedparser'插件在django視圖中獲取並解析rss feed，並將與上下文相同的內容傳遞給相應的模板。 以下是我的查看功能和模板（用於板球）。

def cricket(request):
    feeds_cric = feedparser.parse('http://www.espncricinfo.com/rss/content/story/feeds/0.xml') #espncricinfo feed.
    feeds_cric_scores = feedparser.parse('http://static.cricinfo.com/rss/livescores.xml') #espncricinfo feed.
    context = {'feeds_cric': feeds_cric,'feeds_cric_scores' : feeds_cric_scores}
    return render(request,'scorecenter/cricket.html', context)

以下是相應的模板。

{% extends "scorecenter/index.html" %}
{% block content %}
    <ul>
        {% for entry in feeds_cric.entries %}
        <li><a href="{{ entry.link }}">{{ entry.title }}</a></li>
        <p>{{ entry.description }}</p>
        {% endfor %}
    </ul>

{% endblock content %}

{% block score %}
    <ul>
        {% for entry in feeds_cric_scores.entries %}
        <li><a href="{{ entry.link }}">{{ entry.title }}</a></li>
        <!-- <p>{{ entry.description }}</p> -->
        {% endfor %}
    </ul>
{% endblock score %}

以下是index.html文件。

現在，我想使用AJAX僅重新加載頁面的某些塊，而不是重新加載和重定向整個頁面。 我寫了一個腳本來檢查

<body>
    <nav class="navbar navbar-inverse navbar-fixed-top">
        <div class="container-fluid">
            <div class="navbar-header">
                <a class="navbar-brand" href="#">Allscores</a>
            </div>
            <div>
                <ul class="nav navbar-nav navbar-right">
                    <li><a href="#" onclick="urlChecker('cricket')">Cricket</a></li>
                    <li><a href="#" onclick="urlChecker('football')">Football</a></li>
                    <li><a href="#" onclick="urlChecker('basketball')">Basketball</a></li>
                    <li><a href="#" onclick="urlChecker('tennis')">Tennis</a></li>
                </ul>
            </div>
        </div>
    </nav>
    <div class="navbar navbar-default" id="empty_nav"></div>

    <div class="testingData">This should be updated</div>

    <div class="row">
        <div class="col-sm-8" id="news">

            <h3>Latest News</h3>
            {% block content %}
            {% endblock content %}

        </div>
        <div class="col-sm-4" id="scores">

            <h3>Latest scores</h3>
            {% block score %}
            {% endblock score %}

        </div>
    </div>

    <div id="footer">
        Copyright © acllscores.com
    </div>
</body>

在我的urlChecker（）腳本中，我檢查單擊了哪個錨標記並分配了相應的url。 以下是腳本：

function urlChecker (route) {
    switch(route) {
        case 'cricket':
            $.post( "/scorecenter/cricket/", function( data ) {
                $( ".result" ).html( data );
            });
            break;
        case 'football':
            $.post( "/scorecenter/football/", function( data ) {
                $( ".testingData" ).html( data );
            });
            break;
        case 'tennis':
            $.post( "/scorecenter/tennis/", function( data ) {
                $( ".testingData" ).html( data );
            });
            break;
        case 'basketball':
            $.post( "/scorecenter/basketball/", function( data ) {
                $( ".testingData" ).html( data );
            });
            break;

    }
}

更新：添加網址文件：

urlpatterns = patterns('',
    url(r'^$', views.index,name='index'),
    url(r'^test/$', views.test,name='test'),

    url(r'^cricket/$', views.cricket,name='cricket'),
    url(r'^basketball/$', views.basketball,name='basketball'),
    url(r'^football/$', views.football,name='football'),
    url(r'^tennis/$', views.tennis,name='tennis'),

)

我不知道如何使用Ajax將提要數據發布到模板中。 請幫忙

Answer 1

從Ajax的角度來看

從您在問題中寫的內容來看，發送GET請求而不是POST請求更為合適。 您不會將任何信息發送到它們需要存儲的這些端點，而只想從它們檢索更新。 這不會改變您的大部分代碼，您可以使用☞ $.get()代替$.post() 。

從Django的角度來看

發送GET請求也更加容易，因為您無需考慮☞Django的CSRF保護。 發出其他ajax請求（例如POST ， DELETE等）也不是那么困難，但是它需要一個額外的步驟，該步驟涉及隨每個請求發送CSRF令牌（在鏈接的文檔中有詳細記錄）。

呈現Ajax請求的結果

當前，用於呈現Ajax結果的模板可能存在概念性問題，例如scorecenter/cricket.html 。 最頂層是從index.html擴展的，這意味着每個請求不僅將返回要插入的html塊，還將返回index.html一部分的任何內容。

另外，由於您將通過Javascript將結果插入到已加載的網站中，因此無需定義模板塊。 讓這些模板僅使用$('.testingData').html(data)精確呈現要插入到DOM中的$('.testingData').html(data) 。

使用Ajax請求調試問題

在開發網站時，請在瀏覽器中打開開發人員工具並在其中激活控制台（Firefox和Chrome都可以）。 每當Ajax請求失敗時，它將在此處顯示錯誤，然后您可以進行自省。

常見錯誤為404 （如果找不到端點）， 400或403如果請求未被授權）或500如果服務器在處理您的請求時出錯）。 ☞更完整的狀態碼列表

請隨時更新您的問題，並提供更多詳細信息。 由於這是一個非常廣泛的主題，因此請做好准備，使其可能被社區關閉。 在這種情況下，您始終可以搜索更具體的問題，或者，如果找不到答案，請將其放在新問題中。

使用AJAX將RSS feed傳遞到Django視圖

問題描述

1 個解決方案

解決方案1
1 2015-04-23 16:15:02

使用AJAX將RSS feed傳遞到Django視圖

問題描述

1 個解決方案

解決方案1 1 2015-04-23 16:15:02

解決方案1
1 2015-04-23 16:15:02