Как получить доступ к переменным сеанса Flask в HTML?

Question

Я пытаюсь создать функцию JavaScript, которая создаст соответствующую ссылку для встраивания для указанного плейлиста пользователя в Spotify.

На данный момент в заголовке моего приложения Flask 'playlist_id' есть переменная сеанса, в которой содержится требуемый идентификатор списка воспроизведения Spotify, и функция JavaScript, которая должна обновлять атрибут src в элементе iframe для встроенных списков воспроизведения Spotify.

@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>

Я получаю сообщение об ошибке 404 для URL-адреса, возвращенного из этой функции, даже если оно кажется правильным, когда я публикую его в своем браузере. Консоль также, кажется, перехватывает строку, так что я просто не понимаю, почему эта функция работает неправильно.

Пример консоли при запуске этого приложения:

<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>

Answer 1

@ ThiefMaster прав. Вам не нужно использовать JavaScript для этого типа «пользовательских» запросов. За исключением случаев, когда вы хотите выполнить обновление ссылки без перезагрузки страницы (для этого она будет зацикливаться на запросе GET).

Подробнее: значение переменной javascript "playlist_id" является строкой, поэтому она должнабыть объявлено с var playlist_id = "{{ session['playlist_id'] }}";, поэтому "pid_string" не требуется.

Answer 2

<iframe src="getPlaylistLink()"> - вы не можете поместить туда JavaScript.

У вас есть два варианта:

• Не указывать src изначально (или использовать about: blank и т. Д.)) и установите src из вашего кода JavaScript

• Не используйте JavaScript для этого. Вам это не нужно! Вы можете просто сгенерировать src на сервере:

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