Why the port other than 5006 can not be used in server_embed example?

I modeified the example flask_embed. My folder structure is as follows,

flask_embed
|
|--flask_embed.py
   templates
   |--index.html
   |--embed.html

The modified code runs just fine.

If the port 5006 was changed to 5007, then the plot can not be shown and the plot link(http://localhost:5007/bkapp) can not be connected. However, the port 5007 runs fine in my another app.
My problem is why can’t I choose another port other than 5006?

flask_embed.py

from threading import Thread

from flask import Flask, render_template, request
from tornado.ioloop import IOLoop

from bokeh.embed import server_document
from bokeh.layouts import column
from bokeh.models import ColumnDataSource, Slider
from bokeh.plotting import figure
from bokeh.sampledata.sea_surface_temperature import sea_surface_temperature
from bokeh.server.server import Server
from bokeh.themes import Theme

app = Flask(__name__)


def bkapp(doc):
    df = sea_surface_temperature.copy()
    source = ColumnDataSource(data=df)

    plot = figure(x_axis_type='datetime', y_range=(0, 25), y_axis_label='Temperature (Celsius)',
                  title="Sea Surface Temperature at 43.18, -70.43")
    plot.line('time', 'temperature', source=source)

    def callback(attr, old, new):
        if new == 0:
            data = df
        else:
            data = df.rolling(f"{new}D").mean()
        source.data = ColumnDataSource.from_df(data)

    slider = Slider(start=0, end=30, value=0, step=1, title="Smoothing by N Days")
    slider.on_change('value', callback)

    doc.add_root(column(slider, plot))

    doc.theme = Theme(filename="theme.yaml")


@app.route('/',methods=['GET'])
def index():
	return render_template('index.html')


@app.route('/home',methods=['POST'])
def home():
	width = request.values['innerWidth']
	height = request.values['innerHeight']
	Thread(target=bk_worker).start()
	script = server_document('http://localhost:5006/bkapp')
	return render_template("embed.html", script=script, template="Flask")


def bk_worker():
    server = Server({'/bkapp': bkapp}, io_loop=IOLoop(), allow_websocket_origin=["localhost:8000", "localhost:5006"])
    server.start()
    server.io_loop.start()


if __name__ == '__main__':
	app.run(port=8000)

index.html

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>home</title>
</head>
<body>
<form id="ABCD" name="ABCD" action="home" method="POST">
 <input type="hidden" id="ABCD_1" name="innerWidth" value='111'>
 <input type="hidden" id="ABCD_2" name="innerHeight" value='222'>
</form>
<script>
window.onload = function(){
	if(window.innerWidth) {
        document.getElementById('ABCD_1').value = window.innerWidth;
		document.getElementById('ABCD_2').value = window.innerHeight;
	}
	else if(document.documentElement.clientWidth) {
		document.getElementById('ABCD_1').value = document.documentElement.clientWidth;
		document.getElementById('ABCD_2').value = document.documentElement.clientHeight;
	}
	else if(document.body.clientWidth) {
		document.getElementById('ABCD_1').value = document.body.clientWidth;
		document.getElementById('ABCD_2').value = document.body.clientHeight;
	}
	document.forms['ABCD'].submit();
}
</script>
</body>
</html>

embed.html

<!doctype html>

<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Embedding a Bokeh Server With {{ framework }}</title>
</head>

<body>
  <div>
    This Bokeh app below served by a Bokeh server that has been embedded
    in another web app framework. For more information see the section
    <a  target="_blank" href="https://docs.bokeh.org/en/latest/docs/user_guide/server.html#embedding-bokeh-server-as-a-library">Embedding Bokeh Server as a Library</a>
    in the User's Guide.
  </div>
  {{ script|safe }}
</body>
</html>

You would need to specify the same new port to match up in at least two places:

  • The call to Server
  • The corresponding call to server_document

And also allow_websocket_origin if you are not using the * wildcard, and you want to be able to open the app locally directly.

Hello Bryan,
I had tried what you said, modified these two key places,

  • *The call to Server
server = Server({'/bkapp': bkapp}, io_loop=IOLoop(), allow_websocket_origin=["localhost:8000", "localhost:5007"])
  • The corresponding call to server_document
script = server_document('http://localhost:5007/bkapp')

My problem is why I can not connect to “http://localhost:5007/”? However, it is no problem to connect to "“http://localhost:5006/”.

You have not passed the port parameter to Server.

OK, thank you.

server = Server({'/bkapp': bkapp}, io_loop=IOLoop(), port=5007, allow_websocket_origin=["*"])