如何在HTML中访问Flask会话变量? [英] How to access Flask session variables in HTML?

问题描述

我正在尝试构建一个JavaScript函数，该函数将为Spotify中的指定用户播放列表构建适当的嵌入链接.

I am trying to build a JavaScript function that will build the appropriate embed link for a specified user playlist in Spotify.

截至目前，我在Flask应用程序标题"playlist_id"中拥有一个会话变量，其中包含我想要的Spotify播放列表ID；还有一个JavaScript函数，该JavaScript函数应针对嵌入的Spotify播放列表更新iframe元素中的src属性.

As of now, I have a session variable in my Flask app title 'playlist_id' that holds the Spotify playlist ID I want and a JavaScript function that should update the src attribute in the iframe element for embedded Spotify playlists.

@app.route("/playlist/build", methods=['GET', 'POST'])
def build():

    if request.method == 'GET':
        print(request.method)
        return render_template("loading.html")

    elif request.method == 'POST':
        print(request.method)
        # Twython
        OAUTH_TOKEN = session.get('auth_oauth_token')
        OAUTH_TOKEN_SECRET = session.get('auth_token_secret')
        OAUTH_VERIFIER = session.get('oauth_verifier')

        auth_client = Twython(consumer_key, consumer_secret, OAUTH_TOKEN, OAUTH_TOKEN_SECRET)
        auth_creds = auth_client.get_authorized_tokens(OAUTH_VERIFIER)

        twitter = Twython(consumer_key, consumer_secret, auth_creds['oauth_token'], auth_creds['oauth_token_secret']) # Authenticated Twython instance (used to access user Twitter account information)

        # Spotipy
        access_token = session.get("spotify_access_token")
        sp = spotipy.Spotify(auth=access_token) # Authenticated Spotipy instance (used to access user Spotify account information)

        # Collecting and filtering posted statuses from user's Twitter account for Spotify links
        t_screename = twitter.get_account_settings()['screen_name']
        statuses = get_user_statuses(t_screename, twitter)
        spotify_urls = filter_statuses(statuses)

        # Using found Spotify tracks to build a tracklist
        s_screename = sp.current_user()['display_name']
        tracks = build_track_uri_list(convert_url_to_track(sp, spotify_urls))

        # Creating playlist and adding found tracks (Note: Only adds most recent 100 songs ~ issues with limits on the Spotify API)
        playlist_id = create_spotify_playlist(sp, s_screename)
        add_tracks(sp, s_screename, playlist_id, tracks)

        session['playlist_id'] = playlist_id

        return 'done'

<iframe id="playlist-embed" src="getPlaylistLink()" width="300" height="380" frameborder="0" allowtransparency="true" allow="encrypted-media"></iframe>

    <script>
     function getPlaylistLink() {
         var playlist_id = {{ session['playlist_id'] }};
         var pid_string = playlist_id.toString();

         var embedUrlPrefix = "https://open.spotify.com/embed/playlist/";

         var src = embedUrlPrefix.concat(pid_string);
         // var src = 'https://open.spotify.com/embed/playlist/' + String(playlist_id);
         console.log(src);
         return src
      }
      document.onload = function() {
      document.getElementById('playlist-embed').src=getPlaylistLink();
      };
    </script>

即使从浏览器中发布该URL似乎是正确的，我仍然收到此函数返回的URL的404错误.控制台似乎也正在捕获字符串，因此我对功能为何无法正常工作感到非常困惑.

I keep getting a 404 error for the URL returned from this function even though it seems to be correct when I post it in my browser. The console also seems to be catching the string as well so I'm just really confused on why the function is not working correctly.

运行此应用程序时的控制台示例:

An example of the console on a run of this app:

<script>
     function getPlaylistLink() {
         var playlist_id = 3n6Sa0lMIl4Dr293oUYspr;
         var pid_string = playlist_id.toString();

         var embedUrlPrefix = "https://open.spotify.com/embed/playlist/";

         var src = embedUrlPrefix.concat(pid_string);
         // var src = 'https://open.spotify.com/embed/playlist/' + String(playlist_id);
         console.log(src);
         return src
      }
      document.onload = function() {
      document.getElementById('playlist-embed').src=getPlaylistLink();
      };
</script>

推荐答案

< iframe src ="getPlaylistLink()"> -您不能在其中放置JavaScript.

<iframe src="getPlaylistLink()"> - you can't put JavaScript there.

您有两个选择:

• 不要一开始指定src(或使用about:blank等)，并从您的JavaScript代码中设置src

• 请勿使用JavaScript.您不需要它！您只需在服务器上生成src:

• Don't specify a src initially (or use about:blank etc.) and set the src from your JavaScript code

• Don't use JavaScript for it. You don't need it! You can just generate the src on the server:

<iframe src="https://open.spotify.com/embed/playlist/{{ session.playlist_id }}">

这篇关于如何在HTML中访问Flask会话变量?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！