How do I connect python localhost to vue.js

Question:
I want to connect my vue.js replit to my local python repl but I am getting axios error when doing so.

Code

Python backend

from flask import Flask

from flask_cors import CORS, cross_origin

app = Flask(__name__)
cors = CORS(app)
app.config['CORS_HEADERS'] = 'Content-Type'


@app.route('/')
def index():
  return 'Hello from Flask!'

if __name__ == '__main__':
  app.run(debug=True, host="0.0.0.0", port=8000)

This is then running on URL in attached image
(see attached image

)

Vue.js frontend

Then in my frontend replit I am calling the localhost with the following function
(I tried this with both URLs but neither worked.

      axios({
          method:'get',
          url:  'http://127.31.196.40:8000/'   

        })
        .then(function(response){
            console.log(response);
        })

But this gave the errors Cross-Origin request blocked

Hi @jonathan165 !
Replit websites don’t use localhost. Instead, in the Python repl, run the repl, open the website in a new tab from the Webview and not the Console, then use that URL [1] in the Vue.js code.
Hope this helps!


  1. It should be a replit.dev url ↩︎

2 Likes

Great thanks for the help

Hey @jonathan165!

Please mark this post as the solution if it solved your problem so people with the same issue can easily find the solution.

cc: @QwertyQwerty88 @dragonhunter1 @MattDESTROYER @Firepup650

1 Like

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.